1. Khái niệm CSS
CSS (Cascading Style Sheets) là ngôn ngữ dùng hỗ trợ định kiểu cùng lúc nhiều phần tử HTML của một hoặc nhiều trang web, giúp mô tả bố cục, màu sắc, phông chữ và các khía cạnh trực quan khác của trang web.
Kiểm soát vị trí, kích thước, khoảng trống của các thành phần giúp đáp ứng những yêu cầu phức tạp về bố cục.
Tạo ra các hiệu ứng như đổ bóng, màu chuyển sắc, các hiệu ứng hoạt hình và chuyển cảnh sinh động.
HTML hướng đến việc định hình nội dung và cấu trúc, còn CSS tập trung vào việc trình bày bố cục và hình thức của các thành phần trong trang web.
a) Linh hoạt về bố cục
Thực hiện được nhiều yêu cầu phức tạp về bố cục, hình thức lẫn hiệu ứng của trang web.
Giúp trang web thay đổi bố cục để tương thích với các kích thước màn hình khác nhau.
b) Nhất quán về hình thức
Đảm bảo hình thức nhất quán cho các trang web trong cùng một website. Ví dụ, định kiểu chung cho phần tử <h1> thì toàn bộ <h1> ở các trang web đều được định kiểu đồng nhất.
c) Dễ bảo trì và nâng cấp
Chia tách việc xây dựng nội dung và hình thức của trang web làm cho trang web trở nên dễ bảo trì và nâng cấp. Ví dụ, khi muốn thay đổi hình thức của trang web, chỉ cần điều chỉnh các mã lệnh CSS.
d) Có thể tái sử dụng
Việc định kiểu bằng mã lệnh CSS giúp đem lại khả năng tái sử dụng cho những thành phần khác của cùng trang web hoặc các trang web khác nhau.
@204327750957@@204327824183@@202869108553@
2. Các cách bổ sung mã lệnh CSS vào trang web
Có ba cách chèn mã CSS vào trang web HTML, bao gồm:
Cách 1. Chèn trực tiếp vào thẻ mở của phần tử HTML.
<tên_thẻ_HTML style="thuộc_tính_CSS: giá trị; thuộc_tính_CSS: giá trị;....">
Cách 2. Chèn cặp thẻ <style></style> kèm mã lệnh CSS vào giữa cặp thẻ <head></head>. Phần mã lệnh được viết theo cú pháp:
tên_kiểu {thuộc_tính_CSS: giá_trị; thuộc_tính_CSS: giá_trị;...}
Cách 3. Tạo mã lệnh CSS riêng biệt và chèn vào trang web một liên kết đến tệp CSS bằng thẻ <link> theo cú pháp:
<link rel="stylesheet" type="text/css" href="đường dẫn tệp CSS">
❗Lưu ý: Nếu phần tử HTML được định kiểu theo nhiều cách thì thứ tự trình duyệt ưu tiên áp dụng là: Cách 1, Cách 2, Cách 3.
@202869084139@@202869110180@
