2.元素的显示与隐藏

学习pink 老师css视频后的总结

元素的显示与隐藏

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

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

1 display属性

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

 

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

dispaly隐藏元素后，不再占有原来的位置。

 2 visibility属性

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

visibility: hidden; 元素隐藏

visibility: visible； 元素可视

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

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

不想占用原来的位置，就用display: none

3 overflow属性

overflow属性指定了如果内容溢出了制定边框，会发生什么

属性值	描述
visible	不剪切内容，也不添加滚动条
hidden	隐藏溢出的部分
scroll	不管内容是否超出，都显示滚动框
auto	根据内容，决定是否显示滚动条