css的一些基础知识

行高

一行文字实际占用的高度。
取值方式：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值为负数，取值为绝对值最大的。

如果一正一负，结果为两者之和。