CSS樣式
目前平臺只支持本文檔中列出的CSS樣式,如無特殊說明,樣式屬性的取值范圍和規(guī)則與標準CSS一致。
所有組件默認為flex布局,以下為平臺和瀏覽器默認值不一樣的地方:
{
display:flex;
flex-direction:column;
box-sizing:border-box;
position:relative;
}
通用樣式
CSS 背景屬性(Background)
background //設置元素的背景,目前只支持background-color或background-image,不支持其它屬性。
background-color //設置元素的背景顏色。
background-image //設置元素的背景圖像。
background-position //設置背景圖像的起始位置。
background-repeat //設置是否及如何重復背景圖像。
background-size //設置背景圖片的尺寸。
CSS 邊框屬性(Border)
邊框的樣式只支持solid、dashed、dotted,暫不支持每個邊單獨設置不同邊框樣式。
border //在一個聲明中設置所有的邊框屬性。
border-bottom //在一個聲明中設置所有的下邊框屬性。
border-bottom-color //設置下邊框的顏色。
border-bottom-style //設置下邊框的樣式。
border-bottom-width //設置下邊框的寬度。
border-color //設置四條邊框的顏色。
border-left //在一個聲明中設置所有的左邊框屬性。
border-left-color //設置左邊框的顏色。
border-left-style //設置左邊框的樣式。
border-left-width //設置左邊框的寬度。
border-right //在一個聲明中設置所有的右邊框屬性。
border-right-color //設置右邊框的顏色。
border-right-style //設置右邊框的樣式。
border-right-width //設置右邊框的寬度。
border-style //設置四條邊框的樣式。目前只支持一個值寫法。
border-top //在一個聲明中設置所有的上邊框屬性。
border-top-color //設置上邊框的顏色。
border-top-style //設置上邊框的樣式。
border-top-width //設置上邊框的寬度。
border-width //設置四條邊框的寬度。
border-radius //簡寫屬性,設置所有四個 border-*-radius 屬性。
border-top-left-radius //定義邊框左上角的形狀。
border-top-right-radius //定義邊框右下角的形狀。
border-bottom-left-radius //定義邊框左下角的形狀。
border-bottom-right-radius //定義邊框右下角的形狀。
box-shadow //向方框添加陰影。只支持添加一個,spread和inset暫不支持。
Color 屬性
opacity //設置元素的不透明度。
CSS 尺寸屬性(Dimension)
height //設置元素高度。
min-height //設置元素的最小高度。
max-height //設置元素的最大高度。
width //設置元素的寬度。
min-width //設置元素的最小寬度。
max-width //設置元素的最大寬度。
可伸縮框屬性(Flexible Box)
flex-flow //flex-direction 和 flex-wrap 屬性的簡寫。
flex-direction //指定了彈性子元素在父容器中的排列方向。默認值column。
flex-wrap //指定彈性盒子的子元素換行方式。
justify-content //應用在彈性容器上,把彈性項沿著彈性容器的主軸線(main axis)對齊。
align-items //設置或檢索彈性盒子元素在側軸(縱軸)方向上的對齊方式。
align-content //在彈性容器內(nèi)的各項沒有占用交叉軸上所有可用的空間時,對齊容器內(nèi)的各項。
align-self //設置彈性元素自身在側軸(縱軸)方向上的對齊方式。
flex //用于指定彈性子元素如何分配空間。flex-grow、flex-shrink、flex-basis屬性的簡寫。
flex-grow //定義彈性盒子元素的擴展比率。
flex-shrink //定義彈性盒子元素的收縮比率。當元素為scroll-view的直接子節(jié)點時,默認值為0。
flex-basis //定義彈性盒子元素的默認基準值。
CSS 外邊距屬性(Margin)
margin //在一個聲明中設置所有外邊距屬性。
margin-bottom //設置元素的下外邊距。
margin-left //設置元素的左外邊距。
margin-right //設置元素的右外邊距。
margin-top //設置元素的上外邊距。
CSS 內(nèi)邊距屬性(Padding)
padding //在一個聲明中設置所有內(nèi)邊距屬性。
padding-bottom //設置元素的下內(nèi)邊距。
padding-left //設置元素的左內(nèi)邊距。
padding-right //設置元素的右內(nèi)邊距。
padding-top //設置元素的上內(nèi)邊距。
CSS 定位屬性(Positioning)
display //規(guī)定元素的顯示類型。只支持flex、none,默認值flex。
position //規(guī)定元素的定位類型。只支持relative、absolute,默認值relative。
bottom //設置定位元素下外邊距邊界與其包含塊下邊界之間的偏移。
left //設置定位元素左外邊距邊界與其包含塊左邊界之間的偏移。
right //設置定位元素右外邊距邊界與其包含塊右邊界之間的偏移。
top //設置定位元素的上外邊距邊界與其包含塊上邊界之間的偏移。
z-index //設置元素的堆疊順序。
visibility //設置元素是否顯示。
2D/3D 轉換屬性(Transform)
transform //向元素應用 2D 或 3D 轉換。
transform-origin //設置轉換元素的位置。
過渡屬性(Transition)
transition //簡寫屬性,用于在一個屬性中設置四個過渡屬性。
transition-property //規(guī)定應用過渡的 CSS 屬性的名稱。
transition-duration //定義過渡效果花費的時間。
transition-timing-function //規(guī)定過渡效果的時間曲線。
transition-delay //規(guī)定過渡效果何時開始。
文本樣式
CSS 字體屬性(Font)
font-family //規(guī)定文本的字體系列。
font-size //規(guī)定文本的字體尺寸。
font-style //規(guī)定文本的字體樣式。
font-weight //規(guī)定字體的粗細。
font-variant //規(guī)定是否以小型大寫字母的字體顯示文本。
CSS 文本屬性(Text)
color //設置文本的顏色。
text-align //規(guī)定文本的水平對齊方式。
line-height //設置行高。
text-shadow //規(guī)定添加到文本的陰影效果。
direction //設置文本方向。
letter-spacing //設置字符間距。
text-indent //設置文本中首行文本的縮進。
text-decoration //規(guī)定添加到文本的裝飾效果。只支持underline和line-through。
text-overflow //規(guī)定當文本溢出包含元素時發(fā)生的事情。只支持clip和ellipsis。
white-space //設置元素內(nèi)的空白怎樣處理。支持normal和nowrap。
word-break //規(guī)定文本的換行規(guī)則。
unicode-bidi //設置或返回文本是否被重寫。
更多建議: