Style cho thẻ hr
Posted by thietkewebsitegiare on 15/12/2008
<hr> là một thẻ tự đóng, điều đó có nghĩa là nó không cần thẻ đóng như những thẻ HTML khác. Thẻ <hr> sẽ tạo ra một đường kẻ ngang trên trình duyệt và khoảng cách giữa đường kẻ và nội dung thì phụ thuộc vào các trình duyệt khác nhau.
Tuy nhiên bạn hoàn toàn có thể thay đổi cách hiển thị của thẻ <hr> theo ý mình trên một số trình duyệt. Đối với một số trình duyệt mới (IE6, IE7, Firefox, Opera, Mozilla…) thì cách định dạng của bạn hoàn toàn có thể tương thích.
Trong cách định dạng thẻ <hr> chúng ta cũng cần phải chú ý một chút về cách mà cách trình duyệt xử lí đối với đối tượng thẻ <hr>. Với Internet Explore (IE) sẽ sử dụng thuộc tính color để hiển thị màu của đường kẻ và thuộc tính background sẽ không có tác dụng. Tuy nhiên thì Mozilla(Netscape) và Opera thì lại dùng thuộc tính background để hiển thị màu của đường kẻ. Chúng ta cũng có thể sử dụng thuộc tính border để hiển thị định dạng, nhưng đó không phải là một cách mà chúng ta muốn.
Chúng ta có đoạn mã CSS định dạng thẻ <hr> như sau:
hr {
color: red;
background: red;
border: 0;
height: 1px;
}
Thêm khoảng cách giữa đường kẻ và phần nội dung.
Để thêm khoảng cách giữa đường kẻ và nội dung chúng ta sẽ dùng thuộc tính margin để quy định khoảng cách này.
hr {
color: red;
background: red;
border: 0;
height: 1px;
margin: 10px 0 20px; }
Với thuộc tính margin như trên chúng ta sẽ có khoảng cách giữa đường kẻ với phía trên là 10px, phía dưới là 20px và khoảng cách hai bên bằng 0
Chúc bạn thành công – www.ticsoft.com (Nguồn: cssyeah )
