首页 > 代码库 > 隐藏属性对元素的click事件的影响

隐藏属性对元素的click事件的影响

2024-08-18 11:33:25   215人阅读

在CSS中，让元素隐藏（指屏幕范围内肉眼不可见）的方法很多，有的占据空间，有的不占据空间；有的可以响应点击，有的不能响应点击。一个一个看。 
  2. { display: none; /* 不占据空间，无法点击 */ } 
  3. /********************************************************************************/ 
  4. { visibility: hidden; /* 占据空间，无法点击 */ } 
  5. /********************************************************************************/ 
  6. { position: absolute; top: -999em; /* 不占据空间，无法点击 */ } 
  7. /********************************************************************************/ 
  8. { position: relative; top: -999em; /* 占据空间，无法点击 */ } 
  9. /********************************************************************************/ 
  10. { position: absolute; visibility: hidden; /* 不占据空间，无法点击 */ } 
  11. /********************************************************************************/ 
  12. { height: 0; overflow: hidden; /* 不占据空间，无法点击 */ } 
  13. /********************************************************************************/ 
  14. { opacity: 0; filter:Alpha(opacity=0); /* 占据空间，可以点击 */ } 
  15. /********************************************************************************/ 
  16. { position: absolute; opacity: 0; filter:Alpha(opacity=0); /* 不占据空间，可以点击 */ } 
  17. /********************************************************************************/ 
  18. { 
  19. zoom: 0.001; 
  20. -moz-transform: scale(0); 
  21. -webkit-transform: scale(0); 
  22. -o-transform: scale(0); 
  23. transform: scale(0); 
  24. /* IE6/IE7/IE9不占据空间，IE8/FireFox/Chrome/Opera占据空间。都无法点击 */ 
  25. } 
  26. /********************************************************************************/ 
  27. { 
  28. position: absolute; 
  29. zoom: 0.001; 
  30. -moz-transform: scale(0); 
  31. -webkit-transform: scale(0); 
  32. -o-transform: scale(0); 
  33. transform: scale(0); 
  34. /* 不占据空间，无法点击 */ 
  35. }



来自为知笔记(Wiz)


隐藏属性对元素的click事件的影响


联系
我们