Bài 5: Cách đưa css vào trang
Nội dung bài viết
Cách đưa css vào trang
Bạn có thể đưa CSS vào trang web của mình bằng cách sử dụng một trong hai phương pháp sau:
1. Sử dụng thẻ <style>: Bạn có thể đặt các quy tắc CSS trực tiếp trong tài liệu HTML bằng cách sử dụng thẻ <style>. Đặt thẻ <style> giữa thẻ <head> và </head> của tài liệu HTML và sau đó đặt các quy tắc CSS trong đó.
Ví dụ:
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: yellow;
}
h1 {
color: blue;
text-align: center;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>2. Sử dụng tệp CSS bên ngoài: Bạn có thể tạo một tệp CSS riêng biệt và liên kết nó với tài liệu HTML bằng cách sử dụng thẻ <link>. Trong tài liệu HTML, đặt thẻ <link> giữa thẻ <head> và </head> và chỉ định đường dẫn đến tệp CSS của bạn bằng thuộc tính href.
Ví dụ:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>Trong tệp CSS của bạn (ví dụ: style.css), bạn có thể viết các quy tắc CSS như bình thường.
Ví dụ:
body {
background-color: yellow;
}
h1 {
color: blue;
text-align: center;
}Lưu ý rằng nếu bạn muốn sử dụng cả hai phương pháp, thì các quy tắc CSS trong thẻ <style> của tài liệu HTML sẽ được ưu tiên hơn so với các quy tắc trong tệp CSS bên ngoài.
