Gốc > Những vấn đề về CNTT > Web > HTML >
Đỗ Thanh Dương @ 16:40 19/03/2011
Số lượt xem: 436
Bài 10 - Cascading Style Sheets
Tương tự trong Word, bạn có thể dùng Style Sheets (CSS) trong HTML để định dạng cho trang web. Thay vì phải viết đi viết lại một số TAGs, bạn có thể viết sẵn trong một đoạn code ở đầu trang hoặc trong một .css file rồi import vào trang web. CSS/CSS2 có rất nhiều thuộc tính mà tôi không thể kể hết trong trang này, xin giới thiệu với bạn chút ít về nó để bạn làm quen và có thể học thêm bằng cách xem trong HTML code của các trang web hay. Xem trong đoạn code dưới bạn sẽ thấy rõ hơn tác dụng của CSS.
Trong ví dụ trên, bạn thấy dòng chữ "This is a test" không nằm trong cặp TAG<font> và </font> mà nằm giữa <div> và <div>. TAG <div> mang thuộc tínhclass="text" và có tác dụng như: <font face="arial, verdana" color="red" size="2">. Và cứ như vậy với những đoạn text khác trong cả trang. Cái lợi ở đây là khi muốn thay đổi giao diện cả trang, bạn không cần sửa từng đoạn code mà chỉ cần thay đổi thuộc tính .text trong CSS.
| <html> <style type="text/css"> .button{ background-color: #7083c7; color: #ffffff; border-left: 1px solid #9dbcff; border-right: 1px solid navy; border-top: 1px solid #9dbcff; border-bottom: 1px solid navy } .text{ font-family: arial, verdana; font-color: red; font-size: 12px; } body { SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #7083c7 } </style> <body> <form> <input type="button" value="send" class="button"> </form> <div class="text">This is a test</div> </body> </html> |
Trong ví dụ trên, bạn thấy dòng chữ "This is a test" không nằm trong cặp TAG<font> và </font> mà nằm giữa <div> và <div>. TAG <div> mang thuộc tínhclass="text" và có tác dụng như: <font face="arial, verdana" color="red" size="2">. Và cứ như vậy với những đoạn text khác trong cả trang. Cái lợi ở đây là khi muốn thay đổi giao diện cả trang, bạn không cần sửa từng đoạn code mà chỉ cần thay đổi thuộc tính .text trong CSS.
| Thuộc tính của font | |
|
| Thuộc tính của nền và màu trong trang web | |||
|
Đỗ Thanh Dương @ 16:40 19/03/2011
Số lượt xem: 436
Số lượt thích:
0 người
- Bài 9 - Form, List và một mớ bòng bong (19/03/11)
- Bài 8 - JavaScript - gia vị cho homepage (19/03/11)
- Bài 7 - Âm nhạc, phim ảnh trong trang web (19/03/11)
- Bài 6 - Frames - "Windows Explorer" trong trang web (19/03/11)
- Bài 5 - Table - bố cục một trang web sử dụng bảng (19/03/11)
Ý kiến trao đổi