Theo mặc định, tất cả các liên kết trong HTML đều được trang trí bằng một gạch dưới. Chúng tôi có thể xóa gạch chân này bằng cách sử dụng thuộc tính trang trí văn bản CSS.
Cú pháp
Cú pháp của thuộc tính trang trí văn bản CSS như sau -
Selector {
text-decoration: /*value*/
} Ví dụ
Các ví dụ sau minh họa thuộc tính trang trí văn bản CSS.
<!DOCTYPE html>
<html>
<head>
<style>
p {
padding: 5px;
box-shadow: inset 0 0 5px violet;
}
a {
font-style: italic;
text-decoration: none;
}
</style>
</head>
<body>
<a href="#">Demo</a>
<p>
<a href="https://example.com/">Example domain</a>
</p>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: auto;
width: 50%;
text-align: right;
color: green;
border: thin dashed red;
}
a {
text-decoration: none;
}
a:last-child {
color: inherit;
background-color: moccasin;
}
</style>
</head>
<body>
<div>
<a href="#">Link Demo</a>
<p>
Watch this: <a href="https://example.com/">Example site</a>
</p>
</div>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
