溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下css怎么讓div隱藏，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
css的選擇器可以分為三大類，即id選擇器、class選擇器、標簽選擇器。它們之間可以有多種組合，有后代選擇器、子選擇器、偽類選擇器、通用選擇器、群組選擇器等等
css讓div隱藏的方法：1、使用“display:none”來隱藏div；2、使用“visibility: hidden;”隱藏div；3、使用“opacity: 0”隱藏div。
本文操作環(huán)境：windows7系統(tǒng)、HTML5&&CSS3版、Dell G3電腦。
在我們平時布局網(wǎng)站的時候，想要把p進行隱藏，但是很多人不知道css控制p顯示隱藏？下面我們來講解一下css如何讓p隱藏。
1、使用display:none來隱藏div
我們可以使用display:none屬性來隱藏所有的信息，包括文本和圖片，語法為：
<div>這里你是看不到的</div>
當我們使用p中的css樣式，我們就可以使用display:none屬性對內容進行隱藏，并且通過瀏覽器也是看不到的，同時被隱藏的內容是不被占用空間的，隱藏之后的內容搜索引擎是不讀取的，一般我們都是用使用js統(tǒng)計代碼去隱藏顯示的圖標。
2、使用visibility: hidden;隱藏div
visibility 屬性規(guī)定元素是否可見。
這個屬性指定是否顯示一個元素生成的元素框。這意味著元素仍占據(jù)其本來的空間，不過可以完全不可見。值 collapse 在表中用于從表布局中刪除列或行。
屬性值：
visible 默認值。元素是可見的。
hidden 元素是不可見的。
collapse 當在表格元素中使用時，此值可刪除一行或一列，但是它不會影響表格的布局。被行或列占據(jù)的空間會留給其他內容使用。如果此值被用在其他的元素上，會呈現(xiàn)為 "hidden"。
3、使用opacity: 0隱藏div
opacity 屬性的意思是設置一個元素的透明度。它不是為改變元素的邊界框（bounding box）而設計的。
這意味著將 opacity 設為 0 只能從視覺上隱藏元素。而元素本身依然占據(jù)它自己的位置并對網(wǎng)頁的布局起作用。這和上面的visibility: hidden 相似。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>元素隱藏--opacity: 0</title>
<style>
div{
height: 20px;
}
.demo{
width: 800px;
height: 60px;
margin: 50px auto;
border: 1px solid red;
}
.hide,span{
opacity: 0;
}
</style>
</head>
<body>
<div>
<div sty>元素隱藏1--opacity: 0</div>
<div>元素隱藏2--opacity: 0</div>
<div>元素隱藏3--opacity: 0</div>
</div>
<div>
<div>元素隱藏1--opacity: 0,元素隱藏2--opacity: 0,元素隱藏3--opacity: 0</div>
<div>元素隱藏1--opacity: 0,<span>元素隱藏2--opacity: 0</span>,元素隱藏3--opacity: 0</div>
</div>
</body>
</html>效果圖：
以上是“css怎么讓div隱藏”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業(yè)資訊頻道！
免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權內容。
