# 元素的显示与隐藏

类似网站广告,当我们点击关闭就不见了,但是我们重新刷新页面,会重新出现

本质 : 让一个元素在页面中隐藏或显示出来

# display 属性

display 属性用于设置一个元素如何显示

  • display : none; 隐藏对象
  • display : block; 除了转换为块级元素之外,同时还有显示元素的意思

display 隐藏元素后,不再占有原来的位置

后面你应用及其广泛,搭配 JS 可以坐很多的网页特效

# visibility 可见性

visibility 属性用于指定一个元素应可见还是隐藏

  • visibility : visible; 元素可见
  • visibility: hidden; 元素隐藏

visibility 隐藏元素后,继续占有原来的位置

如果隐藏元素想要原来位置,就用 visibility : hidden

如果隐藏元素不想要原来位置,就用 display: none (用处更多,重点)

# overflow 溢出

overflow 属性制定了如果内容移除一个元素的框 (超过其指定高度及宽度) 时,会发生什么

属性值描述
visible不剪切内容也不添加滚动条
hidden不显示超过对象尺寸的内容,超过的部分隐藏掉
scroll不管超出内容否,总是显示滚动条
auto超出自动显示滚动条,不超出不显示滚动条