HTML5的hidden属性用法及display:none和visible:hidden的区别

1610月

用法很简单：

<div hidden>
You can’t see me!
</div>

这个属性的表现类似css的display:none，用了这个属性后，元素会被隐藏，块级元素也会折叠起来不再占位，和visible:hidden不一样。

display:none和visible:hidden都是把网页上某个元素隐藏起来的功能，但两者有所区别：
visible:hidden属性会使对象不可见，但该对象在网页所占的空间没有改变（看不见但摸得到）
display:none属性会使这个对象彻底消失（看不见也摸不到）

对于不支持HTML5的浏览器来说，也可以做下简单的兼容：

*[hidden] { display: none; }

分享到：

OnlyGrape葡提子,英文建站博客英文网站建设，用户体验设计，前段技术研究，seo网站推广