1.块级、行内、行内块元素的特点
1.1块级元素的特点1
1.独自占据一整行
2.可以设置宽高
3.如果没有设置宽度的块级盒子,那么宽度继承父盒子的宽度
常见的块级元素: div p h1-h6 table ul li........
注意：
- 只有 文字才 能组成段落 因此 p 里面不能放块级元素，特别是 p 不能放div
- 同理还有这些标签h1,h2,h3,h4,h5,h6,dt，他们都是文字类块级标签，里面不能放其他块级元素。
1.2行内元素的特点
1.一行可以显示多个
2.不能设置宽高---宽高由内容决定
常见的行内元素: span a strong em del ins
1.3行内块元素的特点
1.一行可以显示多个
2.可以设置宽高
常见行内块元素: img input
2.显示模式的转换
display: inline-block（行内块）、block（块级）、inline（行内）
3.背景颜色的设置
3.1、background-color:颜色值; 默认的值是 transparent 透明的（背景颜色的赋值与文本颜色一致）
3.2、半透明背景颜色（rgba）文字颜色不变
3.3、全局透明（opacity:控制背景颜色的半透明程度: 0-1）文字颜色跟着改变
3.4、背景颜色渐变
background: linear-gradient(to right, #fa5956, #f99b4d);从左到右渐变
效果图
4.如何设置背景图片
background-image : none（无背景图，默认的） | url (“路径”)
注意：盒子本身必须要有宽高
5.背景图片的属性
5.1、控制背景图片的平铺方式：background-repeat:no-repeat（不平铺）、repeat（平铺）
5.2、控制背景图片的位移：background-position:center;
5.3、控制背景图片的固定：background-attachment:fixed（背景固定）、scroll（默认滚动）
5.4、背景图片大小的控制（background-size）
如果要控制背景图片的大小,background-size
代码
原图
1.以px单位
background-size: 100px 200px;
background-size: 100px 200px;
先写宽再写高
background-size: 400px;
如果只有一个,控制的是宽,高会等比例缩放
background-size: 400px;
2.以百分比单位
background-size: 50% 50%;
先写宽,再写高
百分比参照当前的盒子宽高
background-size: 50% 50%;
3.以属性作为单位
background-size: contain;
contain: 图片等比例放大,直到某一边到盒子的边框处停止
background-size: contain;
background-size: cover;
cover: 图片等比例放大,直到填满整个盒子
background-size: cover;
5.5、背景图片属性的连写：background: url("./images/3.jpg") no-repeat center skyblue;
注意：将多个属性用空格隔开,没有顺序要求
