一、文本属性:
1、文本大小 font-size:16px;(默认16px)
px是像素单位
font-size:1em 跟随直接父级的文本大小(有em指的是:若父级设置了文本大小,跟随父级,即与最近的标签大小相同)
9pt=12px(最小显示)
rem:跟随html的文本大小
2、文本颜色:
color: red/#FF0000; 英语单词/十六进制(aabbcc格式可以缩写成abc)
rgb(0,0,0); red green blue 取值范围0-255,括号内值得改变使得颜色变化
3、文本类型 font-family:字体1,字体2,字体3;
多个字体间用逗号隔开,中文或者多个单词表示的字体加引号,单个单词表示的字体不用加引号
4、加粗font-weight:bolder/bold/normal 更粗/加粗/常规(取消加粗效果) 0--900 (0-400视觉效果没变化,理论上是变细500为常规,600及以上加粗) font-weight:600;
5、倾斜 font-weight:normal/italic/oblique;(常规(不倾斜)/字体倾斜/变为斜字体)
6、行高line-height:文本垂直对齐方式
行高值<高度值 偏上
行高值=高度值 中间
行高值>高度值 偏下
7、综合写法:font:倾斜 加粗 文本大小/行高 字体类型; (注意:顺序不能变)
8、文本水平对齐方式 text-align:left/right/center/justify;(两端对齐)
9、文本修饰:text-decoration:none/overline/line-through/underline (没有修饰/上划线/中划线/下划线)
10、缩进
text-indent: :
字符间距 letter-spacing: ;
词间距 word-spacing: ;
二、列表属性
1、列表修饰符
list-style: ; disc/circle/square/none 小黑圆点/空心圆/小黑方块/去掉修饰
list-style-image:url("图片地址");
list-style-position: outside/inside;(图片位置)
2、边框:
1、法一:border:边框大小 边框形态 边框颜色 border:2px solid #000; ( 边框形态:solid/dashed/dotted 实线/虚线/点状线)
法二:
border-width:30px;
border-style:solid;
border-color:blue;
2、某一个方向的拆分:border-top/bottom/left/right:上边框大小 上边框形态 上边框颜色
transparent 透明
3、利用边框斜切实现三角形
border:30px solid transparent;颜色设置为透明色
border-top-color:red;某一边有颜色