1) Color Properties
Thuộc tính
Mô tả chức năng
Ví dụ
color
Chỉnh màu chữ cho văn bản
color: #ff0000;
2) Background Properties
Thuộc tính
Mô tả chức năng
Ví dụ
background
background-color
Thiết lập “màu nền” của phần tử HTML
background-color: #ff0000;
background-image
Thiết lập “hình nền” cho phần tử HTML
background-image: url(ico_arrow.gif);
background-position
Xác định vị trí hình ảnh nền cho thành phần.
Được sử dụng kèm với giá trị background-image.
background-position: left top;
background-repeat
Thiết lập “sự lặp lại của hình nền” trong phần tử HTML
background-repeat: repeat-x;
background-size
Thiết lập kích thước của hình nền
background-size: 100px;
3) Border Properties
Thuộc tính
Mô tả chức năng
Ví dụ
border
Thiết lập một đường viền cho phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền.
border:1px solid black
border-left
Thiết lập đường viền cạnh bên trái của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền
border-left:1px solid black
border-right
Thiết lập đường viền cạnh bên phải của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền
border-right:1px solid black
border-top
Thiết lập đường viền cạnh phía trên của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền
border-top:1px solid black
border-bottom
Thiết lập đường viền cạnh phía dưới của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền
border-bottom:1px solid black
4) Basic Box Properties
Thuộc tính
Mô tả chức năng
Ví dụ
display
Thuộc tính display xác định loại hiển thị của thành phần.
display:block
float
Thuộc tính float xác định có hay không một thành phần được float (trôi nổi).
float:left
height
Thuộc tính height thiết lập chiều cao cho thành phần.
Chiều cao này không bao gồm: border, padding, margin
height:100px;
width
Thuộc tính width thiết lập chiều rộng cho thành phần.
Chiều rộng này không bao gồm: border, padding, margin
width:100px;
margin
Thuộc tính margin canh lề cho thành phần.đơn vị có thể là px, em, %, …
margin:50px
margin-bottom
Canh lề bên dưới cho thành phần, đơn vị có thể là px, em, %, …
margin-bottom:50px
margin-left
Canh lề bên trái cho thành phần, đơn vị có thể là px, em, %, …
margin-left:50px
margin-right
Canh lề bên phải cho thành phần, đơn vị có thể là px, em, %, …
margin-right:50px
margin-top
Canh lề bên trên cho thành phần, đơn vị có thể là px, em, %, …
margin-top:50px
padding
Thuộc tính padding thêm vào khoảng không cho thành phần.
padding:50px
padding-bottom
Thêm vào khoảng không bên dưới cho thành phần, đơn vị có thể là px, em, %, …
padding-bottom:50px
padding-left
Thêm vào khoảng không bên trái cho thành phần, đơn vị có thể là px, em, %, …
padding-left:50px
padding-right
Thêm vào khoảng không bên phải cho thành phần, đơn vị có thể là px, em, %, …
padding-right:50px
padding-top
Thêm vào khoảng không bên trên cho thành phần, đơn vị có thể là px, em, %, …
padding-top:50px
6) Text Properties
Thuộc tính
Mô tả chức năng
Ví dụ
letter-spacing
Thuộc tính letter-spacing tăng hoặc giảm khoảng cách giữa các ký tự trong đoạn text.
letter-spacing:20px
line-height
Thuộc tính line-height thiết lập chiều cao giữa các dòng.
line-height:50px;
text-align
Thuộc tính text-align sắp xếp các nội dung theo chiều ngang.
text-align:center
word-spacing
Thuộc tính word-spacing tăng hoặc giảm không gian giữa các từ trong đoạn văn bản.Có thể sử dụng giá trị âm.
word-spacing: 2px;
7) Text Decoration Properties
Thuộc tính
Mô tả chức năng
Ví dụ
text-decoration-line
Thiết lập một đường trang trí cho văn bản
text-decoration-color
Xác định “màu” của đường trang trí cho văn bản
text-decoration-style
Xác định “kiểu” của đường trang trí cho văn bản
text-decoration
Thiết lập một đường trang trí cho văn bản, bao gồm:
text-shadow
Tạo một cái bóng cho văn bản
8) Font Properties
Thuộc tính
Mô tả chức năng
Ví dụ
@font-face
font-family
Thiết lập “phông chữ” của văn bản
font-size
Thiết lập “kích cỡ chữ” của văn bản
font-style
Thiết lập việc văn bản có được “in nghiêng” hay không
font-variant
Thiết lập việc có chuyển các ký tự in thường trong văn bản sang dạng ký tự in hoa hay không
font-weight
Thiết lập việc văn bản có được “in đậm” hay không
