介绍
小编给大家分享一下css如何占位隐藏元素,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!
css的选择器有哪些
css的选择器可以分为三大类,即id选择器,类选择器,标签选择器。它们之间可以有多种组合,有后代选择器,子选择器,伪类选择器,通用选择器,群组选择器等等
css占位隐藏元素的方法:1、使用可见性属性,给元素设置“可见性:隐藏;”样式即可,元素虽隐藏了,但仍占据其本来的空间;2、使用透明度属性,元素设置“不透明度:0;”样式即可。
引用>本教程操作环境:windows7多系统,CSS3&, HTML5版,戴尔G3电脑。
<强>方法1:使用<代码>可见性:隐藏。代码>隐藏占位强>
能见度属性规定元素是否可见。
这个属性指定是否显示一个元素生成的元素框。这意味着元素仍占据其本来的空间,不过可以完全不可见。崩溃值在表中用于从表布局中删除列或行。
示例:
& lt; ! DOCTYPE html> & lt; html> ,,,& lt; head> ,,,,,,,& lt; meta charset=癠TF-8"比; ,,,,,,,& lt; title>元素隐藏——可见性:,hidden ,,,,,,,& lt; style> ,,,,,,,,,,,.visibility { ,,,,,,,,,,,,,,,可见性:,隐藏; ,,,,,,,,,,,} ,,,,,,,& lt;/style> ,,,& lt;/head> ,,,& lt; body> ,,,,,,,& lt; div>正常显示元素& lt;/div> ,,,,,,,& lt; div 类=皏isibility"在隐藏元素& lt;/div> ,,,,,,,& lt; div>正常显示元素& lt;/div> ,,,& lt;/body> & lt;/html>
<强>方法2:使用<代码>不透明度:0 代码>隐藏占位强>
透明度属性的意思是设置一个元素的透明度。它不是为改变元素的边界框(边界框)而设计的。
这意味着将不透明度设为0只能从视觉上隐藏元素,而元素本身依然占据它自己的位置并对网页的布局起作用。这和上面的可见性:隐藏相似。
示例:
& lt; ! DOCTYPE html> & lt; html> ,,,& lt; head> ,,,,,,,& lt; meta charset=癠TF-8"比; ,,,,,,,& lt; title>元素隐藏——不透明度:,0 & lt;/title> ,,,,,,,& lt; style> ,,,,,,,,,,,.opacity { ,,,,,,,,,,,,,,,不透明度:,0; ,,,,,,,,,,,} ,,,,,,,& lt;/style> ,,,& lt;/head> ,,,& lt; body> ,,,,,,,& lt; div>正常显示元素& lt;/div> ,,,,,,,& lt; div 类=皁pacity"在隐藏元素& lt;/div> ,,,,,,,& lt; div>正常显示元素& lt;/div> ,,,& lt;/body> & lt;/html>
以上是“css如何占位隐藏元素”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!
css如何占位隐藏元素