Bạn sẽ sử dụng bộ quy tắc CSS nào để gạch chân một đoạn văn?

Bạn có thể đã trang trí nhà của mình trong những ngày lễ, hoặc có lẽ cho một số bữa tiệc lớn (Senior Prom, có ai không?), và vì vậy bạn biết những dự án như vậy có thể gây khó khăn lớn như thế nào. Tháo đồ nữ trang, dây đèn hoặc giấy crepe, làm sạch. nó đủ để khiến bạn không bao giờ làm điều đó một lần nữa

May mắn thay, trang trí văn bản gần như không căng thẳng. Trên thực tế, nó thực sự khá dễ dàng và có thể hữu ích hơn một số ít hoa giấy rẻ tiền. Nghĩ lại thì, hầu hết mọi thứ cũng vậy, nhưng đừng bận tâm đến điều đó bây giờ. Hãy xem cách chúng ta có thể trang trí văn bản và cách sử dụng văn bản đó trong thiết kế trang Web

trạm trang trí

Tài sản được đề cập là

H4 {text-decoration: underline;}
2. Giá trị mặc định của nó là
H4 {text-decoration: underline;}
3, điều này hợp lý, vì tiêu chuẩn cho hầu hết văn bản là không có bất kỳ trang trí đặc biệt nào

Loại trang trí đầu tiên được kiểm tra là

H4 {text-decoration: underline;}
4. Như bạn có thể mong đợi, điều này sẽ khiến văn bản được gạch dưới. Nếu ba từ cuối cùng trong câu trước được gạch dưới, thì xin chúc mừng-- trình duyệt của bạn hỗ trợ
H4 {text-decoration: underline;}
2. (Chà, dù sao thì cũng đã nhiều. ) Về mặt lịch sử, gạch chân hiếm khi được sử dụng trên Web, trừ khi bạn đếm gạch chân liên kết

Trước CSS1, cách duy nhất để thực hiện việc gạch chân là sử dụng thẻ gạch chân (

H4 {text-decoration: overlie;}
1), được hỗ trợ không thường xuyên bởi các trình duyệt Web chính và liên tục trôi dạt vào và ra khỏi đặc tả HTML. Kể từ HTML 4. 0, thẻ gạch chân không được dùng nữa, điều đó có nghĩa là nó sẽ bị loại bỏ hoàn toàn khỏi đặc điểm kỹ thuật. Tại sao?

Vì vậy, giả sử rằng chúng tôi có một bài báo trong đó chúng tôi muốn tất cả các tiêu đề cấp 4 được gạch chân. Tuyên bố là đủ đơn giản

H4 {text-decoration: underline;}

Đây là một H4 khác

Và bạn đã có nó-- tiêu đề cấp 4 được gạch chân

Có một bản sao để gạch chân, và đó là trên lót. Trong trường hợp này, một dòng được vẽ bên trên văn bản, thay vì bên dưới văn bản. Tại sao điều này được bao gồm trong đặc điểm kỹ thuật? . Ví dụ

H4 {text-decoration: overlie;}

Đây là H4

Được rồi, vì vậy có thể nó không phải là hiệu ứng đánh máy phổ biến nhất từ ​​trước đến nay, nhưng nó có thể hơi thú vị. Bạn có thể sử dụng nó theo cách tương tự như các quy tắc ngang, như một kiểu ngắt giữa các phần. Thú vị hơn nữa, bạn có thể sử dụng nó kết hợp với gạch chân, như thế này

H4 {text-decoration: underline overlie;}

Đây là một H4 khác

Điều này chứng tỏ một trong những điểm quan trọng nhất về

H4 {text-decoration: underline;}
2. thực tế là bạn có thể sử dụng bất kỳ hoặc tất cả các giá trị của nó trong bất kỳ sự kết hợp nào và liệt kê chúng theo bất kỳ thứ tự nào. Chà, được rồi, gần như tất cả các giá trị của nó. Nếu bạn sử dụng
H4 {text-decoration: underline;}
3, thì đó là giá trị duy nhất bạn có thể sử dụng. Nếu không, hãy sử dụng tất cả chúng nếu bạn muốn

Nói về điều này, chúng ta nên xem xét hai giá trị khác của

H4 {text-decoration: underline;}
2

Nháy mắt và bạn có thể tấn công

Người hâm mộ hoa tiêu vui mừng. thẻ nổi tiếng nhất do Netscape phát minh đã từng được đưa vào đặc tả CSS1. Đúng vậy, một trong những giá trị của

H4 {text-decoration: underline;}
2 là
H4 {text-decoration: overlie;}
6. Nó có tác dụng chính xác giống như thẻ
H4 {text-decoration: overlie;}
1, nghĩa là Internet Explorer không hỗ trợ giá trị này của
H4 {text-decoration: underline;}
2. Theo thông số kỹ thuật, không bắt buộc phải làm như vậy;

Do đó, chỉ các phiên bản nhận biết CSS1 của Netscape Navigator mới thấy hiệu ứng sau

H4 {text-decoration: blink;}

Đây có thể là một Blinkin' H4

Đáng yêu phải không?

Được rồi, điều này mang lại cho chúng tôi giá trị cuối cùng của

H4 {text-decoration: underline;}
2, đó là
H4 {text-decoration: underline overlie;}
0. Các thủ thư pháp lý ở khắp mọi nơi sẽ vui mừng với điều này, bởi vì nó cho phép hiệu ứng gạch ngang rất được các nhà lập pháp ở khắp mọi nơi yêu thích. Đối với những người không quen thuộc với gạch ngang, chỉ cần vẽ một đường thẳng qua giữa văn bản, như thế này

________số 8

Đây là một H4 bị ảnh hưởng

Các nhà lập pháp sử dụng điều này để hiển thị nơi luật đã được sửa đổi, in các phần được thay thế của luật bằng một đường gạch ngang như bạn thấy ở trên. Hầu hết các bạn có thể sẽ không cần sử dụng hiệu ứng này, có lẽ ngoại trừ khi viết những mẩu hài hước

Sử dụng đồ trang trí trong thiết kế trang

Như chúng ta đã thấy, bạn có thể sử dụng gạch dưới để nhấn mạnh những thứ như cấp độ tiêu đề nhất định. Bạn cũng có thể quyết định rằng văn bản được nhấn mạnh sẽ được gạch dưới, ngoài bất kỳ tác dụng nào khác mà nó có trên một trình duyệt nhất định. Vì vậy, bạn có thể thử điều này

EM {text-decoration: underline;}

Quy tắc trên sẽ nhấn mạnh thêm thẻ

H4 {text-decoration: overlie;}
1

Một cách khác để sử dụng

H4 {text-decoration: underline;}
2 là tác động đến cách hiển thị các điểm neo. Như bạn có thể biết, hầu hết mọi người đều cài đặt trình duyệt của mình để gạch dưới tất cả các siêu liên kết, nhưng những người khác thì không. Thực sự không có cách nào để làm bất cứ điều gì về điều này trước CSS1. Tuy nhiên, bây giờ, ít nhất bạn có thể cố gắng áp đặt thẩm mỹ siêu liên kết cụ thể của mình lên người đọc, có lẽ như thế này

H4 {text-decoration: underline;}
1

Quy tắc trên sẽ có tác dụng tắt gạch chân liên kết trong các trình duyệt nhận biết CSS1. Ngược lại, khai báo giá trị

H4 {text-decoration: underline;}
4 sẽ bật gạch dưới liên kết, ngay cả đối với những người đã tắt nó trong tùy chọn trình duyệt của họ. Về việc liệu một trong hai điều này có phải là một ý tưởng hay hay không là một vấn đề tranh luận sôi nổi. Như thường lệ, bạn có quyền quyết định xem việc sử dụng các biểu định kiểu nhất định có phải là một ý tưởng hay hay không

Phần kết luận

Như chúng ta đã thấy,

H4 {text-decoration: underline;}
2 có thể được sử dụng để cải thiện văn bản của bạn một chút. Tất nhiên, có nhiều cách khác để xoay quanh sự xuất hiện của văn bản, và tôi hy vọng sẽ thảo luận về những cách đó trong một (hoặc ba) bài viết trong tương lai. Tuy nhiên, lần tới, tôi sẽ xem xét màu sắc theo cách CSS1, vì vậy hãy tham gia cùng tôi

Làm cách nào để sử dụng gạch dưới trong CSS?

Nội dung được gạch chân bằng thuộc tính text-decoration-line. .
text-decoration-line (bắt buộc)
văn bản-trang trí-màu sắc
văn bản-trang trí-phong cách
văn bản-trang trí-độ dày

Thuộc tính CSS nào có thể được sử dụng để tạo văn bản được gạch chân?

Thuộc tính text-decoration thêm gạch dưới, gạch trên, xuống dòng hoặc tổ hợp các dòng vào văn bản đã chọn.

Thẻ gạch chân trong CSS là gì?

. Phần tử Chú thích không rõ ràng (Gạch chân). Phần tử HTML