Cách chèn mã html với lệnh css
<p>Xin chào</a>
<style>
p:after {
content: "-X-";
}
p:before { content: "-Y-" }
</style>
Sau khi chạy bạn xem kết quả ? cho nhận xét vì sao thẻ p lại chèn thêm html -X- và -Y-
Ví dụ 2 css chèn html:
<!DOCTYPE html>
<html>
<head>
<title>Tiêu đề trang web</title>
</head>
<body>
<h1>XIN CHÀO tôi là iif</h1>
<p>Là trang web chuyên dạy học lập trình</p>
</body>
</html>
<style>
body:after {
content: "Cuối trang";
display: block;
margin-top: 2em;
text-align: center;
}
p:after {
content: "Xin chào tôi là iif";
display: block;
margin-top: 2em;
text-align: center;
}
</style>
Hãy chạy và xem kết quả
Tóm lại:
Cú pháp để chèn lệnh
tên_thẻ:after / before {
content: "..";
lệnh css;
}
Cách chèn mã html với lệnh css