css中display怎麼做顯示或隱藏

2021-08-18 20:29:37 字數 3319 閱讀 3001

1樓:顧傾城

display:none可以隱藏某個元素,且隱藏的元素不會佔用任何空間。該元素不但被隱藏了,而且該元素原本佔用的空間也會從頁面佈局中消失。

display:block可以顯示一個塊元素,或者display:inline是顯示一個內聯元素。

display主要用的css樣式有以下三個:

display:block——顯示為塊級元素。

display:inline——顯示為內聯元素。

display:inline-block——顯示為內聯塊元素,表現為同行顯示並可修改寬高內外邊距等屬性。

2樓:軒轅沐飛

css中的display和visibility

1、隱藏一個元素可以通過把display屬性設定為"none",或把visibility屬性設定為"hidden"。但是請注意,這兩種方法會產生不同的結果。

2、visibility:hidden可以隱藏某個元素,但隱藏的元素仍需佔用與未隱藏之前一樣的空間。也就是說,該元素雖然被隱藏了,但仍然會影響佈局。

3、display:none可以隱藏某個元素,且隱藏的元素不會佔用任何空間。也就是說,該元素不但被隱藏了,而且該元素原本佔用的空間也會從頁面佈局中消失。

擴充套件資料

css為html標記語言提供了一種樣式描述,定義了其中元素的顯示方式。css在web設計領域是一個突破。利用它可以實現修改一個小的樣式更新與之相關的所有頁面元素。

總體來說,css具有以下特點:

1、豐富的樣式定義:

css提供了豐富的文件樣式外觀,以及設定文字和背景屬性的能力;允許為任何元素建立邊框,以及元素邊框與其他元素間的距離,以及元素邊框與元素內容間的距離;允許隨意改變文字的大小寫方式、修飾方式以及其他頁面效果。

2、易於使用和修改:

css可以將樣式定義在html元素的style屬性中,也可以將其定義在html文件的header部分,也可以將樣式宣告在一個專門的css檔案中,以供html頁面引用。總之,css樣式表可以將所有的樣式宣告統一存放,進行統一管理。

另外,可以將相同樣式的元素進行歸類,使用同一個樣式進行定義,也可以將某個樣式應用到所有同名的html標籤中,也可以將一個css樣式指定到某個頁面元素中。如果要修改樣式,我們只需要在樣式列表中找到相應的樣式宣告進行修改。

3、多頁面應用:

css樣式表可以單獨存放在一個css檔案中,這樣我們就可以在多個頁面中使用同一個css樣式表。css樣式表理論上不屬於任何頁面檔案,在任何頁面檔案中都可以將其引用。這樣就可以實現多個頁面風格的統一。

4、層疊:

簡單的說,層疊就是對一個元素多次設定同一個樣式,這將使用最後一次設定的屬性值。例如對一個站點中的多個頁面使用了同一套css樣式表,而某些頁面中的某些元素想使用其他樣式,就可以針對這些樣式單獨定義一個樣式表應用到頁面中。

這些後來定義的樣式將對前面的樣式設定進行重寫,在瀏覽器看到的將是最後面設定的樣式效果。

5、頁面壓縮:

在使用html定義頁面效果的**中,往往需要大量或重複的**和font元素形成各種規格的文字樣式,這樣做的後果就是會產生大量的html標籤,從而使頁面檔案的大小增加。

3樓:小鳥蟻人

按鈕1顯示內容1

按鈕1顯示內容2

效果圖:

4樓:書香學程式設計

vue實踐-css樣式position/display/float屬性對比使用

5樓:

只需設定

display:none;

即可將該元素設為隱藏的。預設的是顯示的,即不設定display即預設顯示。

isplay 屬性規定元素應該生成的框的型別,定義建立佈局時元素生成的顯示框型別。

display的值可以取如下的值:

none    此元素不會被顯示。

block    此元素將顯示為塊級元素,此元素前後會帶有換行符。

inline    預設。此元素會被顯示為內聯元素,元素前後沒有換行符。

inline-block    行內塊元素。(css2.1 新增的值)

6樓:陽光的豆豆魚

參考** 如下

**電視劇電影

7樓:匿名使用者

display:none是隱藏,block顯示

8樓:十三栗子

可以通過設定display:none;命令將該元素設為隱藏。display命令預設的是顯示的,如果不設定display就預設顯示。

isplay 屬性規定元素應該生成的框的型別,定義建立佈局時元素生成的顯示框型別。

display的值可以取如下的值:

none    此元素不會被顯示。

block    此元素將顯示為塊級元素,此元素前後會帶有換行符。

inline    預設。此元素會被顯示為內聯元素,元素前後沒有換行符。

inline-block    行內塊元素。(css2.1 新增的值)

這個html中用display:none;隱藏了的屬性該怎麼讓它顯示出來。

9樓:匿名使用者

利用display命令,設定是否及如何顯示元素。

display 顯示狀態

display:none 隱藏

display:block 塊顯示

display:inline 內嵌

display:table **顯示

display:list-item 專案列表這個屬性用於定義建立佈局時元素生成的顯示框型別。

對於 html 等文件型別,如果使用 display 不謹慎會很危險,因為可能違反 html 中已經定義的顯示層次結構。對於 xml,由於 xml 沒有內建的這種層次結構,所有 display 是絕對必要的。

10樓:社會追夢小青年

可以針對這個元素,增加一個屬性,比如:

display:block或者display:line;

但是優先順序要高,或者增加一個!important

11樓:程式無邊怎麼辦

你可以通過jquery 來控制 。但是 你必須指定那些被隱藏的元素 例如:$("div").css('display','block'); 你將所有的隱藏元素指定顯示

12樓:喜歡猩猩的猴子

用js, 給ul個id

var ui = document.getelementbyid("aa");

ui.style.display=" ";//display為空的話會好使,為block會使後邊的空間換行

css樣式中display屬性由隱藏到顯示會擠掉其

vue實踐 css樣式position display float屬性對比使用 css中display block是什麼意思?如果用 做一個按鈕,這個能理解吧,就是 想通過 link 來實現跳轉,但是看起來是個按鈕,且不需要觸發事件。而且 css 也比 button 的好用。這中情況下,如果不是 塊...

這個CSS怎麼寫?帶斜邊,css怎麼做斜線

如下 html css div3 position relative width 300px height 200px background color yellow arrow top position absolute top 50px left 50px 移動距離為小三角的寬高 width 0...

css首字母大寫怎麼設定,css中如何設定英文首字母大寫?

例如 aaaaaaaaaaaa 你直接用多好啊 哪個要大寫 就把東西放在這個標籤裡面 css中如何設定英文首字母大寫?首字母大寫 a 全都 是大寫 b 全都是小寫 c 使用 css text transform 屬性 進行字母大小寫設定。定義和用法 text transform 屬性控制文字的大小寫...