Thuộc tính quotes trong CSS
Thuộc tính quotes trong CSS giúp bạn xác định cách thức trích dẫn nội dung của phần tử.
Thuộc tính quotes có thể nhận giá trị:
<string><string>: một cặp giá trị chuỗi được sử dụng để biểu diễn các dấu trích dẫn mở và đóng.
none: hiển thị nội dung phần tử mà không kèm theo trích dẫn.
Thuộc tính quotes có thể áp dụng cho:
Tất cả các phần tử HTML.
Ví dụ thuộc tính quotes trong CSS
Tiếp theo là ví dụ minh họa cách sử dụng của thuộc tính quotes trong CSS:
<html>
<head>
<style type="text/css">
q {
quotes: "<<" ">>" "<" ">";
}
</style>
</head>
<body>
<p><q>Hoc CSS co ban tai VietJack</q></p>
<p><q>Vi du thuoc tinh <q>quotes</q> trong CSS.</q></p>
</body>
</html>
Kết quả là:
Trong một tài liệu mà cần chỉ rõ sự khác nhau này, bạn có thể sử dụng :lang Pseudo Class để thay đổi các ký hiệu trích dẫn cho phù hợp. Ví dụ sau thay đổi thẻ <blockquote> một cách phù hợp cho ngôn ngữ đang được sử dụng:
<html>
<head>
<style type="text/css">
/* Hai cach trich dan khac nhau cho tung loai ngon ngu */
:lang(en) { quotes: '"' '"' "'" "'"; }
:lang(fr) { quotes: "<<" ">>" "<" ">"; }
</style>
</head>
<body>
<p>...<q lang="fr">Vi du mot doan van duoc trich dan</q>...</p>
</body>
</html>
:lang Selector này sẽ áp dụng cho tất cả phần tử trong tài liệu. Tuy nhiên, không phải tất cả phần tử đều sử dụng thuộc tính quotes, do đó hiệu ứng của thuộc tính này sẽ là vô hiệu cho hầu hết các phần tử.
Kết quả là:
Công cụ giáo viên (2048.VN)
Tạo- trộn đề thi miễn phí từ file PDF, Word, Giao bài nhanh chóng, Hoàn toàn Free
Bài học CSS phổ biến khác tại vietjack.com:
Dành cho bạn
Công cụ giáo viên
- Tạo đề online từ PDF / Word
- Trộn nhiều mã đề, in Offline
- Giao bài online, Quản lí lớp học
