CSS Reference

0
58

Table of Contents

A

align-content căn chỉnh giữa các dòng bên trong Container
align-items căn chỉnh cho các mục bên trong Container
align-self căn chỉnh cho các mục đã chọn bên trong một vùng chứa linh hoạt
all Reset tất cả các thuộc tính (ngoại trừ unicode-bidi và direction)
animation Thuộc tính viết tắt cho tất cả các thuộc tính animation- *
animation-delay Chỉ định thời gian delay để bắt đầu hoạt ảnh
animation-direction Chỉ định xem một hoạt ảnh sẽ được phát tới, lùi hoặc theo các chu kỳ thay thế
animation-duration Chỉ định thời lượng hoạt ảnh sẽ hoàn thành một chu kỳe
animation-fill-mode Chỉ định kiểu cho phần tử khi hoạt ảnh chưa phát (before it starts, after it ends, or both)
animation-iteration-count Chỉ định số lần một hoạt ảnh sẽ được phát
animation-name Chỉ định tên cho  @keyframes hoạt ảnh
animation-play-state Chỉ định hoạt ảnh play hoặc pause
animation-timing-function Chỉ định đường cong tốc độ của hoạt ảnh

 

B

backface-visibility Xác định xem có nên nhìn thấy mặt sau của một phần tử khi đối diện với người dùng hay không
background Một thuộc tính viết tắt cho tất cả các thuộc tính background
background-attachment Đặt background image scrolls với phần còn lại của trang hay được fixed
background-blend-mode Chỉ định chế độ hòa trộn của mỗi background layer (color/image)
background-clip Defines how far the background (color or image) should extend within an element
background-color Chỉ định background color của một phần tử
background-image Chỉ định một hoặc nhiều background Image cho một phần tử
background-origin Chỉ định vị trí gốc của một background image
background-position Chỉ định vị trí của một background image
background-repeat Đặt if/how cho một background image sẽ được lặp lại
background-size Chỉ định kích thước của một background image
border Thuộc tính shorthand  (border-width, border-styleborder-color)
border-bottom Thuộc tính shorthand  (border-bottom-width, border-bottom-styleborder-bottom-color)
border-bottom-color Tô màu cho đường viền dưới
border-bottom-left-radius Xác định bán kính của đường viền góc dưới bên trái
border-bottom-right-radius Xác định bán kính của đường viền góc dưới bên phải
border-bottom-style Kiểu của đường viền dưới
border-bottom-width Chiều rộng đường viền dưới
border-collapse Đặt xem các đường viền bảng sẽ thu gọn thành một đường viền duy nhất hay được phân tách
border-color Tô màu cả 4 đường viền
border-image Thuộc tính shorthand cho tất cả thuộc tính border-image-*
border-image-outset Chỉ định số lượng mà vùng hình ảnh đường viền mở rộng ra ngoài border box
border-image-repeat Chỉ định xem hình ảnh đường viền nên được lặp lại, làm tròn hay kéo dài
border-image-slice Chỉ định cách cắt hình ảnh đường viền
border-image-source Chỉ định đường dẫn đến hình ảnh được sử dụng làm đường viền
border-image-width Chỉ định chiều rộng của hình ảnh đường viền
border-left Thuộc tính shorthand cho tất cả thuộc tính border-left-*
border-left-color Tô màu cho đường viền trái
border-left-style Kiểu của đường viền trái
border-left-width Chiều rộng đường viền trái
border-radius Thuộc tính shorthand cho 4 thuộc tính border-radius-*
border-right Thuộc tính shorthand cho tất cả thuộc tính border-right-*
border-right-color Tô màu cho đường viền phải
border-right-style Kiểu của đường viền phải
border-right-width Chiều rộng của đường viền phải
border-spacing Sets the distance between the borders of adjacent cells
border-style Sets the style of the four borders
border-top A shorthand property for border-top-width, border-top-style and border-top-color
border-top-color Sets the color of the top border
border-top-left-radius Defines the radius of the border of the top-left corner
border-top-right-radius Defines the radius of the border of the top-right corner
border-top-style Sets the style of the top border
border-top-width Sets the width of the top border
border-width Sets the width of the four borders
bottom Sets the elements position, from the bottom of its parent element
box-decoration-break Sets the behavior of the background and border of an element at page-break, or, for in-line elements, at line-break.
box-shadow Attaches one or more shadows to an element
box-sizing Defines how the width and height of an element are calculated: should they include padding and borders, or not
break-after Specifies whether or not a page-, column-, or region-break should occur after the specified element
break-before Specifies whether or not a page-, column-, or region-break should occur before the specified element
break-inside Specifies whether or not a page-, column-, or region-break should occur inside the specified element

C

caption-sideSpecifies the placement of a table caption
caret-colorSpecifies the color of the cursor (caret) in inputs, textareas, or any element that is editable
@charsetSpecifies the character encoding used in the style sheet
clearSpecifies on which sides of an element floating elements are not allowed to float
clipClips an absolutely positioned element
colorSets the color of text
column-countSpecifies the number of columns an element should be divided into
column-fillSpecifies how to fill columns, balanced or not
column-gapSpecifies the gap between the columns
column-ruleA shorthand property for all the column-rule-* properties
column-rule-colorSpecifies the color of the rule between columns
column-rule-styleSpecifies the style of the rule between columns
column-rule-widthSpecifies the width of the rule between columns
column-spanSpecifies how many columns an element should span across
column-widthSpecifies the column width
columnsA shorthand property for column-width and column-count
contentUsed with the :before and :after pseudo-elements, to insert generated content
counter-incrementIncreases or decreases the value of one or more CSS counters
counter-resetCreates or resets one or more CSS counters
cursorSpecifies the mouse cursor to be displayed when pointing over an element

D

directionSpecifies the text direction/writing direction
displaySpecifies how a certain HTML element should be displayed

E

empty-cellsSpecifies whether or not to display borders and background on empty cells in a table

F

filterDefines effects (e.g. blurring or color shifting) on an element before the element is displayed
flexA shorthand property for the flex-grow, flex-shrink, and the flex-basis properties
flex-basisSpecifies the initial length of a flexible item
flex-directionSpecifies the direction of the flexible items
flex-flowA shorthand property for the flex-direction and the flex-wrap properties
flex-growSpecifies how much the item will grow relative to the rest
flex-shrinkSpecifies how the item will shrink relative to the rest
flex-wrapSpecifies whether the flexible items should wrap or not
floatSpecifies whether or not a box should float
fontA shorthand property for the font-style, font-variant, font-weight, font-size/line-height, and the font-family properties
@font-faceA rule that allows websites to download and use fonts other than the “web-safe” fonts
font-familySpecifies the font family for text
font-feature-settingsAllows control over advanced typographic features in OpenType fonts
@font-feature-valuesAllows authors to use a common name in font-variant-alternate for feature activated differently in OpenType
font-kerningControls the usage of the kerning information (how letters are spaced)
font-language-overrideControls the usage of language-specific glyphs in a typeface
font-sizeSpecifies the font size of text
font-size-adjustPreserves the readability of text when font fallback occurs
font-stretchSelects a normal, condensed, or expanded face from a font family
font-styleSpecifies the font style for text
font-synthesisControls which missing typefaces (bold or italic) may be synthesized by the browser
font-variantSpecifies whether or not a text should be displayed in a small-caps font
font-variant-alternatesControls the usage of alternate glyphs associated to alternative names defined in @font-feature-values
font-variant-capsControls the usage of alternate glyphs for capital letters
font-variant-east-asianControls the usage of alternate glyphs for East Asian scripts (e.g Japanese and Chinese)
font-variant-ligaturesControls which ligatures and contextual forms are used in textual content of the elements it applies to
font-variant-numericControls the usage of alternate glyphs for numbers, fractions, and ordinal markers
font-variant-positionControls the usage of alternate glyphs of smaller size positioned as superscript or subscript regarding the baseline of the font
font-weightSpecifies the weight of a font

G

gridA shorthand property for the grid-template-rows, grid-template-columns, grid-template-areas, grid-auto-rows, grid-auto-columns, and the grid-auto-flow properties
grid-areaEither specifies a name for the grid item, or this property is a shorthand property for the grid-row-startgrid-column-startgrid-row-end, and grid-column-end properties
grid-auto-columnsSpecifies a default column size
grid-auto-flowSpecifies how auto-placed items are inserted in the grid
grid-auto-rowsSpecifies a default row size
grid-columnA shorthand property for the grid-column-start and the grid-column-end properties
grid-column-endSpecifies where to end the grid item
grid-column-gapSpecifies the size of the gap between columns
grid-column-startSpecifies where to start the grid item
grid-gapA shorthand property for the grid-row-gap and grid-column-gap properties
grid-rowA shorthand property for the grid-row-start and the grid-row-end properties
grid-row-endSpecifies where to end the grid item
grid-row-gapSpecifies the size of the gap between rows
grid-row-startSpecifies where to start the grid item
grid-templateA shorthand property for the grid-template-rowsgrid-template-columns and grid-areas properties
grid-template-areasSpecifies how to display columns and rows, using named grid items
grid-template-columnsSpecifies the size of the columns, and how many columns in a grid layout
grid-template-rowsSpecifies the size of the rows in a grid layout

H

hanging-punctuationSpecifies whether a punctuation character may be placed outside the line box
heightSets the height of an element
hyphensSets how to split words to improve the layout of paragraphs

I

image-renderingGives a hint to the browser about what aspects of an image are most important to preserve when the image is scaled
@importAllows you to import a style sheet into another style sheet
isolationDefines whether an element must create a new stacking content

J

justify-contentSpecifies the alignment between the items inside a flexible container when the items do not use all available space

K

@keyframesSpecifies the animation code

L

leftSpecifies the left position of a positioned element
letter-spacingIncreases or decreases the space between characters in a text
line-breakSpecifies how/if to break lines
line-heightSets the line height
list-styleSets all the properties for a list in one declaration
list-style-imageSpecifies an image as the list-item marker
list-style-positionSpecifies the position of the list-item markers (bullet points)
list-style-typeSpecifies the type of list-item marker

M

marginSets all the margin properties in one declaration
margin-bottomSets the bottom margin of an element
margin-leftSets the left margin of an element
margin-rightSets the right margin of an element
margin-topSets the top margin of an element
max-heightSets the maximum height of an element
max-widthSets the maximum width of an element
@mediaSets the style rules for different media types/devices/sizes
min-heightSets the minimum height of an element
min-widthSets the minimum width of an element
mix-blend-modeSpecifies how an element’s content should blend with its direct parent background

O

object-fitSpecifies how the contents of a replaced element should be fitted to the box established by its used height and width
object-positionSpecifies the alignment of the replaced element inside its box
opacitySets the opacity level for an element
orderSets the order of the flexible item, relative to the rest
orphansSets the minimum number of lines that must be left at the bottom of a page when a page break occurs inside an element
outlineA shorthand property for the outline-width, outline-style, and the outline-color properties
outline-colorSets the color of an outline
outline-offsetOffsets an outline, and draws it beyond the border edge
outline-styleSets the style of an outline
outline-widthSets the width of an outline
overflowSpecifies what happens if content overflows an element’s box
overflow-wrapSpecifies whether or not the browser may break lines within words in order to prevent overflow (when a string is too long to fit its containing box)
overflow-xSpecifies whether or not to clip the left/right edges of the content, if it overflows the element’s content area
overflow-ySpecifies whether or not to clip the top/bottom edges of the content, if it overflows the element’s content area

P

paddingA shorthand property for all the padding-* properties
padding-bottomSets the bottom padding of an element
padding-leftSets the left padding of an element
padding-rightSets the right padding of an element
padding-topSets the top padding of an element
page-break-afterSets the page-break behavior after an element
page-break-beforeSets the page-break behavior before an element
page-break-insideSets the page-break behavior inside an element
perspectiveGives a 3D-positioned element some perspective
perspective-originDefines at which position the user is looking at the 3D-positioned element
pointer-eventsDefines whether or not an element reacts to pointer events
positionSpecifies the type of positioning method used for an element (static, relative, absolute or fixed)

Q

quotesSets the type of quotation marks for embedded quotations

R

resizeDefines if (and how) an element is resizable by the user
rightSpecifies the right position of a positioned element

S

scroll-behaviorSpecifies whether to smoothly animate the scroll position in a scrollable box, instead of a straight jump

T

tab-sizeSpecifies the width of a tab character
table-layoutDefines the algorithm used to lay out table cells, rows, and columns
text-alignSpecifies the horizontal alignment of text
text-align-lastDescribes how the last line of a block or a line right before a forced line break is aligned when text-align is “justify”
text-combine-uprightSpecifies the combination of multiple characters into the space of a single character
text-decorationSpecifies the decoration added to text
text-decoration-colorSpecifies the color of the text-decoration
text-decoration-lineSpecifies the type of line in a text-decoration
text-decoration-styleSpecifies the style of the line in a text decoration
text-indentSpecifies the indentation of the first line in a text-block
text-justifySpecifies the justification method used when text-align is “justify”
text-orientationDefines the orientation of the text in a line
text-overflowSpecifies what should happen when text overflows the containing element
text-shadowAdds shadow to text
text-transformControls the capitalization of text
text-underline-positionSpecifies the position of the underline which is set using the text-decoration property
topSpecifies the top position of a positioned element
transformApplies a 2D or 3D transformation to an element
transform-originAllows you to change the position on transformed elements
transform-styleSpecifies how nested elements are rendered in 3D space
transitionA shorthand property for all the transition-* properties
transition-delaySpecifies when the transition effect will start
transition-durationSpecifies how many seconds or milliseconds a transition effect takes to complete
transition-propertySpecifies the name of the CSS property the transition effect is for
transition-timing-functionSpecifies the speed curve of the transition effect

U

unicode-bidiUsed together with the direction property to set or return whether the text should be overridden to support multiple languages in the same document
user-selectSpecifies whether the text of an element can be selected

V

vertical-alignSets the vertical alignment of an element
visibilitySpecifies whether or not an element is visible

W

white-spaceSpecifies how white-space inside an element is handled
widowsSets the minimum number of lines that must be left at the top of a page when a page break occurs inside an element
widthSets the width of an element
word-breakSpecifies how words should break when reaching the end of a line
word-spacingIncreases or decreases the space between words in a text
word-wrapAllows long, unbreakable words to be broken and wrap to the next line
writing-modeSpecifies whether lines of text are laid out horizontally or vertically

Z

z-indexSets the stack order of a positioned element

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây