Hướng dẫn định dạng văn bản bằng CSS

Có nhiều cách để tạo định dạng cho văn bản của tài liệu HTML. Trong đó định dạng bằng CSS là cách được các Lập Trình Viên thường xuyên dùng nhất. Bài viết này sẽ giúp các bạn tạo định dạng cho văn bản của mình.
Nội dung trích xuất từ tài liệu:
Hướng dẫn định dạng văn bản bằng CSS Hướng dẫn định dạng văn bản bằng CSSCó nhiều cách để tạo định dạng cho văn bản của tài liệu HTML. Trongđó định dạng bằng CSS là cách được các Lập Trình Viên thường xuyêndùng nhất.Bài viết này sẽ giúp các bạn tạo định dạng cho văn bản của mình.Tạo màu cho văn bản.Để tạo màu bạn dùng đến thuộc tính color:màu;Cú pháp như sau:Ví d ụ 1p{background:#FFFFFF;color:#FF0000;}Đoạn code trên định dạng cho toàn bộ khối văn bản nằm trong thẻ.Dòng 1 tạo màu nền là màu trắng.Dòng 2 tạo màu chữ là màu đỏ.Khoảng cách giữa các ký tự trong một đoạn văn bản.Bạn có thể tăng hoặc giảm khoảng cách mặc định của các ký tự trongđoạn văn bằng cách sử dụng thuộc tính: letter-spacing: giá trị;Thuộc tính này có tác dụng định dạng lại khoảng cách của các ký tựtrong tài liệu HTML của bạn. Giá trị bạn truyền vào chính là khoảngcách giữa các ký tự.Cú pháp như sau:Ví dụ 2:h1 {letter-spacing: 2px;}h2 {letter-spacing: 4px;}Căn chỉnh khoảng cách giữa các dòng.Thuộc tính line-height: khoảng cách; sẽ giúp bạn căn chỉnh khoảngcách giữa các dòng trong một đoạn văn bản. Giá trị bạn truyền vào chínhlà khoảng cách giữa các dòng mà tài liệu HTML sẽ dùng.Cú pháp như sau:Ví dụ 3:h2{line-height: 120%;}Gạch chân cho văn bản.Trong một số trường hợp bạn muốn tăng sự chú ý của một đoạn văn bảnnào đó. Lúc này bạn cần đến thuộc tính text-decoration: của CSS.Thuộc tính text-decoration: có tác dụng tạo ra gạch chân, gạch ngang,gạch trên... cho tài liệu HTML.Thuộc tính này nhận vào 6 giá trị:Cú pháp như sau:Ví dụ 4:Đoạn code sau tạo gạch chân cho đoạn text nằm trong thẻ div có id =test#test { text-decoration: underline; }Chữ gạch dưới.Đoạn code này tạo gạch trên cho văn bản nằm trong thẻ Div#test2 { text-decoration: overline; }Chữ gạch trên{xtypo_code}{xtypo_code}Đoạn code này tạo gạch giữa cho văn bản#test3 { text-decoration: line-through; }Chữ gạch giữaĐoạn code này làm cho văn bản nhấp nháy. Có tác dụng trên Firefox.#test4 { text-decoration: blink; }Chữ nhấp nháy.