Trước CSS - ban đầu, thoải mái, thiết thực

Pseudo-yếu tố và giả lớp CSS: trước, sau, di chuột, hoạt động vv - cơ hội hiệu quả để nâng cao chất lượng và đơn giản hóa các trang web thực hiện, không bao gồm cả mã JavaScript xử lý trên rõ ràng, không yêu cầu phức tạp thiết kế phản ứng, các yếu tố sự kiện, các cuộc đối thoại và hành động của khách truy cập.

Pseudo thuận tiện, đa chức năng, có tính chất lựa chọn quan trọng và nhiều cho chảo bản quyền đơn giản và phức tạp: làm thế nào ban đầu gây sự chú ý, liên tục làm rõ các hành động cần thiết để mang lại một gợi ý ở đúng nơi.

triển vọng lớn mở url khi quy định () trong các nội dung của giả. Trên thực tế, tùy chọn này mở ra những chân trời mới, cả về tải về bất cứ điều gì để trang web, và kích hoạt có thể xảy ra bất cứ điều gì bất cứ nơi nào

Một tính năng đặc biệt của giả

Pseudo (:: trước CSS, :: sau) khác nhau từ các yếu tố, selectors và pseudo-classes mà ban đầu không tồn tại trong cây tài liệu. Có lẽ, trên thực tế nó không phải là đặc biệt quan trọng, nhưng nếu chúng ta xem xét các vấn đề đặt nội dung trên trang web, bạn tin tưởng vào tài sản nội dung của một cái gì đó có ý nghĩa cho các công cụ tìm kiếm không có ý nghĩa.

Giả :: trước CSS cho phép bạn thêm nội dung vào phần tử, và sau :: - sau. Nội dung có thể thay đổi từ văn bản đơn giản để định dạng phức tạp về thuộc tính CSS, nhưng không có thẻ HTML. Giả có thể được vị trí hoàn hảo bên trong phần tử, mà được gắn vào, vì ý nghĩa của trước và sau là tương đối và di động. Bạn không thể chỉ định vị trí, mà còn là kích cỡ, màu sắc, hình nền, phông chữ, và sử dụng các tính năng khác của CSS.

Như giả CSS, trước và sau đều bắt đầu bằng biểu tượng ":", nhưng tiêu chuẩn CSS3 đề nghị "::". Để kiểm tra việc sử dụng cụ thể trên một trang sẽ không bao giờ có nhiều hơn một số trình duyệt hoặc các phiên bản có thể đơn giản là không nhận thấy một sự giả cụ thể.

Điều khoản sử dụng chung

Bằng cách đặt, ví dụ div yếu tố mô tả class = 'scElement' và nội dung "tố" để trang, chỉ trong CSS kiểu mô tả tấm:

.scElement {
VỊ TRÍ ...;
z-index ...;
...

}

bạn có thể áp dụng một giả ": hover" giả và ":: trước khi" CSS:

.scElement: hover :: before {content: 'prefix'; màu ...; background-color ...;}.

Sau đó, khi bạn di chuyển con trỏ chuột trước khi từ 'tố' sẽ xuất hiện từ 'prefix', mà sẽ thay đổi màu sắc của các chữ cái và nền.

biến thể nội dung giả

Nếu bạn không chỉ định thuộc tính giả, họ sẽ giống như của các yếu tố chính - scElement. Bạn có thể chỉ url, và sau đó là sở hữu nội dung: url ( '/ scBox / rm-v / sc-rights.png') khi con trỏ cho thấy hình ảnh trên phần tử. Trong trường hợp nội dung: "\ 03B1" xuất hiện toán học biểu tượng "alfa", nhưng sử dụng các ký tự đặc biệt: "& nbsp;", " & lt;", "& laquo;", "& raquo;" và người khác thì không - họ sẽ được hiển thị như là.

Cho phép nhiều lựa chọn để xác định nội dung của pseudo-: "text" bình thường, url (), một chuỗi các ký tự thập lục phân, hãy tham khảo: open-quote / close-quote, hoặc không mở quote / no-gần-báo giá, vv Như có thể là một dấu hiệu cho thấy vị trí tuyệt đối của nội dung. thông qua các thuộc tính phong cách, bằng cách áp dụng trước, CSS sẽ đặt giả bất cứ nơi nào trong phần tử mà nó được kết nối.

Bạn có thể kết hợp việc sử dụng đồng thời trước và sau. Do đó, đặt sử dụng CSS trước khi ký tự nội dung, bạn có thể nhận được một loạt các hiệu ứng, kết hợp khác nhau pseudo-class và pseudo-yếu tố, gây ngạc nhiên cho khách truy cập, không chi tiêu cùng lúc ngay cả một byte-code đơn JavaScript.

tính năng giả

Đối với định danh của họ thông qua ":" nhân vật, cũng như đề cập đến giả, nhưng không giống như CSS3 giả thường biểu hiện bằng "::". Những trình duyệt hiểu nó, cảm nhận được cả hai định danh. Khoảng trống trong ghi là không được phép, chuỗi được ghi lại và giả (hoặc chỉ) giả ghi lại với nhau:

scElement: hover :: before {content: 'prefix'; ...}

scElement: hoạt động: sau khi {content: 'hậu tố'; ...}

Điều quan trọng là hãy nhớ: CSS trước khi chạy ra khỏi nội dung trang web. Phong cách không liên quan đến nội dung của trang. Pseudo - không là ngoại lệ. Họ không xuất hiện trong cây DOM và mong muốn sử dụng chúng trong các phần có liên quan của trang web - trong nội dung, họ sẽ không nhận được.

Sử dụng "" và "::" được hỗ trợ bởi nền tảng di động và các trình duyệt hiện đại, nhưng kiểm tra các hoạt động trên các phiên bản cũ thường là không cần thiết.

Nội dung của giả không được đưa vào nội dung của trang web. Nó sẽ không thấy các công cụ tìm kiếm. Làm thế nào để sử dụng trường hợp này - phụ thuộc vào tình hình cụ thể, nhưng khả năng sử dụng CSS trước, cũng như sau đó, một cách độc lập hoặc trong một phức tạp, thú vị khi nội dung là một url (). sử dụng trực tiếp của giả nội dung như các liên kết đến các trang web, sẽ cho phép anh ta để tải về một tập tin, ví dụ như một bức tranh.

Khả năng thay đổi các tập tin theo phong cách trực tuyến (cascading style sheets file - không có ngoại lệ) không can thiệp với hình thức và sử dụng giả vì nó là thuận tiện tại bất kỳ thời điểm nào, trong thuật toán đúng nơi, tùy thuộc vào hành động của khách truy cập.