1.元素的显示与隐藏
display、visibility两个属性都可以实现元素的显示与隐藏
(1.1)display:none;隐藏元素;
display:block;以块级元素显示;
(1.2)visibility:hidden;隐藏元素;
visibility:visibile;显示元素;
display和visibility的区别在于,使用display属性隐藏元素后,不再占据原先位置;而使用visibility属性隐藏元素后,其原先位置仍被占据。
2.元素内容显示与隐藏
overflow属性会对溢出元素框的内容如何展示进行设置。
(2.1)overflow:visible;不做限制,保持原样显示,为默认值
(2.2)overflow:hidden;超出元素框的内容被隐藏
(2.3)overflow:scroll;添加滚动条,不管是否有内容溢出
(2.4)overflow:auto;当有内容溢出时,添加滚动条
3.元素显示与隐藏的应用
制作遮罩效果。
实现思路:遮罩层默认为隐藏,当鼠标在元素上方时则显示,鼠标不在元素上方时则隐藏。