读书人

CSS:怎么更改ul/li标签的显示位置!多谢

发布时间: 2012-03-02 14:40:28 作者: rapoo

CSS高手请进:如何更改ul/li标签的显示位置!谢谢!!!(我攒分了会追加结分)
HTML代码如下:

<div id= "d1 ">
<ul id= "nav ">
<li> <a href= "# "> AAA </a> </li>
<li> <a href= "# "> AAA </a> </li>
<li> <a href= "# "> AAA </a> </li>
<li> <a href= "# "> AAA </a> </li>
<li> <a href= "# "> AAA </a> </li>
<li> <a href= "# "> AAA </a> </li>
</ul>
</div>

因为li列表总是顺序向下排列的,现在我想让下面三个AAA排到右边来,且和左边留有一定的空隙,最好上下li之间也留有一定的空隙,要求显示效果如下:

AAA AAA

AAA AAA

AAA AAA

如果鼠标点击超链接能出现一定的浮动效果那更好,要求完全用CSS代码实现

请求CSS设计高手帮我指点方向! 多谢!!!

[解决办法]
你看CSS代码:作为链接a元素有四个属性:
a,就是作为链接的全局样式;
a:link是被点击前链接的样式;
a:visited是被点击后链接的样式;
a:hover鼠标悬停的样式;
还有一个a:active是被点击那一瞬间的激活样式;
里面的text-decoration属性就是文本的下划线。none就是没有下划线,underline就是有下划线,你像什么时候有线,就把对应元素里的text-decoration:underline就OK了。

那句margin:3px 0 0 3px;就是调整空隙的。安顺序四个值表示:上右下左,你像要多大自己改好了,记得非0值要加上单位!

读书人网 >CSS

热点推荐