css中隐藏元素并不占据原有空间怎么办（CSS中的元素显隐方法汇总）

最近在拜读张鑫旭大神的《CSS世界》
  
  
  
  
  
，其中很多思维非常值得借鉴学习  
  
  
  
  
 ，特别是对CSS控制显隐的总结
 


 


 


 


 


 ，非常到位
 
 
 
 
 
，记录一下

使用CSS让元素不可见的方法很多   
   
   
   
   
 ，剪裁           、定位到屏幕外
  
 
  
 
  
 
  
 
  
 
 、明度变化等都是可以的           。虽然它们都是肉眼不可见
 

 

 

 

 

 ，但背后却在多个维度上都有差别
  
 
  
 
  
 
  
 
  
 
 。

对于元素的显示隐藏这种交互式的行为

 

 

 

 

 
，应该由于JavaScript去完成           ，在css也可以借助一些属性去实现这类效果










。下面是按照需求进行分类进行的隐藏代码实践:

如需元素不可见
 
 

 
 

 
 

 
 

 
 

 ，同时不占据空间










，辅助设备无法访问                ，但资源有加载 
 
 
 
 
 
 
 
 
 
 ，DOM可访问
















，则可以直接使用display:none隐藏: .d_hide{ display: none; }