CSS系列之去除列表默认样式 |
您所在的位置：网站首页 › css列表样式怎么设置 › CSS系列之去除列表默认样式 |
CSS系列之去除列表默认样式
|
文章の目录
1、list-style1.1、属性值1.2、list-style-type1.2.1、属性值1.2.1.1、关键字1.2.1.2、a `` value1.2.1.3、a `symbols()` value1.2.1.4、a `` value
1.2.2、注意点
1.3、list-style-image1.3.1、属性值
1.4、list-style-position1.4.1、属性值
1.5、示例
写在最后
无序和有序列表前面默认的列表样式，在不同浏览器显示效果不一样，而且也比较难看，所以，我们一般上来就直接去掉这些列表样式就行了。 代码如下： li { list-style: none; } 1、list-stylelist-style 属性是一个简写对属性集合，包括list-style-type，list-style-image 和 list-style-position。 1.1、属性值以任何顺序接受一个，二个或者三个关键词 下面依次介绍构成list-style属性值的三个属性 1.2、list-style-typelist-style-type可以设置列表元素的 marker（比如圆点、符号、或者自定义计数器样式）。 1.2.1、属性值 1.2.1.1、关键字 disc实心圆点 (默认值) circle空心圆点 square实心方块 decimal十进制阿拉伯数字 从1开始 cjk-decimal中日韩十进制数 例如：一，二，三， …，九八，九九，一〇〇 decimal-leading-zero十进制数字，位数不够用零来填充。 例如：01，02，03，… 98，99 lower-roman小写罗马数字 例如：i，ii，iii，iv，v… upper-roman大写罗马数字 例如：I，II，III，IV，V… lower-greek小写希腊字母 例如：α，β，γ… lower-alphalower-latin小写ASCII字母 例如：a，b，c，… z upper-alphaupper-latin大写ASCII字母 例如：A，B，C，… Z armenian传统的亚美尼亚编号方式 (ayb/ayp，ben/pen，gim/keem… georgian传统的乔治亚编号方式 例如：an，ban，gan，… he，tan，in… hebrew传统的希伯来编号方式 ethiopic-numerichiraganaa，i，u，e，o，ka，ki，… katakanaA，I，U，E，O，KA，KI，… hiragana-irohai，ro，ha，ni，ho，he，to，… Iroha是古老的日语音节顺序。 katakana-irohaI, RO, HA, NI, HO, HE, TO, … Iroha是古老的日语音节顺序。 japanese-informal日本正式编号 japanese-formal在法律或财务文件中使用的日文正式编号。 例如：壱萬壱阡壱百壱拾壱 这些日本汉字的设计是这样的，它们不能被修改成另一个正确的样子 korean-hangul-formal韩文编号等。 例如：일만 일천일백일십일 korean-hanja-informal韩国悬挂式编号。 例如：萬 一千百十一 korean-hanja-formal正式的韩式数字。 例如：壹萬 壹仟壹百壹拾壹 simp-chinese-informal简体中文非正式数字。 例如：一万一千一百一十一 cjk-ideographic相同simp-chinese-informal 例如：一万一千一百一十一 simp-chinese-formal简体中文正式数字。 例如：壹万壹仟壹佰壹拾壹 trad-chinese-informal传统中文非正式数字。 例如：一萬一千一百一十一 trad-chinese-formal繁体中文正式数字。 例如：壹萬壹仟壹佰壹拾壹 1.2.1.2、a value一个匹配@counter-style或预定义样式之一的值的标识符 1.2.1.3、a symbols() value定义列表的匿名样式 1.2.1.4、a value指定的字符串将用作项的标记 1.2.2、注意点 由于 list-style-type 属性是可继承的，它可以设置在父元素上 以便应用于所有子元素； 1.3、list-style-imagelist-style-image 属性用来指定一个能用来作为列表元素标记的图片。 通常来说使用list-style较为方便。 1.3.1、属性值用来作为标记的图片的地址。 none说明没有图片被用作标记。如果这个值被设定，那么 list-style-type 中定义的值会被取代。 1.4、list-style-positionlist-style-position 属性指定标记框在主体块框中的位置。 使用助记符list-style更方便。 1.4.1、属性值 outside标记盒在主块盒的外面。 inside标记盒是主要块盒中的第一个行内盒，处于元素的内容流之后。 1.5、示例 1 2 3 li { border: 1px solid #ccc; list-style-type: square; list-style-position: outside; }
如果你感觉文章不咋地//(ㄒoㄒ)//，就在评论处留言，作者继续改进；o_O??? 如果你觉得该文章有一点点用处，可以给作者点个赞；\\*^o^*// 如果你想要和作者一起进步，可以微信扫描二维码，关注前端老L；~~~///(^v^)\\\~~~ 谢谢各位读者们啦(^_^)∠※！！！ |
【本文地址】
今日新闻 |
推荐新闻 |