1.0 像素
像素的概念： 是一个绝对单位，谷歌默认的字体大小就是16px
**px,em,rem,vh,vw区别是什么？**
px：绝对单位 ， 像素 chrome默认的字体大小就是16px。em：相对单位 ,相对于自身的字体大小来的,如果元素自身没有设置font-size，则继承祖先元素的font-size。rem：相对单位，只根据html的字体大小来设置 r => root，比如，html的字体大小是20px， 则10rem就等于10*20 =200px 。vh和vw：相对单位，相对视口来设置的。它会将浏览器视口平分为100份，50vw就代表视口宽度的50%，50vh就代表视口高度的50%。vh和vw只是两个单位而已，并不代表着宽度就必须使用vw，高度就必须使用vh。
2.0 颜色分类
颜色的表示:
2.1 使用英语单词
编写比较简单，但是表达的颜色比较单一，实际开发中使用并不多
比如： red, green, blue, yellow, purple, pink, orange........
div {
color: red;
}
2.2 rgb或者rgba
- r : red => 0-255
- g : green => 0-255
- b : blue => 0-255
- a : 透明度 0-1
2.3 十六进制
格式：#rrggbb
取值范围是：0 - f (0, 1...9, a , b ...f)
最小值是00， 最大值是ff
如果每种颜色两位数是相同的，则可以简写为一位
3.0 字体大小
3.1 控制字体大小： font-size:
3.2 控制字体类型 windows系统默认是微软雅黑 ： font-family:
每个逗号代表一种字体，在设置字体的时候，从左往右到你的电脑上去查找，有则直接设置，没有则继续往后面找
3.3 控制字体是否为斜体： font-style:
normal: 默认值，正常显示italic: 斜体
3.4 控制字体的粗细： font-weight:
bold:****加粗lighter:细
如果用数字来表示粗细，则常规的粗细是400,小于400会显细，大于400显粗，一般600以上就是我们常说的加粗效果
注意：
- 如果写复合写法，字体大小和字体类型必须设置
- 字体类型必须放在最后，字体大小必须放在倒数第二位，每个属性用空格隔开
font: italic bold 40px Arial, sans-serif
4.0 文本颜色
直接在选择器里面设置一个color
5.0 文本间距
5.1 控制字母之间的间距： letter-spacing
5.2 控制单词间距： word-spacing
6.0 文本修饰
6.1 添加下划线： text-decoration: underline;
6.2 添加上划线： text-decoration: overline;
6.3 添加中划线： text-decoration: line-through red dashed；
6.4 取消装饰线： text-decoration: none；
7.0 文本缩进
缩进，通常用于input的内容距离input框内部左侧隔开一点距离
通常用： text-indent:
8.0 文本对齐
9.0 vertical-align:
作用： 用于指定同一行元素之间是垂直对齐方式
注意： 不能控制元素
一般在开发中，常用于，调整图片和文本垂直对齐
<style>
div {
border:1px solid red;
width: 400px;
height: 400px;
}
img {
/* 居中 */
vertical-align: middle;
/* 跟顶部对齐 */
vertical-align: top;
/* 跟底部对齐 */
vertical-align: bottom;
width: 80%;
height: 100%;
}
</style>
</head>
<body>
<div>
<img src="../../day1/20210112045854781.jpg" alt="">
<span>这是图片</span>
</div>
</body>
