css3基本屬性備忘單

掌握基本的CSS語法與我們的CSS3屬性備忘單。...

層疊樣式表或CSS定義了我們所知道的web的外觀和感覺。當HTML和JavaScript專注於web的功能方面時，CSS處理web的視覺方面。

在你學會了如何用HTML構建靜態網頁之後，是時候去發現如何用CSS來設計它們的樣式並使它們看起來更漂亮了。下面我們的CSS3屬性備忘表可以幫助您做到這一點！它涵蓋了CSS3中您需要了解的基本語法，CSS3是CSS的最新版本。

CSS的實用知識可以幫助您以一種流線型的方式自定義網頁的顏色、字體、邊框、背景、佈局等。此外，它在設計web和移動應用程序時也很方便。

免費下載：此備忘單可從我們的發行合作伙伴TradePub下載PDF格式。您必須填寫一個簡短的表格才能第一次使用它。下載必要的CSS3屬性備忘單。

css3基本屬性備忘單

Shortcut	Action
背景屬性
背景	在一個聲明中定義各種背景屬性。
背景附件	指定是固定背景圖像還是隨網頁滾動。
背景色	定義網頁上元素的背景色。
背景圖像	定義元素的背景圖像。
背景剪輯	指定元素的背景圖像或顏色延伸的距離。
背景原點	指定背景圖像的定位區域。
背景位置	定義背景圖像的原點。
背景重複	指定背景圖像的平鋪方式。
背景大小	指定背景圖像的大小。
邊框屬性
邊境	設置元素所有四個邊的邊框寬度、樣式和顏色。
邊框底部	設置元素下邊框的寬度、樣式和顏色。
邊框底色	設置元素下邊框的顏色。
邊框左下半徑	定義元素左下角邊框的形狀。
邊框右下半徑	定義元素右下角邊框的形狀。
邊框底部樣式	設置元素下邊框的樣式。
邊框底部寬度	設置元素下邊框的寬度。
邊框顏色	設置元素所有四邊的邊框顏色。
邊框圖像	指定如何使用圖像代替邊框樣式。
邊框圖像開始	指定邊框圖像區域超出邊框框的範圍。
邊框圖像重複	指定邊框圖像的平鋪方式。
邊界圖像切片	指定圖像邊框的向內偏移。
邊框圖像源	指定要用作邊框的圖像的位置。
邊框圖像寬度	指定圖像邊框的寬度。
左邊框	設置元素左邊框的寬度、樣式和顏色。
左邊框顏色	設置元素左邊框的顏色。
左邊框樣式	設置元素左邊框的樣式。
邊框左寬度	設置元素左邊框的寬度。
邊界半徑	定義元素邊角的形狀。
右邊框	設置元素右邊框的寬度、樣式和顏色。
右邊框顏色	設置元素右邊框的顏色。
右邊框樣式	設置元素右邊框的樣式。
右邊框寬度	設置元素右邊框的寬度。
邊框樣式	設置元素所有四邊的邊框樣式。
邊框頂部	設置元素上邊框的寬度、樣式和顏色。
邊框頂部顏色	設置元素上邊框的顏色。
邊框左上半徑	定義元素左上角邊框的形狀。
邊框右上半徑	定義元素右上角邊框的形狀。
邊框頂部樣式	設置元素上邊框的樣式。
邊框頂部寬度	設置元素上邊框的寬度。
邊框寬度	設置元素所有四邊的邊框寬度。
顏色屬性
顏色	定義和設置文本的顏色。
不透明度	定義元素的透明度。
維度屬性
高度	定義元素的高度。
最大高度	定義元素的最大高度。
最大寬度	定義元素的最大寬度。
最小高度	定義元素的最小高度。
最小寬度	定義元素的最小寬度。
寬度	指定元素的寬度。
生成的內容屬性
內容	**生成的內容。
引用	指定嵌入引號的引號。
計數器復位	創建或重置一個或多個計數器。
計數器增量	遞增一個或多個計數器值。
靈活的方框佈局
對齊內容	指定柔性容器項目的對齊方式。
對齊項目	指定項目的默認對齊方式。
自我對齊	指定選定項目的對齊方式。
彎曲	指定柔性長度的構件。
伸縮基準值	指定彈性項的初始主大小。
彎曲方向	指定柔性項的方向。
彈性流	flex direction和flex wrap屬性的速記屬性。
彈性增長	指定flex項相對於flex容器中其他項的增長方式。
彈性收縮	指定flex項相對於flex容器中的其他項收縮的方式。
柔性包裝	指定柔性項是否應換行。
調整內容	指定在解析任何柔性長度和自動邊距後，如何沿柔性容器的主軸對齊柔性項。
秩序	指定flex項目在flex容器中的顯示和佈局順序。
字體屬性
字體	在一個聲明中定義各種字體屬性，如字體樣式、字體變體、字體粗細、字體大小/行高和字體系列。
字體系列	定義元素的字體列表。
字體大小	定義文本的字體大小。
字體尺寸	Preserves the readability of text when font fallback occurs.
font-stretch	Selects a normal, condensed, or expanded face from a font.
font-style	Defines the font style for the text.
font-variant	Specifies the font variant.
font-weight	Specifies the font weight of the text.
List Properties
list-style	Defines the display style for a list and list elements.
list-style-image	Specifies the image to be used as a list-item marker.
list-style-position	Specifies the position of the list-item marker.
list-style-type	Specifies the marker style for a list-item.
Margin Properties
margin	Sets the margin on all four sides of the element.
margin-bottom	Sets the bottom margin of the element.
margin-left	Sets the left margin of the element.
margin-right	Sets the right margin of the element.
margin-top	Sets the top margin of the element.
Multi-Column Layout Properties
column-count	Specifies the number of columns in a multi-column element.
column-fill	Specifies how columns will be filled.
column-gap	Specifies the gap between the columns in a multi-column element.
column-rule	Specifies a straight line, or "rule", to be drawn between each column in a multi-column element.
column-rule-color	Specifies the color of the rules drawn between columns in a multi-column layout.
column-rule-style	Specifies the style of the rule drawn between the columns in a multi-column layout.
column-rule-width	Specifies the width of the rule drawn between the columns in a multi-column layout.
column-span	Specifies how many columns an element spans across in a multi-column layout.
column-width	Specifies the optimal width of the columns in a multi-column element.
columns	A shorthand property for setting column-width and column-count properties.
column-count	Specifies the number of columns in a multi-column element.
Outline Properties
outline	Sets the width, style, and color for all four sides of an element's outline.
outline-color	Sets the color of the outline.
outline-offset	Set the space between an outline and the border edge of an element.
outline-style	Sets a style for an outline.
outline-width	Sets the width of the outline.
Padding Properties
padding	Sets the padding on all four sides of the element.
padding-bottom	Sets the padding to the bottom side of an element.
padding-left	Sets the padding to the left side of an element.
padding-right	Sets the padding to the right side of an element.
padding-top	Sets the padding to the top side of an element.
Print Properties
page-break-after	Inserts a page break after an element.
page-break-before	Inserts a page break before an element.
page-break-inside	Inserts a page break inside an element.
Table Properties
border-collapse	Specifies whether table cell borders are connected or separated.
border-spacing	Sets the spacing between the borders of adjacent table cells.
caption-side	Specifies the position of table's caption.
empty-cells	Shows or hides borders and backgrounds of empty table cells.
table-layout	Specifies a table layout algorithm.
border-collapse	Specifies whether table cell borders are connected or separated.
Text Properties
direction	Defines the text direction/writing direction.
tab-size	Specifies the length of the tab character.
text-align	Sets the horizontal alignment of inline content.
text-align-last	Specifies how the last line of a block or a line right before a forced line break is aligned when text-align is justify.
text-decoration	Specifies the decoration added to text.
text-decoration-color	Specifies the color of the text-decoration-line.
text-decoration-line	Specifies what kind of line decorati*** are added to the element.
text-decoration-style	Specifies the style of the lines specified by the text-decoration-line property
text-indent	Indents the first line of text.
text-justify	Specifies the justification method to use when the text-align property is set to justify.
text-overflow	Specifies how the text content will be displayed, when it overflows the block containers.
text-shadow	Applies one or more shadows to the text content of an element.
text-transform	Transforms the case of the text.
line-height	Sets the height between lines of text.
vertical-align	Sets the vertical positioning of an element relative to the current text baseline.
letter-spacing	Sets the extra spacing between letters.
word-spacing	Sets the spacing between words.
white-space	Specifies how white space inside the element is handled.
word-break	Specifies how to break lines within words.
word-wrap	Specifies whether to break words when the content overflows the boundaries of its container.
Transform Properties
backface-visibility	Specifies whether or not the "back" side of a transformed element is visible when facing the user.
perspective	Defines the perspective from which all child elements of the object are viewed.
perspective-origin	Defines the origin (the vanishing point for the 3D space) for the perspective property.
transform	Applies a 2D or 3D transformation to an element.
transform-origin	Defines the origin of transformation for an element.
transform-style	Specifies how nested elements are rendered in 3D space.
Transition Properties
transition	Defines the transition between two states of an element.
transition-delay	Specifies when the transition effect will start.
transition-duration	Specifies the number of seconds or milliseconds a transition effect should take to complete.
transition-property	Specifies the names of the CSS properties to which a transition effect should be applied.
transition-timing-function	Specifies the speed curve of the transition effect.
Visual Formatting Properties
display	Specifies how an element is displayed ***creen.
position	Specifies how an element is positioned.
top	Specifies the location of the top edge of the positioned element.
right	Specifies the location of the right edge of the positioned element.
bottom	Specifies the location of the bottom edge of the positioned element.
left	Specifies the location of the left edge of the positioned element.
float	Specifies whether or not a box should float.
clear	Specifies the placement of an element in relation to floating elements.
z-index	Specifies a layering or stacking order for positioned elements.
overflow	Specifies the treatment of content that overflows the element's box.
overflow-x	Specifies how to manage the content when it overflows the width of the element's content area.
overflow-y	Specifies how to manage the content when it overflows the height of the element's content area.
resize	Specifies whether or not an element is resizable by the user.
clip	Defines the clipping region.
visibility	Specifies whether or not an element is visible.
cursor	Specifies the type of cursor.
box-shadow	Applies one or more drop-shadows to the element's box.
box-sizing	Alters the default CSS box model.
Animation Properties
animation	Specifies the behavior of all animati***.
animation-delay	Specifies when the animation will start with a delay.
animation-direction	Specifies whether the animation should play forward, backward, or in alternate cycles.
animation-duration	Specifies the number of seconds or milliseconds an animation should take to complete one cycle.
animation-fill-mode	Specifies how a CSS animation should apply styles to its target before and after it is executing.
animation-iteration-count	Specifies the number of times an animation cycle should be played before stopping.
animation-name	Specifies the name of @keyframes defined animati*** that should be applied to the selected element.
animation-play-state	Specifies whether the animation is running or paused.
animation-timing-function	Specifies how a CSS animation should progress over the duration of each cycle.