喜马拉雅|广州蓝景分享 — 前端技术之CSS隐藏元素

喜马拉雅|广州蓝景分享 — 前端技术之CSS隐藏元素

Hello~~各位小伙伴 , 今天我们广州蓝景小编 , 继续和大家分享前端技术干货 , CSS隐藏元素
总结7种隐藏元素的办法

1.CSS display的值是none 。 (该元素是不会在页面上显示)
div{
   display: none;


2. type=\"hidden\"的表单元素 。 (该元素是不会在页面上显示)
3. 宽度和高度都显式设置为0 。 (该元素是会在页面上显示)
div{
   width: 0;
   height: 0;

4. 一个祖先元素是隐藏的 , (该祖先以及祖先以下的元素是不会在页面上显示)
5. CSS visibility的值是hidden(该元素是会在页面上显示 , 还占原来的位置)
div{
   visibility: hidden;

6. CSS opacity的指是0(该元素是会在页面上显示 , 还占原来的位置)
div{
   opacity: 0;

【喜马拉雅|广州蓝景分享 — 前端技术之CSS隐藏元素】7. 将position设为absolute然后将位置设到不可见区域
div{
  position: absolute;
  top: -9999px;
  left: -9999px;

希望能够帮助到大家!想要了解更多前端技术学习 , 可以关注我们广州蓝景 。