网站去除li标签中链接前面小圆点方法

橘子网 3,319 0

网站去除li标签中链接前面小圆点方法

网站建设中常常会遇到li标签,在使用li标签的情况下默认是有一个小园点的,看起来跟网页有点格格不入,博主一般见到都会去除小圆点,去掉的链接文字前面的小黑点很简单,只需一行代码就搞定。

在CSS文件中加入以下代码:

ul li{list-style: none;}

如果想把这个小圆点换成其他的小图标也是可以的,修改代码如下:

ul li{
list-style-type:none;//这里是去掉小黑点
list-style-image: url(images/icon.gif);//这里替换成你的图标路径
}

当然,有些站长喜欢这个小圆点,或者只想改一下颜色之类的,参考代码如下:

ul li{list-style: none;}
ul li:before {
    content: "";
    float: left;
    width: 10px;
    height: 10px;
    margin: 10px 0;
    background-color: #3498db;
    border-radius: 50%;
}
//如果你里面有超链接,还可能会用到下面的样式
ul li a {
    display: block;
    height: 32px;
    font-size: 14px;
    color: #7c7c7c;
    line-height: 32px;
    text-indent: 10px;
}

这几个方法都可以轻松改变网站的li标签,不管是WordPress网站还是其他程序网站,在添加以上代码时注意网站的位置,需要放在网站CSS样式表中即可实现。

上一篇:

下一篇:

相关阅读

分享