Wprowadzenie do Cheatsheet CSS3
Cascading Stylesheet (CSS) jest w zasadzie językiem arkuszy stylów używanym do implementacji wyglądu i formatowania dokumentu opracowanego w języku znaczników. Specyfikacja CSS jest utrzymywana głównie przez konsorcjum World Wide Web (W3C). Głównym motorem wdrażania CSS jest pokazanie oddzielenia prezentacji i treści, które obejmują fronty, formaty układu. CSS3 to najnowsza wersja lub standard CSS po CSS2. CSS3 to głównie połączenie specyfikacji CSS2 i nowych funkcji.
Znajdź poniżej kilka ważnych modułów Cheatsheet CSS3:
- Model pudełkowy
- Selektory
- Efekty tekstowe
- Transformacje 2D
- Transformacje 3D
- Reprezentacja obrazu
- Interfaza użytkownika
- Wiele układów kolumn
- Animacje
- Dostosowanie treści i realokacja
W tym artykule CSS3 Cheatsheet omówimy, czym jest CSS3 i różne polecenia CSS3.
Polecenia i treść w Cheatsheet CSS3
CSS3 ma obszerną bibliotekę, interaktywną, rozszerzalną i zawiera wiele wbudowanych metod obliczania typowych operacji. Poniżej wymieniono polecenia Cheatsheet CSS3, które wykonują różne operacje w wierszu poleceń:
|
KOMENDA |
OPIS |
| : skupiać | Aby skupić się na elemencie |
| : aktywny | Aby wyświetlić i wybrać aktywny element |
| : włączone | Aby wyświetlić element, który jest włączony |
| : sprawdzone | Aby wyświetlić element, który jest zaznaczony |
| : lang | Aby umożliwić programistom określenie języka dla określonego elementu |
| : wybór | Aby wyświetlić element, który jest podświetlony i wybrany |
| : root | Aby wyświetlić element główny w dokumencie |
| :pierworodny | Aby wyświetlić pierwszy element rodzeństwa |
| :ostatnie dziecko | Aby wyświetlić ostatni element rodzeństwa |
| :Jedynak | Aby wyświetlić jedyny element potomny |
| : pierwszy z typu | Aby wyświetlić pierwszy element rodzeństwa określonego typu |
| : ostatni z rodzaju | Aby wyświetlić ostatni element rodzeństwa określonego typu |
| : only-of-type | Aby wyświetlić jedyny element rodzeństwa określonego typu |
| : pusty | Aby wyświetlić element, który nie ma dzieci |
| :: pierwsza litera | Aby dodać określony styl do pierwszej litery tekstu |
| ::Pierwsza linia | Aby dodać określony styl do pierwszego wiersza tekstu |
| :: po | Aby wstawić część treści po elemencie tekstowym |
| :: przed | Aby wstawić część treści przed elementem tekstowym |
Operatory: - Różne typy operatorów w CSS3 to operatory porównania (relacyjne), operatory przypisania, operatory logiczne i operatory tożsamości.
Skale pomiarowe: Ściągawki Skale pomiarowe CSS3 są następujące
|
SKALA / PARAMETR |
OPIS |
| em | Rozmiar czcionki bieżącego elementu |
| dawny | Wysokość czcionki elementu |
| px | Wyświetlanie piksela urządzenia |
| rem | Rozmiar czcionki elementu głównego |
| vh | Wysokość rzutni |
| vw | Szerokość rzutni |
| % | Odsetek |
| szt | Cycero |
| pt | Punkt |
Kod koloru: Nazwa koloru = czerwony, niebieski, zielony i ciemnozielony. Znajdź poniżej kody tego samego
|
KOD |
OPIS / ZNACZENIE |
| rgb (x, y, z) | Dla czerwieni = rgb (255, 0, 0) |
| rgb (x%, y%, z%) | Dla czerwieni = rgb (100%, 0, 0) |
| #rrggbb | Dla czerwonego = # ff000 |
| współpracować | Kolor wybrany przez użytkownika, aby dostosować interfazę użytkownika |
| rgba (x, y, z, alfa) | Dla czerwieni = rgb (255, 0, 0) |
Właściwości międzyfazowe użytkownika: Właściwości międzyfazowe ściągawki CSS3 są następujące.
|
WARTOŚCI NIERUCHOMOŚCI |
OPIS |
| Ikona | Aby zapewnić ikonę na obszarze |
| Zmień rozmiar | Aby zmienić rozmiar określonych elementów obszaru |
| wielkość pudełka | Aby naprawić określony obszar elementu |
| wygląd | Aby zaimplementować elementy jako elementy interfejsu użytkownika |
| nawigacja w dół | Aby przesunąć elementy w dół zgodnie z klawiszem strzałki w dół na klawiaturze |
| nawigacja w lewo | Aby przesunąć elementy w lewo zgodnie z przyciskiem lewej strzałki na klawiaturze |
| nawigacja w górę | Aby poruszać się w górę elementów zgodnie z klawiszem lewej strzałki na klawiaturze |
| nawigacja w prawo | Aby przesunąć elementy w prawo zgodnie z klawiszem strzałki w prawo na klawiaturze |
| przesunięcie konturu | Aby narysować kontur wybranego obszaru tekstowego |
Typy selektorów : Ściągawki CSS3 są następujące:
|
WPISZ IMIĘ |
OPIS / ZNACZENIE |
| uniwersalny | Aby wyświetlić dowolny element |
| Rodzaj | Aby wyświetlić dowolny określony typ elementu |
| Klasa | Aby wyświetlić wiele elementów różnych typów |
| ID | Aby wyświetlić i zidentyfikować jeden konkretny typ elementu bez wpływu na inne |
| Dziecko | Aby wyświetlić element, który bezpośrednio wchodzi w zakres, należy do innego elementu |
| Grupowanie | Aby zidentyfikować wiele elementów różnych typów |
| Przylegające rodzeństwo | Aby pobrać wszystkie elementy, które mają tego samego rodzica i elementy i znajdują się w bezpośredniej kolejności |
| Generał Rodzeństwo | Aby pobrać wszystkie elementy, które mają tego samego rodzica i elementy i niekoniecznie znajdują się w bezpośredniej kolejności |
Darmowe porady i triki korzystania z Ściągawki Polecenia CSS3: -
- Tryb mieszania CSS3 można wykorzystać do ujednolicenia wyglądu określonej zawartości, a także umożliwia użytkownikom ustawianie różnych wersji kolorów obrazu. W CSS3 Cheat Sheet znajduje się około 15 wartości trybu mieszania. Dodaje także dodatkową korzyść z perspektywy reprezentacji międzyfazowej użytkownika.
- Przycinanie to kolejna świetna funkcja CSS. Korzystając z funkcji przycinania, użytkownik może zdefiniować widoczność obszaru obrazu zgodnie z wymaganiami. Tak więc, jeśli jakakolwiek część obrazu wykracza poza pożądany obszar, można zastosować obcinanie, aby ukryć ten dodatkowy obszar obrazu.
- W przypadku CSS można zaimplementować właściwości wewnątrz kształtu i na zewnątrz kształtu, aby owinąć zawartość wokół dostosowanej ścieżki CSS, a także można go zdefiniować i przypisać zgodnie z wymaganiami użytkownika końcowego. Zasadniczo umożliwia użytkownikowi zaprojektowanie interfazy zgodnie ze zdefiniowanymi specyfikacjami.
- Kolejną zaletą CSS3 jest użycie animacji SVG (skalowalnej grafiki wektorowej). Wykorzystując SVG z animacją CSS3, interfaza stanie się bardziej interaktywna, a SVG ma również swój własny interfejs API DOM.
- Funkcja mapy zostanie zastosowana do wszystkich pozycji na liście wprowadzania.
- Funkcja redukcji służy do zastosowania niektórych obliczeń na liście i zwraca wartość
- Efekty najechania można zaimplementować za pomocą ściągawki CSS3
- Lepkie menu można wdrożyć za pomocą filtrów CSS3 i SVG, co pomaga w nowym reprezentatywnym podejściu z perspektywy interfazy użytkownika
- Z perspektywy projektowania stron internetowych efekty paralaksy można wytwarzać za pomocą CSS3.
- Interaktywna struktura 3D i interakcja użytkownika mogą być tworzone przy użyciu CSS3
- Używając różnych kombinacji selektorów, można utworzyć ikonę formatu pliku obok łącza pobierania za pomocą CSS3.
Wniosek
W tym artykule Ściągawka CSS3 widzieliśmy, że CSS3 jest łatwy w użyciu, a jego składnia jest łatwiejsza do zapamiętania. CSS3 może być wykorzystywany do reprezentacji technologii tworzenia stron internetowych przy użyciu różnych podejść i technologii arkuszy stylów, które obsługują CSS3. W zależności od rodzaju projektu, czasu pracy i wszystkich innych omawianych aspektów, CSS3 powinien zostać wykorzystany do osiągnięcia pożądanego celu.
Polecane artykuły
To był przewodnik po Ściągawce CSS3. Omówiliśmy tutaj treść i polecenia, a także bezpłatne porady i wskazówki Ściągawki CSS3. Aby dowiedzieć się więcej, zapoznaj się z poniższym artykułem -
- Ściągawka CSS
- Ściągawka HTML
- Niesamowita ściągawka dla systemu UNIX
- Ściągawka JavaScript: Funkcje