Cascading Style Sheets, hay còn gọi tắt là CSS, là những file hỗ trợ cho trình duyệt Web trong việc hiển thị một trang HTML. Về cơ bản, các trang HTML như bộ xương – khuôn khổ cơ bản – của một trang web – trong khi các file CSS sẽ cụ thể hóa các thành phần của một trang nên được hiển thị như thế nào. CSS cho phép bạn kiểm soát phông chữ, màu chữ, kiểu nền…, của một trang HTML.
CSS3 làm cho việc thiết kế và xây dựng một trang Web trở nên dễ dàng hơn. Trước khi có CSS3, bạn phải sử dụng HTML để thực hiện tất cả các tiêu đề cũng như các thành phần của một trang Web. Mặc dù đã có một số cách khác nhưng HTML vẫn thường xuyên được sử dụng và các nhà thiết kế Web sẽ phải thay đổi từng thành phần riêng lẻ trên mỗi trang. CSS3 đã giúp cho việc thay đổi phong cách của một trang Web đơn giản hơn và đỡ tốn thời gian hơn, bạn có thể thực hiện sự thay đổi trên một mục nào đó và sau đó apply sự thay đổi này trên toàn bộ trang Web thay vì phải thực hiện trên từng mục riêng lẻ như trước đây.
-CSS3 là chương trình mới nhất cho việc thiết kế Web,nó làm cho các ứng dụng Web và các trang Web hấp dẫn hơn. Ví dụ như nhiều màu sắc hơn và hỗ trợ đường cong, việc làm mờ, góc tròn (thay vì ép buộc các nhà thiết kế web sử dụng các hình ảnh để tạo ra các góc tròn), và dĩ nhiên là cả việc lưu trữ offline. Tất cả những điều này là một trang Web trở nên dễ nhìn hơn, bắt mắt hơn và làm cho mọi thứ trở nên sát với những gì mà nhà thiết kế tưởng tượng trong đầu hơn.CSS3 – được kết hợp với các công nghệ Web khác như JavaScript – có thể rất hữu ích cho phong cách, định dạng và tốc độ hoạt động của bất kỳ trang web nếu được sử dụng đúng. Hai ngôn ngữ sẽ cách mạng hóa cách chúng ta lập trình và xem internet với các tính năng cải tiến all-in-one, có thể loại bỏ việc phải sử dụng nhiều ứng dụng của bên thứ ba (ví dụ như Flash).
-CSS3 cung cấp rất nhiều cách thức mới để tạo ra những hiệu ứng khác nhau cho thiết kế của bạn, với một vài thay đổi quan trọng. Hướng dẫn đầu tiên này sẽ cho bạn một giới thiệu cơ bản.
+ Mô-đun: CSS3 được chia thành “mô-đun. Đặc điểm kỹ cũ đơn giản là quá lớn và phức tạp để cập nhật, do đó nó đã được chia nhỏ hơn – và có một số thành phần mới được thêm vào. Một số các mô-đun:
- The Box Model
- Lists Module
- Hyperlink Presentation
- Speech Module
- Backgrounds and Borders
- Text Effects
- Multi-Column Layout
+ Đường viền (border): Chức năng border, là một cách tuyệt vời để tại cấu trúc cho nội dung, tạo hiệu ứng xung quanh hình ảnh hoặc tạo ra những layout chuyên nghiệp
+ Tạo hiệu ứng cho văn bản:
Text Shadow
Bóng dành cho văn bản nghe như một hiệu ứng rườm rà, nhưng tất cả phụ thuộc vào cách chúng được sử dụng. Đổ bóng chắc chắn có thể được đưa vào sử dụng tốt trong đầu đề và tiêu đề
VD:
|
+ Giao diện người dùng: Thay đổi kích thước (Resizing)
Phiên bản cuối cùng của Safari có một tính tính năng cho phép thay đổi kích thức của vùng chứa text (text areas). Nó là tính năng rất tốt và được sử dụng hàng ngày. CSS3 cho phép bạn có thể dễ dàng sử dụng với những thành phần khác.
1 2 3 4 5 6 |
.ui_resizable { padding: 20px; border: 1px solid; resize: both; overflow: auto; }
|
+ Hình nền: kích thước hình nền
Với CSS3 phiên bản trước, kích thước nền được xác định bởi kích thước thực của hình ảnh được sử dụng. Với phiên bản hiện tại, người thiết kế có thể định phần trăm hoặc pixel cho kích thước nền (background).
1 2 3 4 5 6 7 8 9 10 |
.backgroundsize { background: url(http://www.designshack.co.uk/images/logo.gif); -webkit-background-size: 137px 50px; -khtml-background-size: 137px 50px; -o-background-size: 137px 50px; background-size: 137px 50px; background-repeat: no-repeat; padding: 60px 5px 5px 10px; border: 3px solid #ddccb5; }
|
ZALO