一说起CSS隐藏元素
第一种方法就是设置display为none。这是最为人所熟知也是最常用的方法。
设置visibility为hidden来隐藏元素
设置opacity =0
区别:
元素本来占有的空间就会被其他元素占有,也就是说它会导致浏览器的重排和重绘
和display:none的区别在于,其占据的空间依旧会保留着,所以它只会导致浏览器重绘而不会重排。
opacity 属性我相信大家都知道表示元素的透明度,而将元素的透明度设置为0后
假设我们要通过CSS3来做一个淡出的动画效果,应该如下:
.fadeOut { visibility: visible; opacity: 1; transition: all linear 2s; }
.fadeOut:hover { visibility: hidden; opacity: 0; }