CSS3 là gì?

Xin chào các bạn ở bài viết trước chúng ta đã cùng với nhau tìm hiểu CSS. Hôm nay chúng ta sẽ bắt tay tìm hiểu xem CSS3 là gì? tính năng mới của nó sẽ ra sao.

CSS3 là gì?

CSS3 là phiên bản nâng cấp  mới nhất của thuộc tính CSS. Nó là thành phần hỗ trợ làm nền cho website 1 cách toàn diện nhất. CSS3 ko cần sử dụng đến sự bổ trợ của các yếu tố bên ngoài như Javascript, Jquery, Flash…

CSS3 hoàn toàn kế thừa các tính năng và thuộc tính của những phiên bản CSS trước đó. Đồng thời phát triển thêm nhiều những tính năng và thuộc tính mới. Nó giúp việc định dạng trang web tốt hơn, chuyên nghiệp hơn.

Sự thay đổi giữa CSS và CSS3

Thay đổi lớn nhất hiện đang được lên kế hoạch cho CSS cấp 3 là việc giới thiệu các mô-đun. Ưu điểm của các mô-đun là nó cho phép đặc tả được hoàn thành. Nó phê duyệt nhanh hơn vì các phân đoạn sẽ được hoàn thành và được phê duyệt theo từng khối. Điều này cũng cho phép các nhà sản xuất trình duyệt và tác nhân người dùng hỗ trợ các phần của đặc tả nhưng giữ cho mã của họ phình to ở mức tối thiểu bằng cách chỉ hỗ trợ các mô-đun có ý nghĩa. Ví dụ, một trình đọc văn bản sẽ không cần bao gồm các mô-đun chỉ xác định cách một phần tử sẽ hiển thị trực quan. Nhưng ngay cả khi nó chỉ bao gồm các mô-đun âm thanh, nó vẫn sẽ là một công cụ CSS 3 tuân thủ tiêu chuẩn.

Tính năng mới của CSS3

Selectors(bộ trọn): Các bộ chọn trong CSS3 khá đặc biệt. Nó cho phép nhà thiết kế nhà thiết kế/nhà phát truyển lựa trọn cấp độ cụ thể hơn của tài liệu. Một trong những điều thú vị hơn về mô-đun này là nhiều trình duyệt đã bắt đầu hỗ trợ các bộ chọn CSS 3 nâng cao. Vì vậy bạn có thể bắt đầu dùng thử ngay bây giờ.

Hiệu ứng văn bản và bố cục: Thay đổi dấu gạch nối, khoảng trắng và chứng minh văn bản trong tài liệu.

Paged Media and Generated Content: CSS 3 bây giờ sẽ hỗ trợ nhiều tùy chọn hơn trong phương tiện phân trang. Chẳng hạn như chạy tiêu đề và chân trang và số trang. Ngoài ra, sẽ có các thuộc tính nâng cao để in nội dung được tạo, bao gồm các thuộc tính cho chú thích và tham chiếu chéo.

Bố cục nhiều cột: Hiện tại, dự thảo làm việc bố trí nhiều cột cung cấp  thuộc tính. Nó cho phép các nhà thiết kế hiển thị nội dung của họ trong nhiều cột. Cụ thể với các định nghĩa như khoảng cách cột, đếm cột và chiều rộng cột.

Chú thích: CSS bây giờ sẽ hỗ trợ khả năng thêm các chú thích nhỏ trên đầu hoặc bên cạnh các từ. Và thường được sử dụng nhất trong tiếng Trung và tiếng Nhật. Chúng thường được sử dụng để đưa ra cách phát âm hoặc ý nghĩa của các chữ tượng hình khó.

Ví dụ:

Sau đây sẽ là ví dụ về 1 đoạn CSS3 để các bạn có thể hiểu hơn về nó.

Mã html:

<div class="multiple-backgrounds">
	<p></p>
	<p>This block has content</p>
</div>

Thuộc tính CSS3:

p{
	background: green;
	padding: 15px;
	color: red;
}
p:empty{
	display: none;
}

HIển thị:

Hiển thị trương trình

Hiển thị trương trình

Ta có thể thấy thẻ <p> không có nội dung đã bị ẩn khỏi cấu trúc HTML bằng thuộc tính CSS display: none;

Lời kết

Ở trên mình đã cùng với các bạn tìm hiểu về CSS3 cùng với 1 số tính năng mới nổi bật của nó.Bài viết của mình xin được phép kết thúc mong sẽ được đồng hành cùng các bạn trong các bài viết tới. Chúc các bạn học tốt.

Bạn cũng có thể xem thêm các bài viết hay tại đây.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *