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

Chia sẻ: Abcdef_9 Abcdef_9 | Ngày: | Loại File: PDF | Số trang:6

Thêm vào BST

Báo xấu

109
lượt xem 7
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

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.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: 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 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. 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 ụ 1 p{ 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ảng cá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ảng cá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ính là 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ản nà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.