我有一个导航菜单,页脚和幻灯片,使用列出的样式列出链接和图像.我有css list-style:none;设置隐藏导航和页脚中的链接和图像旁边的项目符号,但我想显示列表正常文本的项目符号.
我怎样才能做到这一点？
Fla*_*sne 28
下面的示例解释了如何使用css样式类删除项目符号.您可以使用类似于css类的标识符(#id),父标记等.您可以使用相同的方法来定义css以从页脚中删除项目符号.
我用这个网站作为起点.
<html>
<head>
<style type="text/css">
div.ui-menu li {
list-style:none;
background-image:none;
background-repeat:none;
background-position:0;
}
ul
{
list-style-type:none;
padding:0px;
margin:0px;
}
li
{
background-image:url(sqpurple.gif);
background-repeat:no-repeat;
background-position:0px 5px;
padding-left:14px;
}
</style>
</head>
<body>
<div class="ui-menu">
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
</div>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
</body>
</html>
Isr*_*man 23
您需要为要隐藏的项目符号定义一个类.举些例子
.no-bullets {
list-style-type: none;
}
然后将其应用于您想要隐藏的子弹的列表:
<ul class="no-bullets">
所有其他列表(没有特定类)将像往常一样显示bulltets.
您可以li根据元素class，id元素或祖先元素设置不同的样式：
li { /* styles all li elements*/
list-style-type: none;
}
#ParentListID li { /* styles the li elements that have an ancestor element
of id="ParentListID" */
list-style-type: bullet;
}
li.className { /* styles li elements of class="className" */
list-style-type: bullet;
}
或者，使用祖先元素：
#navigationContainerID li { /* specifically styles the li elements with an ancestor of
id="navigationContainerID" */
list-style-type: none;
}
li { /* then styles all other li elements that don't have that ancestor element */
list-style-type: bullet;
}
| 归档时间： |
|
| 查看次数： |
129443 次 |
| 最近记录： |