Đối tượng Style của HTML DOM
- Trang trước HTML DOMTokenList
- Trang tiếp theo API Canvas
Đối tượng Style
Đối tượng Style đại diện cho một biểu đạt phong cách riêng lẻ.
Thuộc tính của đối tượng Style
| Thuộc tính | Mô tả |
|---|---|
| alignContent | Đặt hoặc trả về cách đối齐 giữa các hàng trong khối container đàn hồi, khi các phần tử không sử dụng tất cả không gian có sẵn. |
| alignItems | Đặt hoặc trả về cách đối齐 của phần tử trong khối container đàn hồi. |
| alignSelf | Đặt hoặc trả về cách đối齐 của phần tử được chọn trong khối container đàn hồi. |
| animation | Thuộc tính viết tắt cho tất cả các thuộc tính animation, trừ animationPlayState. |
| animationDelay | Đặt hoặc trả về thời điểm animation bắt đầu. |
| animationDirection | Đặt hoặc trả về animation có nên phát ngược trong vòng lặp chẵn hay không. |
| animationDuration | Đặt hoặc trả về số giây hoặc mili giây cần để animation hoàn thành một chu kỳ. |
| animationFillMode | Đặt hoặc trả về giá trị áp dụng ngoài thời gian thực hiện animation. |
| animationIterationCount | Đặt hoặc trả về số lần animation nên phát. |
| animationName | Đặt hoặc trả về tên animation @keyframes. |
| animationPlayState | Đặt hoặc trả về trạng thái chạy hoặc dừng của animation. |
| animationTimingFunction | Đặt hoặc trả về đường cong tốc độ của animation. |
| background | Đặt hoặc trả về tất cả các thuộc tính nền trong một dòng. |
| backgroundAttachment | Đặt hoặc trả về ảnh nền là cố định hay di chuyển theo cuộn trang. |
| backgroundClip | Đặt hoặc trả về khu vực vẽ nền. |
| backgroundColor | Đặt hoặc trả về màu nền của phần tử. |
| backgroundImage | Đặt hoặc trả về ảnh nền của phần tử. |
| backgroundOrigin | Đặt hoặc trả về khu vực định vị của hình ảnh nền. |
| backgroundPosition | Đặt hoặc trả về vị trí bắt đầu của hình ảnh nền. |
| backgroundRepeat | Đặt hoặc trả về cách lặp lại (làm nền) hình ảnh nền. |
| backgroundSize | Đặt hoặc trả về kích thước của hình ảnh nền. |
| backfaceVisibility | Đặt hoặc trả về việc phần tử có nên hiển thị khi không hướng về màn hình hay không. |
| border | Đặt hoặc trả về việc đường viền,樣式 và màu của đường viền nên được đặt trong một dòng. |
| borderBottom | Đặt hoặc trả về tất cả các thuộc tính borderBottom trong một dòng. |
| borderBottomColor | Đặt hoặc trả về màu của đường viền bên dưới. |
| borderBottomLeftRadius | Đặt hoặc trả về hình dạng của đường viền góc trái dưới. |
| borderBottomRightRadius | Đặt hoặc trả về hình dạng của đường viền góc phải dưới. |
| borderBottomStyle | Đặt hoặc trả về樣式 của đường viền bên dưới. |
| borderBottomWidth | Đặt hoặc trả về độ rộng của đường viền bên dưới. |
| borderCollapse | Đặt hoặc trả về việc đường viền của bảng nên được gộp lại thành một đường viền duy nhất hay không. |
| borderColor | Đặt hoặc trả về màu của đường viền của phần tử (được đặt tối đa bốn giá trị). |
| borderImage | Thuật ngữ viết tắt để đặt hoặc trả về tất cả các thuộc tính borderImage. |
| borderImageOutset | Đặt hoặc trả về lượng hình ảnh đường viền vượt ra ngoài box của đường viền. |
| borderImageRepeat | Đặt hoặc trả về việc hình ảnh đường viền nên lặp lại, quấn hoặc kéo dãn. |
| borderImageSlice | Đặt hoặc trả về lượng dịch vào trong của đường viền hình ảnh. |
| borderImageSource | Đặt hoặc trả về hình ảnh được sử dụng làm đường viền. |
| borderImageWidth | Đặt hoặc trả về độ rộng của đường viền hình ảnh. |
| borderLeft | Đặt hoặc trả về tất cả các thuộc tính borderLeft trong một dòng. |
| borderLeftColor | Đặt hoặc trả về màu của đường viền bên trái. |
| borderLeftStyle | Đặt hoặc trả về樣式 của đường viền bên trái. |
| borderLeftWidth | Đặt hoặc trả về độ rộng của đường viền bên trái. |
| borderRadius | Thuật ngữ viết tắt để đặt hoặc trả về tất cả bốn thuộc tính borderRadius. |
| borderRight | Đặt hoặc trả về tất cả các thuộc tính borderRight trong một dòng. |
| borderRightColor | Đặt hoặc trả về màu của đường viền bên phải. |
| borderRightStyle | cài đặt hoặc trả về phong cách của viền phải. |
| borderRightWidth | cài đặt hoặc trả về độ rộng của viền phải. |
| borderSpacing | cài đặt hoặc trả về khoảng trống giữa các ô trong bảng. |
| borderStyle | cài đặt hoặc trả về phong cách của viền của phần tử (được phép thiết lập tối đa bốn giá trị). |
| borderTop | cài đặt hoặc trả về tất cả các thuộc tính borderTop trong một câu声明. |
| borderTopColor | cài đặt hoặc trả về màu sắc của viền trên. |
| borderTopLeftRadius | cài đặt hoặc trả về hình dạng của góc trên trái của viền. |
| borderTopRightRadius | cài đặt hoặc trả về hình dạng của góc trên phải của viền. |
| borderTopStyle | cài đặt hoặc trả về phong cách của viền trên. |
| borderTopWidth | cài đặt hoặc trả về độ rộng của viền trên. |
| borderWidth | cài đặt hoặc trả về độ rộng của viền của phần tử (được phép thiết lập tối đa bốn giá trị). |
| bottom | cài đặt hoặc trả về vị trí dưới cùng của phần tử định vị. |
| boxDecorationBreak | cài đặt hoặc trả về hành vi của nền và viền khi phân trang hoặc khi đổi hàng cho các phần tử nội tuyến. |
| boxShadow | thêm một hoặc nhiều bóng vào khung (box). |
| boxSizing | cho phép bạn định nghĩa một số phần tử phù hợp với một khu vực nào đó. |
| captionSide | cài đặt hoặc trả về vị trí của tiêu đề bảng. |
| caretColor | cài đặt hoặc trả về màu sắc của dấu nhắc hoặc con trỏ. |
| clear | cài đặt hoặc trả về vị trí của phần tử so với đối tượng nổi. |
| clip | cài đặt hoặc trả về phần nào của phần tử định vị là hiển thị. |
| color | cài đặt hoặc trả về màu sắc của văn bản. |
| columnCount | cài đặt hoặc trả về số cột mà phần tử nên được chia. |
| columnFill | cài đặt hoặc trả về cách lấp đầy các cột. |
| columnGap | cài đặt hoặc trả về khoảng cách giữa các cột. |
| columnRule | dùng để cài đặt hoặc trả về thuộc tính viết tắt của tất cả các thuộc tính columnRule. |
| columnRuleColor | cài đặt hoặc trả về màu sắc của quy tắc giữa các cột. |
| columnRuleStyle | cài đặt hoặc trả về phong cách của quy tắc giữa các cột. |
| columnRuleWidth | cài đặt hoặc trả về độ rộng của quy tắc giữa các cột. |
| columns | dùng để cài đặt hoặc trả về thuộc tính viết tắt của columnWidth và columnCount. |
| columnSpan | cài đặt hoặc trả về số cột mà phần tử nên vượt qua. |
| columnWidth | cài đặt hoặc trả về độ rộng của cột. |
| content | Sử dụng cùng với các phần tử ảo :before và :after, chèn nội dung được tạo ra. |
| counterIncrement | Tăng một hoặc nhiều bộ đếm. |
| counterReset | Tạo hoặc đặt lại một hoặc nhiều bộ đếm. |
| cursor | Đặt hoặc trả về loại con trỏ chuột được hiển thị. |
| direction | Đặt hoặc trả về hướng văn bản. |
| display | Đặt hoặc trả về loại hiển thị của phần tử. |
| emptyCells | Đặt hoặc trả về việc có hiển thị viền và nền của ô trống hay không. |
| filter | Đặt hoặc trả về bộ lọc hình ảnh (hiệu ứng thị giác như mờ và độ bão hòa). |
| flex | Đặt hoặc trả về chiều dài của đối tượng, so với phần còn lại. |
| flexBasis | Đặt hoặc trả về chiều dài ban đầu của đối tượng flex. |
| flexDirection | Đặt hoặc trả về hướng của đối tượng flex. |
| flexFlow | Thuật ngữ viết tắt của thuộc tính flexDirection và flexWrap. |
| flexGrow | Đặt hoặc trả về lượng tăng của đối tượng so với các đối tượng khác. |
| flexShrink | Đặt hoặc trả về cách co lại của đối tượng so với các đối tượng khác. |
| flexWrap | Đặt hoặc trả về việc đối tượng flex có nên chuyển dòng hay không. |
| cssFloat | Đặt hoặc trả về cách đối齐 ngang của phần tử. |
| font | Đặt hoặc trả về thuộc tính font trong một câu chỉ định. |
| fontFamily | Đặt hoặc trả về họ font của văn bản. |
| fontSize | Đặt hoặc trả về kích thước font của văn bản. |
| fontStyle | Đặt hoặc trả về phong cách của font là normal, italic hay oblique. |
| fontVariant | Đặt hoặc trả về font có nên hiển thị bằng chữ in hoa nhỏ hay không. |
| fontWeight | Đặt hoặc trả về độ dày của font. |
| fontSizeAdjust | Giữ tính đọc của văn bản khi xảy ra sự trả lại font. |
| fontStretch | Chọn cách co giãn và biến dạng của hệ thống font. |
| hangingPunctuation | Định nghĩa dấu phẩy có thể đặt bên ngoài khung dòng không. |
| height | Đặt hoặc trả về chiều cao của phần tử. |
| hyphens | Đặt cách chia từ để cải thiện bố cục đoạn. |
| icon | Cho phép tác giả sử dụng các vật liệu tương đương để đặt phong cách của phần tử. |
| imageOrientation | Định nghĩa hướng quay phải hoặc theo chiều kim đồng hồ mà người đại diện ứng dụng áp dụng cho hình ảnh. |
| isolation | Định nghĩa phần tử có phải tạo nội dung堆叠 mới hay không. |
| justifyContent | Khi đối tượng không sử dụng tất cả không gian khả dụng, đặt hoặc trả về cách đối齐 giữa các đối tượng trong khối容trí elastic. |
| left | Đặt hoặc trả về vị trí bên trái của phần tử định vị. |
| letterSpacing | Đặt hoặc trả về khoảng cách giữa các ký tự trong văn bản. |
| lineHeight | Đặt hoặc trả về khoảng cách giữa dòng trong văn bản. |
| listStyle | Đặt hoặc trả về phong cách danh sách trong một dòng. |
| listStyleImage | Đặt hoặc trả về hình ảnh làm dấu hiệu của mục danh sách. |
| listStylePosition | Đặt hoặc trả về vị trí của dấu hiệu của mục danh sách. |
| listStyleType | Đặt hoặc trả về loại dấu hiệu của mục danh sách. |
| margin | Đặt hoặc trả về mép ngoài của phần tử (tối đa có thể đặt bốn giá trị). |
| marginBottom | Đặt hoặc trả về mép ngoài dưới của phần tử. |
| marginLeft | Đặt hoặc trả về mép ngoài trái của phần tử. |
| marginRight | Đặt hoặc trả về mép ngoài phải của phần tử. |
| marginTop | Đặt hoặc trả về mép ngoài trên của phần tử. |
| maxHeight | Đặt hoặc trả về chiều cao tối đa của phần tử. |
| maxWidth | Đặt hoặc trả về chiều rộng tối đa của phần tử. |
| minHeight | Đặt hoặc trả về chiều cao tối thiểu của phần tử. |
| minWidth | Đặt hoặc trả về chiều rộng tối thiểu của phần tử. |
| navDown | Đặt hoặc trả về vị trí navigation khi sử dụng phím mũi tên xuống. |
| navIndex | Đặt hoặc trả về thứ tự nhảy của phần tử. |
| navLeft | Đặt hoặc trả về vị trí navigation khi sử dụng phím mũi tên trái. |
| navRight | Đặt hoặc trả về vị trínavigation khi sử dụng phím mũi tên phải. |
| navUp | Đặt hoặc trả về vị trí导航 khi sử dụng phím mũi tên lên. |
| objectFit | Chỉ định cách nội dung của phần tử thay thế nên phù hợp với khung được thiết lập bởi chiều cao và chiều rộng của nó. |
| objectPosition | Chỉ định cách đối齡 của phần tử thay thế trong khung của nó. |
| opacity | Đặt hoặc trả về cấp độ không mờ của phần tử. |
| order | Đặt hoặc trả về thứ tự của mục弹性相对于 các mục còn lại. |
| orphans | Đặt hoặc trả về số dòng tối thiểu phải留在 cuối trang khi xảy ra phân trang trong phần tử. |
| outline | Đặt hoặc trả về tất cả các thuộc tính outline trong một dòng. |
| outlineColor | Đặt hoặc trả về màu của viền xung quanh phần tử. |
| outlineOffset | Chuyển vị viền và vẽ nó bên ngoài cạnh viền. |
| outlineStyle | Đặt hoặc trả về kiểu của viền xung quanh phần tử. |
| outlineWidth | Đặt hoặc trả về độ rộng của viền xung quanh phần tử. |
| overflow | Đặt hoặc trả về cách xử lý nội dung hiển thị bên ngoài khung phần tử. |
| overflowX | Điều chỉnh cách xử lý cạnh trái/phải của nội dung, nếu nó chảy ra khỏi khu vực nội dung của phần tử. |
| overflowY | Đặt hoặc trả về cách xử lý cạnh trên/dưới của nội dung, nếu nó chảy ra khỏi khu vực nội dung của phần tử. |
| padding | Đặt hoặc trả về khoảng cách trong của phần tử (được phép đặt tối đa bốn giá trị). |
| paddingBottom | Đặt hoặc trả về khoảng cách dưới trong lề trong của phần tử. |
| paddingLeft | Đặt hoặc trả về khoảng cách trái trong lề trong của phần tử. |
| paddingRight | Đặt hoặc trả về khoảng cách phải trong lề trong của phần tử. |
| paddingTop | Đặt hoặc trả về khoảng cách trên trong lề trong của phần tử. |
| pageBreakAfter | Đặt hoặc trả về hành vi phân trang sau phần tử. |
| pageBreakBefore | Đặt hoặc trả về hành vi phân trang trước phần tử. |
| pageBreakInside | Đặt hoặc trả về hành vi phân trang trong phần tử. |
| perspective | Đặt hoặc trả về cách nhìn của phần tử 3D. |
| perspectiveOrigin | Đặt hoặc trả về vị trí dưới cùng của phần tử 3D. |
| position | Đặt hoặc trả về loại phương pháp định vị của phần tử (tĩnh, tương đối, tuyệt đối hoặc cố định). |
| quotes | Đặt hoặc trả về loại dấu ngoặc kép của dẫn lời. |
| resize | Đặt hoặc trả về phần tử có thể được người dùng điều chỉnh kích thước hay không. |
| right | Đặt hoặc trả về vị trí bên phải của phần tử định vị. |
| scrollBehavior | Đặt hoặc trả về hiệu ứng cuộn tròn mượt mà khi người dùng nhấp vào liên kết trong khung cuộn, thay vì nhảy thẳng. |
| tableLayout | Đặt hoặc trả về cách bố trí của tế bào bảng, hàng và cột. |
| tabSize | Đặt hoặc trả về độ dài của tab. |
| textAlign | Đặt hoặc trả về cách đối齡 ngang của văn bản. |
| textAlignLast | Khi text-align được đặt thành "justify", đặt hoặc trả về cách đối齡 của dòng cuối cùng của khối hoặc dòng trước khi mạnh bạo chuyển dòng. |
| textDecoration | Đặt hoặc trả về văn bản trang trí. |
| textDecorationColor | Đặt hoặc trả về màu sắc của văn bản trang trí. |
| textDecorationLine | Đặt hoặc trả về loại dòng trong văn bản trang trí. |
| textDecorationStyle | Đặt hoặc trả về樣式 của đường line trong văn bản trang trí. |
| textIndent | Đặt hoặc trả về cách gập vào của dòng văn bản đầu tiên. |
| textJustify | Đặt hoặc trả về phương pháp đối齡 khi text-align được đặt thành "justify". |
| textOverflow | Đặt hoặc trả về tình huống xảy ra khi văn bản chảy ra khỏi phần tử bao gồm. |
| textShadow | Đặt hoặc trả về hiệu ứng bóng của văn bản. |
| textTransform | Đặt hoặc trả về kích thước chữ của văn bản. |
| top | Đặt hoặc trả về vị trí trên cùng của yếu tố định vị. |
| transform | Áp dụng变换 2D hoặc 3D cho yếu tố. |
| transformOrigin | Đặt hoặc trả về vị trí của yếu tố được chuyển đổi. |
| transformStyle | Đặt hoặc trả về cách render các yếu tố con trong không gian 3D. |
| transition | Được sử dụng để đặt hoặc trả về tắt gọn của bốn thuộc tính chuyển đổi. |
| transitionProperty | Đặt hoặc trả về thuộc tính CSS của hiệu ứng chuyển đổi. |
| transitionDuration | Đặt hoặc trả về số giây hoặc mili giây cần thiết để hoàn thành hiệu ứng chuyển đổi. |
| transitionTimingFunction | Đặt hoặc trả về đường cong tốc độ của hiệu ứng chuyển đổi. |
| transitionDelay | Đặt hoặc trả về thời điểm bắt đầu hiệu ứng chuyển đổi. |
| unicodeBidi | Đặt hoặc trả về việc có nên che盖 văn bản để hỗ trợ nhiều ngôn ngữ trong cùng một tài liệu hay không. |
| userSelect | Đặt hoặc trả về việc có thể chọn văn bản của yếu tố hay không. |
| verticalAlign | Đặt hoặc trả về cách canh dọc nội dung của yếu tố. |
| visibility | Đặt hoặc trả về yếu tố có thể nhìn thấy hay không. |
| whiteSpace | Đặt hoặc trả về cách xử lý các ký tự tab, ký tự ngắt dòng và khoảng trống trong văn bản. |
| width | Đặt hoặc trả về độ rộng của yếu tố. |
| wordBreak | Đặt hoặc trả về quy tắc ngắt dòng của các ngôn ngữ không phải CJK. |
| wordSpacing | Đặt hoặc trả về khoảng cách giữa các từ trong văn bản. |
| wordWrap | Cho phép từ dài, không thể bị ngắt được được ngắt và chuyển sang dòng mới. |
| widows | Đặt hoặc trả về số dòng tối thiểu của yếu tố phải hiển thị ở trên cùng của trang. |
| zIndex | Đặt hoặc trả về thứ tự đ堆栈 của yếu tố định vị. |
Truy cập vào đối tượng Style
Bạn có thể truy cập vào đối tượng Style từ phần head của tài liệu hoặc từ yếu tố HTML cụ thể.
Ví dụ 1
Truy cập vào đối tượng樣式 từ phần head của tài liệu:
var x = document.getElementsByTagName("STYLE");
Ví dụ 2
Truy cập vào đối tượng樣式 của yếu tố được chỉ định:
var x = document.getElementById("myH1").style;
Tạo đối tượng Style
Ví dụ 1
Bạn có thể sử dụng phương thức document.createElement() để tạo yếu tố <style>:
var x = document.createElement("STYLE");
Ví dụ 2
Bạn cũng có thể thiết lập thuộc tính phong cách cho phần tử hiện có:
document.getElementById("myH1").style.color = "red";
Trang liên quan
Hướng dẫn HTML:HTML CSS
Hướng dẫn CSS:Hướng dẫn CSS
Tài liệu tham khảo HTML:Thẻ <style> trong HTML
Tài liệu tham khảo CSS:Thuộc tính CSS
- Trang trước HTML DOMTokenList
- Trang tiếp theo API Canvas
