Bảng cheat css2 vs css3

Cascading Stylesheet (CSS) về cơ bản là một ngôn ngữ biểu định kiểu được sử dụng để triển khai giao diện và định dạng của tài liệu được phát triển bằng ngôn ngữ đánh dấu. Đặc tả CSS chủ yếu được duy trì bởi World Wide Web Consortium (W3C). Động cơ chính để triển khai CSS là thể hiện sự tách biệt giữa bản trình bày và nội dung bao gồm mặt trước, định dạng bố cục. CSS3 là phiên bản mới nhất hoặc tiêu chuẩn cho CSS sau CSS2. CSS3 chủ yếu là sự kết hợp của các thông số kỹ thuật CSS2 và một số chức năng mới

Gói phát triển phần mềm tất cả trong một(hơn 600 khóa học, hơn 50 dự án)

Giá
Xem khóa học

600+ Khóa học trực tuyến. hơn 50 dự án. Hơn 3000 giờ. Giấy chứng nhận có thể kiểm chứng. Truy cập Trọn đời
4. 6 (83.083 xếp hạng)

Các module quan trọng của Cheat Sheet CSS3

Bắt đầu khóa học phát triển phần mềm miễn phí của bạn

Phát triển web, ngôn ngữ lập trình, kiểm thử phần mềm và những thứ khác

1. Mô hình hộp
2. Bộ chọn
3. Hiệu ứng văn bản
4. Chuyển đổi 2D
5. Chuyển đổi 3D
6. Hình ảnh đại diện
7. Giao diện người dùng
8. Bố cục nhiều cột
9. Ảnh động
10. Điều chỉnh nội dung và phân bổ lại

Trong bài viết Cheatsheet CSS3 này, chúng ta sẽ thảo luận về CSS3 là gì và các lệnh CSS3 khác nhau

Các lệnh và nội dung trên Cheat Sheet CSS3

CSS3 có một thư viện phong phú, tương tác, có thể mở rộng và chứa nhiều phương thức sẵn có để tính toán các hoạt động phổ biến. Dưới đây là các lệnh Cheatsheet CSS3 được đề cập để thực hiện các thao tác dòng lệnh khác nhau

YÊU CẦU

SỰ MÔ TẢ

focusTập trung vào một phần tử. activeĐể hiển thị và chọn một phần tử đang hoạt động. enableĐể hiển thị một phần tử được kích hoạt. đã kiểm tra Để hiển thị một phần tử được kiểm tra. langĐể cho phép nhà phát triển chỉ định ngôn ngữ cho một phần tử cụ thể. lựa chọnĐể hiển thị phần tử được đánh dấu và chọn. rootĐể hiển thị phần tử gốc trong tài liệu. con đầu lòng Để hiển thị phần tử anh chị em đầu tiên. con cuối Để hiển thị phần tử anh chị em cuối cùng. only-child Để hiển thị phần tử con duy nhất. first-of-type Để hiển thị phần tử anh chị em đầu tiên của một loại cụ thể. last-of-type Để hiển thị phần tử anh chị em cuối cùng của một loại cụ thể. only-of-type Để hiển thị phần tử anh chị em duy nhất của một loại cụ thể. emptyĐể hiển thị phần tử không có phần tử con. chữ cái đầu tiênĐể thêm một kiểu cụ thể vào chữ cái đầu tiên của văn bản. dòng đầu tiênĐể thêm một kiểu cụ thể vào dòng đầu tiên của văn bản. afterĐể chèn một số nội dung sau phần tử văn bản. beforeĐể chèn một số nội dung trước một phần tử văn bản

nhà điều hành. Các loại toán tử khác nhau trong CSS3 là Toán tử so sánh (quan hệ), Toán tử gán, Toán tử logic và Toán tử nhận dạng

Cân đo lường. Thang đo CSS3 cheat sheet khác nhau như sau

QUY MÔ / THÔNG SỐ

SỰ MÔ TẢ

emKích thước phông chữ của phần tử hiện tạiexChiều cao phông chữ của phần tửpxThiết bị xem pixelremKích thước phông chữ phần tử gốcChiều cao của chế độ xemwChiều rộng của cổng xem%PercentagepcPicaptPoint

Mã màu. Tên màu = đỏ, xanh lam, xanh lục và xanh đậm. Tìm bên dưới các mã cho cùng

MÃ SỐ

MÔ TẢ / Ý NGHĨA

rgb(x,y,z)For red = rgb(255,0,0)rgb(x%,y%,z%)For red = rgb(100%,0,0)#rrggbbFor red = #ff000flaborMàu do người dùng chọn

Thuộc tính giao diện người dùng. Các thuộc tính giao diện người dùng CSS3 Cheat sheet như sau

GIÁ TRỊ TÀI SẢN

SỰ MÔ TẢ

biểu tượngĐể cung cấp biểu tượng trên kích thước khu vựcĐổi kích thước các phần tử khu vực đã chỉ địnhkích thước hộpĐể sửa khu vực phần tử đã chỉ địnhxuất hiệnĐể triển khai các phần tử dưới dạng phần tử giao diện người dùngđiều hướng xuốngĐể di chuyển xuống các phần tử theo nút mũi tên xuống trên bàn phímnav-leftDi chuyển các phần tử sang trái theo nút mũi tên trái trên bàn phímđiều hướng

Các loại bộ chọn. Các loại bộ chọn Cheat Sheet CSS3 như sau

TÊN LOẠI

MÔ TẢ / Ý NGHĨA

UniversalĐể hiển thị bất kỳ phần tử nàoTypeĐể hiển thị bất kỳ phần tử loại cụ thể nàoLớpĐể hiển thị nhiều phần tử thuộc các loại khác nhauIdĐể hiển thị và xác định một loại phần tử cụ thể duy nhất mà không ảnh hưởng đến phần tử khácChildĐể hiển thị một phần tử trực tiếp thuộc phần tử khácNhóm để xác định nhiều phần tử thuộc các loại khác nhauAnh chị em liền kềĐể tìm nạp tất cả các phần tử có cùng cha mẹ

Mẹo và thủ thuật miễn phí khi sử dụng các lệnh CSS3 Cheat Sheet

Dưới đây được đề cập một số mẹo và thủ thuật

1. Chế độ hòa trộn CSS3 có thể được sử dụng để thống nhất giao diện của nội dung được chỉ định và nó cũng cho phép người dùng đặt các phiên bản màu hình ảnh khác nhau. Có khoảng 15 giá trị chế độ hòa trộn có trong CSS3 Cheat Sheet. Nó cũng bổ sung thêm một lợi thế từ góc độ biểu diễn giao diện người dùng
2. Clipping là một tính năng tuyệt vời khác của CSS. Sử dụng chức năng cắt, người dùng có thể xác định mức độ hiển thị của vùng hình ảnh theo yêu cầu. Vì vậy, nếu bất kỳ phần hình ảnh nào nằm ngoài vùng mong muốn thì có thể thực hiện cắt bớt để ẩn vùng hình ảnh thừa đó
3. Trong trường hợp CSS, các thuộc tính shape-inside và shape-outside có thể được triển khai để bọc nội dung xung quanh đường dẫn tùy chỉnh CSS và nó có thể được xác định và phân bổ theo yêu cầu của người dùng cuối. Về cơ bản, nó cho phép người dùng thiết kế xen kẽ theo các thông số kỹ thuật đã xác định
4. Việc sử dụng hoạt hình SVG (đồ họa vector có thể mở rộng) là một lợi thế khác của CSS3. Sử dụng SVG với CSS3 animation, interphase sẽ trở nên tương tác hơn và SVG cũng có DOM API riêng
5. Chức năng bản đồ sẽ được áp dụng cho tất cả các mục trong danh sách đầu vào
6. Hàm rút gọn được sử dụng để áp dụng một số tính toán trên danh sách và trả về một giá trị
7. Hiệu ứng di chuột có thể được triển khai bằng CSS3 Cheat Sheet
8. Một menu gooey có thể được triển khai bằng cách sử dụng các bộ lọc CSS3 và SVG và điều này hỗ trợ một cách tiếp cận đại diện mới từ góc độ xen kẽ của người dùng
9. Từ góc độ thiết kế web, hiệu ứng thị sai có thể được tạo bằng CSS3
10. Cấu trúc 3d tương tác và xen kẽ người dùng có thể được tạo bằng CSS3
11. Sử dụng các kết hợp bộ chọn khác nhau, biểu tượng định dạng tệp bên cạnh liên kết tải xuống có thể được tạo bằng CSS3

Sự kết luận

Trong bài viết Cheat Sheet CSS3 này, chúng ta đã thấy CSS3 dễ sử dụng và cú pháp của nó dễ nhớ hơn. CSS3 có thể được sử dụng để thể hiện các công nghệ phát triển web bằng cách sử dụng các cách tiếp cận và công nghệ biểu định kiểu khác nhau hỗ trợ CSS3. Dựa trên loại nhu cầu của dự án, thời gian làm việc và trên tất cả các khía cạnh được thảo luận khác nhau, CSS3 nên được sử dụng để đạt được mục tiêu mong muốn

Bài viết được đề xuất

Đây là hướng dẫn về Cheat Sheet CSS3. Ở đây chúng ta đã thảo luận về các mô-đun quan trọng của CSS3, các lệnh và nội dung cùng với các mẹo và thủ thuật sử dụng Cheat Sheet CSS3. Bạn cũng có thể xem bài viết sau để tìm hiểu thêm –

Sự khác biệt giữa CSS2 và CSS3 là gì?

Tôi nên học phiên bản CSS nào?

Mục đích của CSS3 là gì?

Các tính năng mới trong CSS3 là gì?