<span style="color:blue" >Chu mau xanh</span> |
- Đoạn code trên sẽ xuất ra trình duyệt web nội dung là Chu mau xanh (nội dung này có màu là màu xanh)
- Thuộc tính style có thêm 2 thuộc tính nữa là thuộc tính color và thuộc tính font-size.Thuộc tính color dùng để xác định màu cho chữ , còn thuộc tính font-size xác định kích cỡ cho chữ . Ví dụ :
<span style="color:#f831ac;font-size:36px" >Chu mau hong voi co chu la 36px</span> |
- Kết quả là :
Chu mau hong voi co chu la 36px |
- Có thể dùng thêm code css hover để đổi màu khi rê chuột vào chữ .Ví dụ :
<style> span.lll { color:blue; font-size:36px; } span.lll:hover { color:#f831ac } </style> <span class="lll" >Dong chu gi do</span> |
- Kết quả là :
Dong chu gi do |
- Khi rê chuột vào nội dung Dong chu gi do thì sẽ thấy chuyển màu từ màu xanh sang màu hồng
- Code css được để trong thẻ style (nội dung code css nằm trong chuỗi <style> và </style> )
- Khi viết là span.lll thì có nghĩa là xác định vị trí định dạng css tại thẻ span có class là lll (bạn để ý sẽ thấy mình có viết là <span class="lll" > , có nghĩa là mình tạo ra 1 dòng chữ span có class là lll ).Khi viết là span.lll:hover thì có nghĩa là xác định vị trí định dạng css tại thẻ span có class là lll nhưng chỉ định dạng khi rê chuột vào thẻ span này
- Ban đầu chữ có màu xanh (dùng thuộc tính color) và cỡ chữ là 36px (dùng thuộc tính font-size) (nội dung phần code ban đầu này được ghi tại vị trí span.lll ).Sau đó mà chữ chuyển sang màu hồng ( color:#f831ac ) là do được viết tại vị trí span.lll:hover