行高
一行文字实际占用的高度。
取值方式:px,百分比。
百分比:按照默认的字体大小取值。
浏览器默认字体一般是16px
字体
font-size:;
字体大小,取值单位px,百分比,单词,em
font-family:“字体”;
字体,可以中文,也可英文
网页中,中文主要使用的字体:微软雅黑,宋体,黑体。
英文:Arial,Consolas
英文在前,中文在后。
font-style: ;
文字样式
段落
text-align: ;
文本居中方式
text-indent: ;
首行文本缩进 em px 百分比
text-decoration: line-through;
文本修饰
line-through:中划线。
underline:下划线。
overline:上划线。
word-spacing: 48px ;单词间距 中文无效
letter-spacing: 48px;每个字母间的间距,中文可用
标准盒模型
什么叫盒子?
一个元素在页面中真实占据的位置。
五个部分:内容的宽,内容的高,内边距,边框,外边距。
宽:width px;
高:height px;
定义的内容的宽和高。
padding:
内容和边框之间的距离。
内边距是可以被背景色渲染的。
可以给单边设置内边距:
padding-left: 50px;
padding-top: 30px;
padding-right: 40px;
padding-bottom: 60px;
四值法:
单值:上下左右。
双值:上下 左右。
三值:上 左右 下
四值:上 右 下 左 顺时针。
边框
border:1px solid red;
三要素写法:
宽度,样式,颜色
也可以拆开写
单边设置宽,边框线的样式,颜色
border-left: 5px solid red;
border-right: 5px dashed green;
border-top: 5px dotted blue;
border-bottom:5px solid red;
外边距
margin:30px;
与最近元素的距离
它也可以单独拆分出来只写单独一边
margin-top:30px;
margin-bottom:30px;
margin-right::30px;
margin-left:30px;
水平居中(必须有宽度)
margin: 0 auto;
垂直方向上相邻的两个盒子,如果都有外边距,则外边距相交的地方会出现外边距重合现象,也叫作外边距塌陷。
取值:margin相遇的部分,并不是两个margin值的和,而是为最大值。
如果两个margin值为负数,取值为绝对值最大的。
如果一正一负,结果为两者之和。