列表样式
1、list-style-type
2、list-style-position
3、list-style-image
列表样式解析
1、html 有三种类型的列表
1、无序列表
2、有序列表
3、自定义列表
2、设置列表标记有
序号
圆点
圆圈
图片
...
3、list-style
简写属性，用于把下边三个属性声明到一起
4、list-style-type
属性指定列表项标记的类型 实心圆、空心圆、方框等
5、list-style-position
设置列表中标记项的相对位置
6、list-style-image
将图像设置为列表项标志
list-style-type 的属性值
1、none：无标记。
2、disc：标记实心圆。不设置的时候默认disc
3、circle：空心圆
4、square：实心方块
5、decimal：标记是数字
6、lower-roman：小写罗马数字 (i,ii,iii,iv……)
7、lower-latin：小写拉丁字母 (a,b,c,d……)……
8、还有一些比较见得少的，此处不添加，需要了可自行到 w3c 中查看。
list-style-position 的属性值
1、inside：列表项目标记放置在文本以内，且环绕文本根据标记对齐
2、outside：默认值，保持标记位于文本的左侧
3、inherit：从父级继承list-style-position属性值
list-style-image
ol,ul{
list-style-image: url("cat.svg")
}
表格样式
1、caption-side
定义表格标题在表格上方或下方
1、top 上方 默认
2、bottom 下方
table{
caption-side: bottom;
}
2、border-collapse
表格边框合并，去除边框之间的间隙
1、separate 边框分开，默认值
2、collapse 边框合并
table{
border-collapse: collapse;
}
3、border-spacing
定义表格边框间距
表格边框不合并的情况下生效
table{
border-spacing: 10px;
}
其他样式
1、outline
2、display
3、visibility
4、opacity
5、overflow
其他样式解析
1、outline
轮廓，指边缘；物体的外周或图形的外框
outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用
outline 属性设置元素周围的轮廓线
outline 分为两部分
1、shorthand CSS property: outline 三个属性组成
1、outline-style
定义要绘制的线的类型
它的值可以是以下任何关键字
auto
dotted
dashed
solid
double
groove
ridge
inset
outset
none （默认值，没有轮廓）
outline-style: auto | dotted | dashed | solid | double | groove | ridge | inset | outset
2、outline-width
定义要绘制的线的厚度
其值可以是任意长度值，也可以是以下任意关键字
thin
medium（默认值）
thick
outline-width: 2(px, em, rem) | thin | medium | thick
3、outline-color
设置 outline 的文字部分和装饰部分的颜色
可以通过关键字、十六进制值、RGB/RGBA 值和 HSL/HSLA 值来指定
outline-color: currentColor | red | #eee | rgb(255, 255, 255) | hsl(0,0,0)
2、独立的 outline-offset
1、outline-offset 的 initial value 为 0
2、允许正负值，负值时outline会收缩，正值时会扩张
2、display
用于 设置和修改 元素的 显示模式 如
1、block：让元素显示为块级元素
2、inline：让元素显示为行内级元素
3、inline-block：让元素同时具备行内级、块级元素的特征
4、none：隐藏元素
5、flex：伸缩盒子
3、overflow
用于控制内容溢出时的行为
1、visible：溢出的内容照样可见
2、hidden：溢出的内容直接裁剪
3、scroll：溢出的内容被裁剪，但可以通过滚动机制查看
会一直显示滚动条区域，滚动条区域占用的空间属于 width、height
4、auto：自动根据内容是否溢出来决定是否提供滚动机制
4、visibility
控制元素是否可见
1、visible：默认值，元素可见
2、hidden：元素不可见
3、collapse：表格中使用，表示该列或列组的所有单元格不显示。
如果用于非表格元素，collapse 与 hidden 含义相同
4、inherit：一个大众属性了，指定一个属性应从父元素继承它的值
补充
display：none 和 visibility：hidden 的比较
1、visibility: hidden 不脱离文档流，保留在文档之中，并且保存原有的物理空间
2、display: none 则是将对应元素从文档中删除，如果需要重新显示则需要重新绘制页面
3、visibility: hidden 的 子元素 可通过设置 visibility: visible 在文档中显示
4、display:none 的 子元素 是无法通过设置自身的 display 属性重新显示的
5、设置 visibility 的元素，可以通过 transition 属性监听属性值变化，具有过渡的属性
6、display 不支持 transition 属性，它是瞬间完成的
5、opacity
指定一个元素的不透明度
指定了当前元素对后面背景的不透明程度
默认值是 1，表示当前元素完全不透明，完全会遮挡住后面的背景
注意
子元素的不透明度 与 父不透明度 的影响
实际展现效果的 opacity = 父元素的 opacity * 自身的 opacity
一个元素其自身的 opacity 最后展现的效果，应该是是其 父元素的 opacity * 其自身的 opacity
浙公网安备 33010602011771号