Chiều dài gạch chân trang trí văn bản css
|
Nếu bạn không gạch chân các liên kết của mình, bạn nên. Có một số cách để gạch chân các liên kết; . Sử dụng đường viền, bạn có thể chỉ định độ dày, kiểu dáng và màu sắc, nhưng bạn có biết giờ đây bạn có thể làm điều đó với Show
Mặc dù vậy, tại sao phải bận tâm, nếu nó đã hoạt động với chúng tôi với các đường viền? Không chỉ vậy, các trình duyệt giờ đây còn phát hiện các phần tử xuống và phần gạch chân Vậy làm cách nào để chúng tôi có được sự tinh tế về hình ảnh đó với Gạch chân, gạch đầu dòngChúng ta đang nói về gạch chân ở đây, nhưng đáng để mở đầu điều này bằng một tiếp tuyến nhanh.
Phần gạch dưới trông như thế nàoQuay lại phần gạch chân. Giờ đây, chúng tôi có quyền kiểm soát hình thức của chúng, thông qua
Chúng trông giống như bạn mong đợi, với một đường đôi, đường lượn sóng, v.v. Chỉ cần thêm khai báo Màu gạch chânCái này hay đấy. Chỉ cần đảm bảo rằng phần gạch chân vượt qua tỷ lệ tương phản màu mà bạn đang hướng tới Làm dày lên những gạch dướiCuối cùng, chúng ta có thể kiểm soát độ dày của gạch chân với kết hợpTất nhiên, chúng ta có thể làm nhiều việc cùng một lúc Hoặc chúng ta có thể sử dụng tốc kýĐiều đó biến thành rất nhiều CSS. May mắn thay, như lề, phần đệm, bán kính đường viền và vô số thuộc tính CSS khác, Lưu ý rằng tôi chưa thêm thuộc tính Một cải tiến tiến bộKiểu gạch chân được hỗ trợ tốt trên tất cả các trình duyệt hiện đại. Các phiên bản cũ hơn (và Internet Explorer 11 trở xuống, tất nhiên) sẽ có phần gạch dưới tiêu chuẩn không có thật nhưng vẫn rất thân thiện với người dùng, miễn là không có gì giống như thế này trong thiết lập lại CSS của bạn Nhưng hãy nhớ rằng, hỗ trợ trình duyệt cho các thay đổi tùy thuộc vào
Tiền tố cần thiết cho tốc kýNếu đang sử dụng tốc ký, bạn sẽ cần tiền tố của nhà cung cấp cho Safari để thực hiện đặt giá thầu của mình Đủ dễ thực hiện nếu bạn đang tự động hóa mọi thứ bằng Autoprefixer và không phải làm thêm quá nhiều nếu bạn đang viết bằng tay. Một lần nữa, các trình duyệt không hỗ trợ tốc ký text-decoration: underline;text-decoration-style: wavy;08 không được hỗ trợ tốt như những cái khácTrình duyệt hỗ trợ cho Hơn nữa, Firefox hiện là trình duyệt duy nhất hỗ trợ độ dày trong tốc ký, vì vậy nếu bạn muốn sử dụng độ dày trong tốc ký của mình, bạn sẽ cần thực hiện khai báo kép cổ điển để các trình duyệt khác nhận được giá trị mà họ hiểu text-decoration: underline;text-decoration-style: wavy;08 và tỷ lệ phần trăm không hoạt động tốtNgoài ra, hãy cẩn thận khi sử dụng các giá trị phần trăm cho độ dày, vì chỉ có Firefox mới hỗ trợ chúng Tin tốt là các giá trị phần trăm được tính theo tỷ lệ phần trăm của 1em, vì vậy, Luôn có các pixel ( text-decoration: underline;text-decoration-style: wavy;08 lộn xộnHãy cẩn thận khi ghép nối cân nhắc khả năng sử dụngNhư với hầu hết CSS, hãy nhớ. sức mạnh lớn đi kèm với trách nhiệm lớn và từ quan điểm khả năng sử dụng, tôi sẽ cảnh giác khi sử dụng bất kỳ thứ gì khác ngoài phần gạch chân vững chắc để tạo kiểu cho liên kết Vì vậy, bạn có thể ổn nếu bạn theo đuổi
Nhưng hãy cẩn thận với mọi thứ khác
Tuy nhiên, nơi tôi nghĩ rằng tôi sẽ làm gìTốc ký đi kèm với tiền tố của nhà cung cấp và khai báo kép tinh ranh, vì vậy tôi sẽ bắt đầu với |
