css(列表、表格)样式
程序员文章站
2022-04-22 22:20:52
...
列表样式
列表 li 独有的属性
list-style-type[设置列表符号]
disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉列表符号)；
list-style-image:url(路径); [自定义图片列表符号]
list-style-position:outside(默认外边)/inside(里边)；[定义符号所在位置]
list-style:none;去掉列表符号
说明：通常我们都清空列表符号 因为列表符号在各浏览器显示无法统一 并且无法随心所欲的控制符号离文本内容的距离。
知识点1.list-style-type 列表项目类型
disc实心圆
circle空心圆
square实心方块
decimal数字
decimal-leading-zero 01开头数字
lower-roman小写罗马数字开头
upper-roman大写罗马数字开头
lower-alpha小写英文字母开头
upper-alpha大写英文字母开头
知识点2.list-style-position 列表项目位置
inside，列表项目标记放置在文本以内，且环绕文本根据标记对齐。
outside，默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外，且环绕文本不根据标记对齐
inherit，继承父级设置（IE不支持）
知识点3.list-style-image 列表项目图片
url（）列表图像地址
none，默认
inherit，继承父级设置（IE不支持）
知识点4.list-style 列表简写
可以按顺序设置如下属性：
list-style-type
list-style-position
list-style-image
代码
<style>
li{list-style:none;}/*去除列表符号*/
li{background:#ff0;}
</style>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</body>
表格样式
border-collapse
separate：
边框独立
collapse：
相邻边被合并
border-spacing
设置或检索当表格边框独立时，行和单元格的边框在横向和纵向上的间距
必须border-collapse为separate时才可以使用