The best CSS Reference Tutorial In 2024, In this tutorial you can learn
CSS properties,Animation properties,Background Properties,Border (Border) and outline (Outline) property,Box (Box) property,Color (Color) properties,Padding (Padding) Property,Media Properties page content,Size (Dimension) property,Flexible Box Model (Flexible Box) property (new),Flexible Box Model (Flexible Box) property (old),Font (Font) Property,Content generation attribute (Generated Content Properties),Grid (Grid) property,Hyperlink (Hyperlink) Properties,Wireframe (Linebox) property,List (List) property,Margin (Margin) property,Subtitles (Marquee) property,Multiple columns (Multi-column) property,Page Media (Paged Media) property,Positioning (Positioning) property,Paging (Print) property,Ruby Properties,Speech (Speech) property,Table (Table) property,Text (Text) property,2D / 3D transform properties,Transition (Transition) property,The appearance of the user (User-interface) properties,
CSS Reference
This tutorial CSS Reference in all major browsers tested.
CSS properties
CSS Property Group:
"CSS" column indicates in which CSS version the property is defined (CSS1, CSS2, or CSS3).
属性 |
描述 |
CSS |
color-profile |
允许使用源的颜色配置文件的默认以外的规范 |
3 |
opacity |
设置一个元素的透明度级别 |
3 |
rendering-intent |
允许超过默认颜色配置文件渲染意向的其他规范 |
3 |
属性 |
说明 |
CSS |
bookmark-label |
指定书签的标签 |
3 |
bookmark-level |
指定了书签级别 |
3 |
bookmark-target |
指定了书签链接的目标 |
3 |
float-offset |
在相反的方向推动浮动元素,他们一直具有浮动 |
3 |
hyphenate-after |
指定一个断字的单词断字字符后的最少字符数 |
3 |
hyphenate-before |
指定一个断字的单词断字字符前的最少字符数 |
3 |
hyphenate-character |
指定了当一个断字发生时,要显示的字符串 |
3 |
hyphenate-lines |
表示连续断字的行在元素的最大数目 |
3 |
hyphenate-resource |
外部资源指定一个逗号分隔的列表,可以帮助确定浏览器的断字点 |
3 |
hyphens |
设置如何分割单词以改善该段的布局 |
3 |
image-resolution |
指定了正确的图像分辨率 |
3 |
marks |
将crop and/or cross标志添加到文档 |
3 |
string-set |
|
3 |
Attributes | Explanation | CSS |
---|
box-align | Specifies how to align a block of sub-elements | 3 |
box-direction | In which direction is specified, it displays a box child element | 3 |
box-flex | Specify whether a box of sub-elements are flexible or fixed size | 3 |
box-flex-group | Flexible elements assigned to Flex Group | 3 |
box-lines | Whenever it runs in the space of the parent frame when a further specify whether a new row | 3 |
box-ordinal-group | A frame display order of sub-elements | 3 |
box-orient | Specifies whether a box of a child element in the horizontal or vertical direction should be laid | 3 |
box-pack | Specifies lateral box in a horizontal position and vertical position of the vertical frame | 3 |
Attributes | Explanation | CSS |
---|
font | Set all font properties in one declaration | 1 |
font-family | The provisions of the text font family | 1 |
font-size | The provisions of the text font size | 1 |
font-style | Font styles specified text | 1 |
font-variant | Font styles specified text | 1 |
font-weight | Prescribed font weight | 1 |
@ font-face | A rule that allows the site to download and use other than "Web- safe" for the font | 3 |
font-size-adjust | The elements aspect predetermined value | 3 |
font-stretch | Shrink or stretch the current font family | 3 |
Attributes | Explanation | CSS |
---|
content | With: before and: after pseudo-element used in conjunction to insert generated content | 2 |
counter-increment | Increment or decrement one or more counters | 2 |
counter-reset | Create one or more counters or reset | 2 |
quotes | Set of nested types referenced quotes | 2 |
crop | Allow replaced elements just as an object instead of the rectangular area of the entire object | 3 |
move-to | Causes an element to be removed from the flow and reinserted at a later point in the document | 3 |
page-policy | String value is determined based on the page to apply to a given element in the counter | 3 |
Attributes | Explanation | CSS |
---|
grid-columns | Specifies the width of each column in the grid | 3 |
grid-rows | Specifies the height of each column in the grid | 3 |
Attributes | Explanation | CSS |
---|
target | Shorthand property to set target-name, target-new, and the target-position property | 3 |
target-name | Specifies to open the link (destination) where | 3 |
target-new | Specifies whether a new target link opens a new window or open a new tab in an existing window | 3 |
target-position | Specify the new destination links should be placed in the position | 3 |
Attributes | Explanation | CSS |
---|
alignment-adjust | Allows more precise alignment of elements | 3 |
alignment-baseline | Its parent element specified inline level how to align | 3 |
baseline-shift | Allows repositioning of the dominant-baseline relative to the dominant-baseline | 3 |
dominant-baseline | Specifies the scaled-baseline-table | 3 |
drop-initial-after-adjust | Set the initial alignment point pulldown primary connection point | 3 |
drop-initial-after-align | Set the calibration line within the initial line is that it has the first letter of the box using the primary connection point | 3 |
drop-initial-before-adjust | Settings drop-down auxiliary connection point initial alignment point | 3 |
drop-initial-before-align | Set the calibration line within the initial line is that it has the first letter of the auxiliary junction box | 3 |
drop-initial-size | The first letter of the control of local subsidence | 3 |
drop-initial-value | Activate a drop-down initial results | 3 |
inline-box-align | Set up a multi-line inline block row having aligned front and next inline elements | 3 |
line-stacking | A set line-stacking-strategy, line-stacking-ruby, and line-stacking-shift attribute shorthand property | 3 |
line-stacking-ruby | Sets the line stacking method for block elements containing Ruby annotation elements | 3 |
line-stacking-shift | Set base-shift line containing stacked block element method element | 3 |
line-stacking-strategy | Stacking method sets contained within the block elements of the stack frame | 3 |
text-height | Text area inline box set block-progression dimension | 3 |
Attributes | Explanation | CSS |
---|
marquee-direction | Setting the direction of moving content | 3 |
marquee-play-count | How many times have set up mobile content | 3 |
marquee-speed | Set how fast scroll content | 3 |
marquee-style | Styling mobile content | 3 |
Attributes | Explanation | CSS |
---|
column-count | The number of columns specified element should be divided into the | 3 |
column-fill | Specifies how to fill columns | 3 |
column-gap | Specified gap between the columns | 3 |
column-rule | All set for column-rule- * properties shorthand property | 3 |
column-rule-color | Specify color rules between columns | 3 |
column-rule-style | Style rule specifies between columns | 3 |
column-rule-width | Specifies the width of the rule between columns | 3 |
column-span | How many columns specified element should span | 3 |
column-width | Specifies the width of the columns | 3 |
columns | Shorthand property to set the number of columns and column width | 3 |
Attributes | miss | CSS |
---|
fit | If the width and height attributes are not auto gives a hint of how massive replaced elements | 3 |
fit-position | Determining the alignment of the object inside the box | 3 |
image-orientation | Specifies the user-agent suitable for right or rotate the image clockwise | 3 |
page | Specify a particular type of element should display a page | 3 |
size | Specify the content of the page containing the BOX size and orientation | 3 |
Attributes | Explanation | CSS |
---|
bottom | Offset block at the border between the lower margin settings targeting elements comprising its border | 2 |
clear | Which side of the predetermined element prevents other floating elements | 1 |
clip | Cut absolutely positioned elements | 2 |
cursor | Type cursor provisions to be displayed (shape) | 2 |
display | Type specifies the elements to be generated box | 1 |
float | Are the provisions of box should float | 1 |
left | Setting targeting elements comprising its border left margin offset between the left edge of the block | 2 |
overflow
| What happens when the contents of the provisions of the overflow box element | 2 |
position | Location type specifies the elements | 2 |
right | Setting the right margin positioning elements containing an offset block border and its right border between | 2 |
top | Set targeting elements contained on the border and its margin offsets between the block boundary | 2 |
visibility | Are the provisions of visible elements | 2 |
z-index | Setting the stacking order of elements | 2 |
Attributes | Explanation | CSS |
---|
orphans | Minimum number of lines occurs when the internal elements must be retained tab at the bottom of the page | 2 |
page-break-after | Settings tab behavioral elements after | 2 |
page-break-before | Settings tab behavioral elements before | 2 |
page-break-inside | The element inside the tab behavior | 2 |
widows | Minimum number of lines occurs when the internal elements must be retained tab at the top of the page | 2 |
Attributes | Explanation | CSS |
---|
ruby-align | Ruby and Ruby control text based content text alignment relative to each other | 3 |
ruby-overhang | When the text exceeds Ruby base Ruby width, determine the local mount any adjacent text ruby text is allowed, in addition to their base | 3 |
ruby-position | Where it controls the base text Ruby | 3 |
ruby-span | Control over the behavior of annotation elements | 3 |
Attributes | Explanation | CSS |
---|
mark | Set mark-before and mark-after attribute shorthand properties | 3 |
mark-after | Allow named tags to the audio stream | 3 |
mark-before | Allow named tags to the audio stream | 3 |
phonemes | Specifies that contains the text of the corresponding element in a phonetic pronunciation | 3 |
rest | Setting a rest-before and rest-after attribute shorthand properties | 3 |
rest-after | A content element after the finish, designated to take a break or comply with prosodic boundary | 3 |
rest-before | A content element before the finish, designated to take a break or comply with prosodic boundary | 3 |
voice-balance | Specified balance the left and right channels | 3 |
voice-duration | Specify the contents of the selected element should be taken to render the length of the | 3 |
voice-pitch | Specifies the average voice pitch (frequency) | 3 |
voice-pitch-range | Specifies the average pitch change | 3 |
voice-rate | Speed control | 3 |
voice-stress | Indicating efforts focus | 3 |
voice-volume | Speech synthesis means that the amplitude of the output waveform | 3 |
Attributes | Explanation | CSS |
---|
border-collapse | Specifies whether the table border merger | 2 |
border-spacing | A predetermined distance between adjacent cell borders | 2 |
caption-side | Predetermined location of the title table | 2 |
empty-cells | Specifies whether to display borders and background tables in empty cells on | 2 |
table-layout | Setting layout algorithm for tables | 2 |
Attributes | Explanation | CSS |
---|
color | Set the color of the text | 1 |
direction | Text predetermined direction / writing direction | 2 |
letter-spacing | Setting character spacing | 1 |
line-height | Setting row height | 1 |
text-align | The horizontal alignment of the provisions of the text | 1 |
text-decoration | Provision added to the text of the decorative effect | 1 |
text-indent | The provisions of the text block indent the first line | 1 |
text-transform | Sensitive controls for the text | 1 |
unicode-bidi | | 2 |
vertical-align | The vertical alignment of the element | 1 |
white-space | How to set a blank control element | 1 |
word-spacing | Word spacing settings | 1 |
hanging-punctuation | Specifies whether a punctuation mark may be beyond the line box | 3 |
punctuation-trim | Specifies whether to remove a punctuation mark | 3 |
text-align-last | When text-align is set to justify, the last line alignment. | 3 |
text-justify | Decentralized manner specified alignment when text-align is set to justify the time. | 3 |
text-outline | Set the outline text. | 3 |
text-overflow | Element specifies when the text overflows included, what should happen | 3 |
text-shadow | Add a shadow to text | 3 |
text-wrap | Rules specify text wrap | 3 |
word-break | Specifies line breaking rules for non-CJK text | 3 |
word-wrap | Whether to set the browser to be too long a word wrap. | 3 |
Attributes | Explanation | CSS |
---|
transform | Apply 2D or 3D conversion element | 3 |
transform-origin | It allows you to change the position of the conversion element | 3 |
transform-style | 3D Space specify how nested elements | 3 |
perspective | See how to specify the 3D element is a perspective view | 3 |
perspective-origin | 3D elements specify the bottom position | 3 |
backface-visibility | Whether the definition of an element should be visible, not in front of the screen | 3 |
Attributes | Explanation | CSS |
---|
appearance | Exterior style definition elements | 3 |
box-sizing | It allows you to adapt the region to somehow define certain elements | 3 |
icon | Specify an icon for the element | 3 |
nav-down | Specifies the user presses the down navigation key downward position | 3 |
nav-index | Specifies Navigation (tab) order. | 3 |
nav-left | Specify when the user presses the button to the left to navigate location | 3 |
nav-right | Specifies the user to press the right position when the left navigation | 3 |
nav-up | Specifies the user presses the up key navigate up a position | 3 |
outline-offset | Setting the offset contour edge outside the framework of the border | 3 |
resize | Whether the definition of the elements can be resized | 3 |