Thuộc tính Outline sẽ vẽ một đường bao ngoài toàn bộ một phần tử HTML, đối với phần tử có đường viền (border) thì đường bao này sẽ bao trọn đường viền của phần tử đó. Cũng tương tự như đường viền bạn có thể đặt cho nó các thuộc tính về màu săc, độ lớn và kiểu.
Có một điều cần chú ý là các thuộc tính của đường bao này có thể không được hỗ trợ trên IE
01Đặt thuộc màu cho đường bao
Nếu muốn đặt màu cho đường bao chúng ta có thể sử dụng thuộc tính outline-color:
p {
outline-color: #CC0000;
}
02Đặt độ rộng cho đường bao.
Tương tự như đường viền, để đặt độ rộng cho đường bao chúng ta đặt giá trị độ lớn cho thuộc tính outline-width:
p {
outline-width: 2px;
}
03Chọn kiểu đường bao
Để chọn kiểu cho đường bao chúng ta sẽ đặt lần lượt các giá trị cho thuộc tính outline-style:
p {
outline-style: dotted;
}
| STT | outline-style |
|---|---|
| 1 | none |
| 2 | hidden |
| 3 | dotted |
| 4 | dashed |
| 5 | solid |
| 6 | double |
| 7 | groove |
| 8 | ridge |
| 9 | inset |
| 10 | outset |
Để cho gọn chúng ta cũng có thể viết các giá trị của thuộc tính Outline dưới dạng shorthand như sau:
div.outline {
outline: 1px solid #000;
}
(chu huu trung)
- 17/05/2010 15:45 - 7 thủ thuật CSS thường dùng đối với các lỗi "cố ý" của IE
- 10/05/2010 17:21 - Làm thẻ div có thanh cuộn (scrollbar) giống iFrame
- 10/05/2010 17:18 - 10 Thủ thuật CSS mà bạn cần biết - Phần I
- 24/04/2010 09:07 - Bài 12: CSS với bảng biểu (table)
- 24/04/2010 09:05 - Bài 10: CSS padding
- 24/04/2010 08:59 - Bài 8: Các thuộc tính của margin
- 24/04/2010 08:57 - Bài 7: Đường viền và các thuộc tính của đường viền
- 24/04/2010 08:54 - Bài 6: Các thuộc tính của font chữ và định nghĩa font chữ cho văn bản
- 24/04/2010 08:51 - Bài 5: Các vấn đề về văn bản và cách định dạng văn bản
- 24/04/2010 08:49 - Bài 4: Thuộc tính background và cách định nghĩa background cho một thẻ









