re:从0开始的CSS之旅 14. 显示模式的切换
1. 两个属性
display 属性可以用于转换元素的显示模式
可选值：
block 转换为块元素
inline 转换为行内元素
inline-block 转换为行内块元素
none 不显示元素，并且不占用元素的位置
visibility 属性用于设置元素是否显示
可选值：
visible 显示元素（默认值）
hidden 隐藏元素，但是占用元素的位置
示例如下：
<!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>