Home / Kiến thức / HTML/CSS / Before và After trong css

Before và After trong css

“:before” thêm nội dung ngay phía trước thành phần.

“:after” thêm nội dung ngay phía sau thành phần.

Ví dụ:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">
<html><head>
</head>
<body>
<p>Chia sẻ kiến thức</p>
</div>
</body>
</html>

Hiển thị khi chưa có CSS

Chia sẻ kiến thức

CSS Viết:
p:before {
    content: "Quốcbb - ";
}

Hiển thị khi đã có CSS:
Quốcbb - Chia sẻ kiến thức

p:after{
    content: " - Quốcbb";
}

Hiển thị khi đã có CSS:
Chia sẻ kiến thức - Quốcbb

About quocbb

Chào bạn đến với blog của Quocbb.com. Blog mình làm đơn giản chỉ để lưu lại những kiến thức đã học được và muốn cùng chia sẻ với cho mọi người. Mình thích chơi Bida, đánh Cờ tướng, WarCraft, nếu bạn có chung sở thích hãy để lại comment nhé

Leave a Reply

Your email address will not be published. Required fields are marked *

Ngẫu nhiên

Khắc phục lỗi Font chữ khi share link lên Google Plus

Mấy hôm nay không biết Google Plus dở chứng gì mà khi share link lên ...