Đề cương CSS
Đường viền là một đường được vẽ bên ngoài đường viền của phần tử.
Đề cương CSS
Đường viền là một đường được vẽ xung quanh các phần tử, BÊN NGOÀI các đường viền, để làm cho phần tử "nổi bật".
CSS có các thuộc tính phác thảo sau:
-
outline-style
-
outline-color
-
outline-width
-
outline-offset
-
outline
Lưu ý: Đường viền khác với đường viền ! Không giống như đường viền, đường viền được vẽ bên ngoài đường viền của phần tử và có thể chồng lên nội dung khác. Ngoài ra, đường viền KHÔNG phải là một phần của các kích thước của phần tử; tổng chiều rộng và chiều cao của phần tử không bị ảnh hưởng bởi chiều rộng của đường viền.
Kiểu phác thảo CSS
Thuộc outline-style
tính chỉ định kiểu của đường viền và có thể có một trong các giá trị sau:
dotted
- Xác định một dàn bài có dấu chấmdashed
- Xác định đường viền đứt nétsolid
- Xác định một phác thảo vững chắcdouble
- Xác định một dàn bài képgroove
- Defines a 3D grooved outlineridge
- Defines a 3D ridged outlineinset
- Defines a 3D inset outlineoutset
- Defines a 3D outset outlinenone
- Defines no outlinehidden
- Defines a hidden outline
The following example shows the different outline-style
values:
Example
Demonstration of the different outline styles:
p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;}
Result:
A dotted outline.
A dashed outline.
A solid outline.
A double outline.
A groove outline. The effect depends on the outline-color value.
A ridge outline. The effect depends on the outline-color value.
An inset outline. The effect depends on the outline-color value.
An outset outline. The effect depends on the outline-color value.
Note: None of the other outline properties (which you will learn more about in the next chapters) will have ANY effect unless the
outline-style
property is set!