小編給大家分享一下cs中display屬性有什么作用，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),磁縣企業(yè)網(wǎng)站建設(shè),磁縣品牌網(wǎng)站建設(shè),網(wǎng)站定制,磁縣網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,磁縣網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

css里的display屬性的作用是規(guī)定元素應(yīng)該生成的框的類型。display屬性是前端開發(fā)中常用的一個(gè)屬性，常用的屬性值有block、none、inline、inline-block。

網(wǎng)頁上的每個(gè)元素都是一個(gè)矩形框。display 屬性規(guī)定元素應(yīng)該生成的框的類型。display屬性是我們?cè)谇岸碎_發(fā)中常常使用的一個(gè)屬性。

常用屬性值介紹：

block    塊對(duì)象的默認(rèn)值。用該值為對(duì)象之后添加新行

none    隱藏對(duì)象。與visibility屬性的hidden值不同，其不為被隱藏的對(duì)象保留其物理空間

inline    內(nèi)聯(lián)對(duì)象的默認(rèn)值。用該值將從對(duì)象中刪除行

inline-block    行內(nèi)塊元素。這個(gè)屬性值融合了inline 和 block 的特性，即是它既是內(nèi)聯(lián)元素，又可以設(shè)置width和height。

一、display:block

1、block： 將元素將顯示為塊級(jí)元素，元素前后會(huì)帶有換行符，通常用于將行內(nèi)元素轉(zhuǎn)換為塊級(jí)元素時(shí)使用。那么什么是塊級(jí)元素呢？什么是行內(nèi)元素呢？

2、塊級(jí)元素：

總是以一個(gè)塊的形式表現(xiàn)出來，占領(lǐng)一整行。若干同級(jí)塊元素會(huì)從上之下依次排列（使用float屬性除外）。

可以設(shè)置高度、寬度、各個(gè)方向外補(bǔ)丁（margin）以及各個(gè)方向的內(nèi)補(bǔ)?。╬adding）。

當(dāng)元素寬度（width）沒有設(shè)置時(shí)，它的寬度時(shí)其容器的100%，除非我們給它設(shè)定了固定的寬度。

塊級(jí)元素中可以嵌套其他塊級(jí)元素或行內(nèi)元素。

塊級(jí)元素的display屬性值默認(rèn)為block。

3、行內(nèi)元素

它不會(huì)單獨(dú)占據(jù)一整行，而是只占領(lǐng)自身的寬度和高度所在的空間，也就是元素的的寬高度是由它的文本內(nèi)容撐開。若干同級(jí)行內(nèi)元素會(huì)從左到右（即某個(gè)行內(nèi)元素可以和其他行內(nèi)元素共處一行），從上到下依次排列。

行內(nèi)元素不可以設(shè)置高度、寬度，其高度一般由其字體的大小來決定，其寬度由內(nèi)容的長度控制。

行內(nèi)元素只能設(shè)置左右的margin值和左右的padding值，而不能設(shè)置上下的margin值和上下的padding值。因此我們可以通過設(shè)置左右的padding值來改變行內(nèi)元素的寬度。

行內(nèi)元素一般不可以包含塊級(jí)元素。

塊級(jí)元素的display屬性值默認(rèn)為inline。

二、display:none

display:none這個(gè)值表示元素不被顯示。當(dāng)你想要某個(gè)元素隱藏時(shí)，就可以給某個(gè)元素設(shè)置這個(gè)屬性，它就會(huì)消失在網(wǎng)頁中，但元素并沒有在文檔中刪除，只是隱藏在網(wǎng)頁結(jié)構(gòu)中，不在網(wǎng)頁中顯示而已。但如果你想要元素顯示的話，可以給元素設(shè)置display:block，元素就可以顯示在網(wǎng)頁中了。

三、display:inline

display:inline 的作用可以將一個(gè)塊級(jí)元素轉(zhuǎn)換成行內(nèi)元素，那么這個(gè)塊級(jí)元素將不能再設(shè)置寬和高以及上下方向的margin和padding。這個(gè)塊級(jí)元素實(shí)際的寬度和高度都是auto，并不是我們?cè)O(shè)定的值。

四、display:inline-block

根據(jù)名字來看，我們可以得到它是結(jié)合了inline和block并保留了它們的特性。所以設(shè)置了inline-block屬性的元素既具有block元素可以設(shè)置width和height屬性的特性，又保持了inline元素不換行的特性。

看完了這篇文章，相信你對(duì)cs中display屬性有什么作用有了一定的了解，想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

網(wǎng)站欄目：cs中display屬性有什么作用-創(chuàng)新互聯(lián)
標(biāo)題鏈接：http://www.rwnh.cn/article16/cepjgg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站內(nèi)鏈、企業(yè)網(wǎng)站制作、靜態(tài)網(wǎng)站、全網(wǎng)營銷推廣、域名注冊(cè)、軟件開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)