1. 两个属性
display 属性可以用于转换元素的显示模式
可选值：
block 转换为块元素
inline 转换为行内元素
inline-block 转换为行内块元素
none 不显示元素，并且不占用元素的位置
visibility 属性用于设置元素是否显示
可选值：
visible 显示元素（默认值）
hidden 隐藏元素，但是占用元素的位置
示例如下：
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>display model changing</title>
div {
width: 200px;
height: 200px;
/* 显示模式的转换 */
/* display: inline; */
}
.box1 {
background-color: #c7edcc;
/* display: none; */
visibility: hidden;
}
.box2 {
background-color: #fde6e0;
}
span {
width: 200px;
height: 200px;
background-color: #dce2f1;
display: block;
}
</head>
<body>
<div class="box1">111</div>
<div class="box2">222</div>
<span>我是span</span>
</body>
</html>