Thứ Năm, 26 tháng 12, 2013
CSS Liên kết
Liên kết tạo kiểu tóc
Liên kết có thể được theo kiểu với bất kỳ tài sản (ví dụ như màu sắc, font-family, nền, vv) CSS.
Ngoài ra, các liên kết có thể được theo kiểu khác nhau tùy thuộc vào những gì nhà nước họ đang in
Bốn liên kết các quốc gia là:
- một: Liên kết - một liên kết ghé thăm thường xuyên bình thường
- a: visited - một liên kết người dùng đã truy cập
- a: hover - một liên kết khi người sử dụng chuột trên nó
- a: active - một liên kết thời điểm này nó được nhấp
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
</style>
</head>
<body>
<p><b><a href="default.asp" target="_blank">This is a link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order
to be effective.</p>
</body>
</html>
Thử nó cho mình »
Khi thiết lập phong cách cho một số tiểu bang liên kết, có một số quy định theo thứ tự:
- a: hover phải đến sau khi một: liên kết và a: visited
- a: hoạt động phải đến sau khi một: hover
Styles Liên kết chung
Trong ví dụ trên các thay đổi màu sắc liên kết phụ thuộc vào những gì nhà nước nó được in
Cho phép đi qua một số trong những cách phổ biến khác để liên kết hình:
Trang trí văn bản
Tài sản trang trí văn bản chủ yếu được sử dụng để loại bỏ gạch dưới từ các liên kết:
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
a:link {text-decoration:none;} /* unvisited link */
a:visited {text-decoration:none;} /* visited link */
a:hover {text-decoration:underline;} /* mouse over link */
a:active {text-decoration:underline;} /* selected link */
</style>
</head>
<body>
<p><b><a href="default.asp" target="_blank">This is a link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order
to be effective.</p>
</body>
</html>
Thử nó cho mình »
Màu nền
Tài sản background-color chỉ định màu nền cho các liên kết:
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
a:link {background-color:#B2FF99;} /* unvisited link */
a:visited {background-color:#FFFF85;} /* visited link */
a:hover {background-color:#FF704D;} /* mouse over link */
a:active {background-color:#FF704D;} /* selected link */
</style>
</head>
<body>
<p><b><a href="default.asp" target="_blank">This is a link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order
to be effective.</p>
</body>
</html>
Thử nó cho mình »
Đăng ký:
Đăng Nhận xét (Atom)
Không có nhận xét nào:
Đăng nhận xét