display的幾種常用取值

2022-07-17 11:30:12 字數 1619 閱讀 2641

display的取值有很多種,下面列出比較常用的幾種取值,還有其它的少用的值沒有列出來:

1、none 此元素不會被顯示,並且不佔據頁面空間,這也是與visibility:hidden不同的地方,設定visibility:hidden的元素,不會被顯示,但是還是會佔據原來的頁面空間。

2、inline 行內元素 元素會在一行內顯示,超出螢幕寬度自動換行,不能設定寬度和高度,元素的寬度和高度只能是靠元素內的內容撐開。

示例元素:span,b,i,a,u,sub,sup,strong,em

3、block 塊級元素 會獨佔一行,如果不設定寬度,其寬度會自動填滿父元素的寬度,可以設定寬高,即使設定了寬度,小於父元素的寬度,塊級元素也會獨佔一行。

示例元素:div,h1-h6,ul,ol,dl,p

4、inline-block 行內塊元素 與行內元素一樣可以再一行內顯示,而且可以設定寬高,可以設定margin和padding。

示例元素:input,button,img

5、list-item 列表元素

示例元素:li

6、table 會作為塊級**來顯示(類似於),**前後帶有換行符。

7、inline-table 會作為內聯**來顯示(類似於),**前後沒有換行符。

8、flex 多欄多列布局,火狐可以直接使用,谷歌和歐朋需要在屬性值前面加-webkit-字首,比較適合移動端開發使用。

乙個flexbox布局是由乙個伸縮容器(flex containers)和在這個容器裡的伸縮專案(flex items)組成。

伸縮容器(flex  containers)是乙個html標籤元素,並且「display」屬性顯式的設定了「flex」屬性值。在伸縮容器中的所有子元素都會自動變成伸縮專案(flex  items)。

html**:左中

右css**:

.container

.left

.center

.right

設定flex屬性的元素會用伸縮容器減去有實際數值的元素的寬或者高,然後將差值按照flex設定的數值進行比例的分配。

9、inherit 繼承,如果元素的某些屬性沒有進行設定,有些是會有預設值的,有些是會繼承的。

行內元素與塊級元素的區別:

1、巢狀

行內元素:行內元素只能巢狀行內元素,不能巢狀塊級元素。

塊級元素:塊級元素可以巢狀行內元素,但是行內元素不可以巢狀塊級元素。塊級元素之間也可以進行巢狀,但是,並不是塊級元素之間可以隨意的巢狀。p元素是不能巢狀任何塊級元素的,div可以巢狀任意的元素,但是div並不是能夠被所有的塊級元素巢狀的。

div可以巢狀div

td可以巢狀div

li可以巢狀div

dd,dt可以巢狀div

結構標記 可以巢狀div

2、margin和padding

行內元素:有margin和padding,但是只能夠設定左右的值,設定上下的值是無效的。

塊級元素:可以設定margin和padding上下左右的四個值,margin可以有負值,padding不允許有負值。

3、設定寬高

行內元素:不允許設定寬高,行內元素的寬高只能是由行內元素內的內容撐起來。

塊級元素:允許設定寬高,如果不設定,預設寬度是父元素的100%,高度是由內容撐起來的。

android inputType常用取值

文字型別,多為大寫 小寫和數字符號。android inputtype none 輸入普通字元 android inputtype text 輸入普通字元 android inputtype textcapcharacters 輸入普通字元 android inputtype textcapword...

android inputType常用取值

文字型別,多為大寫 小寫和數字符號。android inputtype none 輸入普通字元 android inputtype text 輸入普通字元 android inputtype textcapcharacters 輸入普通字元 android inputtype textcapword...

android inputType常用取值

文字型別,多為大寫 小寫和數字符號。android inputtype none 輸入普通字元 android inputtype text 輸入普通字元 android inputtype textcapcharacters 輸入普通字元 android inputtype textcapword...