CSS列表样式属性list-style用法详解

本文向大家描述一下CSS列表样式属性list-style的用法，它主要用于在一个声明中设置一个列表的所有属性的简写属性，该属性是一个简写属性，涵盖了所有其他列表样式属性，仅作用于具有display值等于list-item的对象

创新互联是一家专注网站建设、网络营销策划、微信小程序开发、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立十多年以来，已经为上千家玻璃贴膜各业的企业公司提供互联网服务。现在，服务的上千家客户与我们一路同行，见证我们的成长；未来，我们一起分享成功的喜悦。

解析CSS列表样式属性list-style

平时制作页面中可对属性list-style在list-item对象中常用，但用的都不深。一般都设为none重置整个页面就差不多OK，可能很多人包括本人对属性list-style-type更细节方面的属性并不是很了解，更有可能对属性list-style和属性list-style-type概念会比较模糊，现有必要把它提出来重新学习一下，故整理如下。

◆list-style

定义:用于在一个声明中设置一个列表的所有属性的简写属性，该属性是一个简写属性，涵盖了所有其他列表样式属性，仅作用于具有display值等于list-item的对象(如li对象)。

相关:list-style-image　　list-style-position　　list-style-type

◆list-style-image

说明:设置或检索作为对象的列表项标记的图像。若此属性值为none或指定url地址的图片不能被显示时，list-style-type属性将发生作用。

取值:

none:　默认值。不指定图像

url(url):　使用绝对或相对url地址指定图像

◆list-style-position

说明:设置或检索作为对象的列表项标记如何根据文本排列。假如一个列表项目的左外补丁(margin-left)被设置为0，则列表项目标记不会被显示。左外补丁(margin-left)最小可以被设置为30。仅作用于具有display属性值等于list-item的对象。如li对象。

取值:

outside:　默认值。列表项目标记放置在文本以外，且环绕文本不根据标记对齐

inside:　列表项目标记放置在文本以内，且环绕文本根据标记对齐

◆list-style-type

说明:设置或检索对象的列表项所使用的预设标记。若list-style-image属性值为none或指定url地址的图片不能被显示时，此属性将发生作用。

取值:

disc:　CSS1　实心圆

circle:　CSS1　空心圆

square:　CSS1　实心方块

decimal:　CSS1　阿拉伯数字

lower-roman:　CSS1　小写罗马数字

upper-roman:　CSS1　大写罗马数字

lower-alpha:　CSS1　小写英文字母

upper-alpha:　CSS1　大写英文字母

none:　CSS1　不使用项目符号

armenian:　CSS2　传统的亚美尼亚数字

cjk-ideographic:　CSS2　浅白的表意数字

georgian:　CSS2　传统的乔治数字

lower-greek:　CSS2　基本的希腊小写字母

hebrew:　CSS2　传统的希伯莱数字

hiragana:　CSS2　日文平假名字符

hiragana-iroha:　CSS2　日文平假名序号

katakana:　CSS2　日文片假名字符

katakana-iroha:　CSS2　日文片假名序号

lower-latin:　CSS2　小写拉丁字母

upper-latin:　CSS2　大写拉丁字母

补充:此CSS2.1提出的.IE6,Firefox1.5+,Opera9+支持此属性,所以以数字方式显示列表也可以用ul来指定，并不一定必需要用ol来写。

文章题目：CSS列表样式属性list-style用法详解
文章位置：http://www.gawzjz.com/qtweb/news33/198783.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联