Úvod do cheatheet CSS3
Cascading Stylesheet (CSS) je v podstate jazyk štýlov, ktorý sa používa na implementáciu vzhľadu a formátovania dokumentu vyvinutého v značkovacom jazyku. Špecifikáciu CSS spravuje hlavne World Wide Web Consortium (W3C). Hlavným motívom implementácie CSS je predstaviť oddelenie prezentácie a obsahu, ktoré zahŕňa predné strany, formáty usporiadania. CSS3 je najnovšou verziou alebo štandardom pre CSS po CSS2. CSS3 je hlavne kombináciou špecifikácií CSS2 a niektorých nových funkcií.
Nižšie nájdete niekoľko dôležitých modulov Cheatsheet CSS3:
- Model skrinky
- selektory
- Textové efekty
- 2D transformácie
- 3D transformácie
- Zastúpenie obrázka
- Užívateľské rozhranie
- Rozloženie viacerých stĺpcov
- animácie
- Úprava obsahu a prerozdelenie
V tomto článku Cheatsheet CSS3 budeme diskutovať o tom, čo je CSS3 a o rôznych príkazoch CSS3.
Príkazy a obsah na Cheatheet CSS3
CSS3 má rozsiahlu knižnicu, interaktívnu, rozšíriteľnú a obsahujú veľa vstavaných metód na výpočet bežných operácií. Nižšie sú uvedené príkazy Cheatheet CSS3, ktoré vykonávajú rôzne operácie príkazového riadku:
|
COMMAND |
POPIS |
| : zameranie | Zamerať sa na prvok |
| : aktívny | Zobrazenie a výber aktívneho prvku |
| : povolené | Na zobrazenie prvku, ktorý je povolený |
| : skontrolované | Na zobrazenie začiarknutého prvku |
| : lang | Umožniť vývojárovi určiť jazyk pre konkrétny prvok |
| : výber | Na zobrazenie prvku, ktorý je zvýraznený a vybraný |
| : root | Zobrazenie koreňového prvku v dokumente |
| : Prvé dieťa | Na zobrazenie prvého súrodeneckého prvku |
| :posledné dieťa | Zobrazenie posledného súrodeneckého prvku |
| :len dieťa | Zobrazenie jediného podradeného prvku |
| : Prvé-of-type | Na zobrazenie prvého súrodeneckého prvku konkrétneho typu |
| : Last-of-type | Na zobrazenie posledného súrodeneckého prvku konkrétneho typu |
| : Only-of-type | Na zobrazenie jediného súrodeneckého prvku konkrétneho typu |
| : prázdne | Zobrazenie prvku, ktorý nemá deti |
| ::prvé písmeno | Pridanie špecifického štýlu k prvému písmenu textu |
| ::prvá línia | Pridanie špecifického štýlu na prvý riadok textu |
| :: po | Vloženie určitého obsahu za textový prvok |
| :: predtým | Vloženie určitého obsahu pred textový prvok |
Operátori: - Rôznymi typmi operátorov v CSS3 sú porovnávací (relační) operátori, priradení operátori, logickí operátori a identifikační operátori.
Meracie škály : Cheat sheet CSS3 meracie škály sú nasledujúce
|
SCALE / PARAMETER |
POPIS |
| em | Veľkosť písma aktuálneho prvku |
| bývalý | Výška písma prvku |
| px | Zobrazuje sa pixel zariadenia |
| rem | Veľkosť písma koreňového prvku |
| vh | Výška výrezu |
| vw | Šírka výrezu |
| % | percento |
| pc | Pica |
| pt | bod |
Farebný kód: Názov farby = červená, modrá, zelená a tmavo zelená. Nižšie nájdete kódy pre rovnaké kódy
|
CODE |
OPIS / ZMENA |
| RGB (x, y, z) | Pre červenú = rgb (255, 0, 0) |
| RGB (x%, y%, z%) | Pre červenú = rgb (100%, 0, 0) |
| #rrggbb | Pre červenú = # ff000 |
| flabor | Užívateľ si vybral farbu na prispôsobenie užívateľského rozhrania |
| RGBA (x, y, z, alfa) | Pre červenú = rgb (255, 0, 0) |
User Interphase Properties: Vlastnosti používateľskej fázy CSS3 Cheat sheet sú nasledujúce.
|
HODNOTY VLASTNÍCTVA |
POPIS |
| ikona | Poskytnúť ikonu v oblasti |
| resize | Zmena veľkosti zadaných prvkov oblasti |
| box-dimenzovanie | Oprava určenej oblasti prvkov |
| vzhľad | Implementovať prvky ako prvky používateľského rozhrania |
| nav-down | Posunutie prvkov dole podľa tlačidla so šípkou nadol na klávesnici |
| nav-left | Posunutie prvkov doľava podľa tlačidla so šípkou doľava na klávesnici |
| nav-up | Posunutie prvkov nahor podľa tlačidla so šípkou doľava |
| nav-right | Posunutie prvkov vpravo podľa tlačidla so šípkou doprava |
| obrys ofset | Nakreslenie obrysu vybranej textovej oblasti |
Druhy selektora : Cheat sheet CSS3 selektor typy sú nasledujúce.
|
TYPOVÉ NÁZOV |
OPIS / ZMENA |
| univerzálne | Zobrazenie ľubovoľného prvku |
| typ | Ak chcete zobraziť akýkoľvek konkrétny typ prvku |
| Trieda | Na zobrazenie viacerých prvkov rôznych typov |
| id | Zobrazenie a identifikácia jedného konkrétneho typu prvku bez ovplyvnenia ostatných |
| dieťa | Zobrazenie prvku, ktorý priamo spadne, spadne pod iný prvok |
| zoskupenia | Identifikácia viacerých prvkov rôznych typov |
| Susedné Sibír | Načítať všetky prvky, ktoré majú toho istého rodiča a prvky a sú v bezprostrednom poradí |
| Generál Sibling | Načítať všetky prvky, ktoré majú toho istého rodiča a prvky a nie sú nevyhnutne v bezprostrednom poradí |
Tipy a triky zadarmo Cheat sheet Príkazy CSS3: -
- Režim prelínania CSS3 sa dá použiť na zjednotenie vzhľadu zadaného obsahu a tiež umožňuje používateľom nastaviť rôzne verzie farieb obrázkov. V CSS3 Cheat Sheet je okolo 15 hodnôt režimu miešania. To tiež prináša ďalšiu výhodu z pohľadu reprezentácie medzifázového zobrazenia.
- Orezávanie je ďalšou skvelou vlastnosťou CSS. Pomocou funkcie orezania môže užívateľ definovať viditeľnosť obrazovej oblasti podľa požiadavky. Ak teda akákoľvek časť obrázka spadne mimo požadovanú oblasť, potom sa môže orezávanie vykonať, aby sa táto ďalšia oblasť obrázka skryla.
- V prípade CSS je možné implementovať vlastnosti vnútri a tvaru mimo formy na obalenie obsahu okolo prispôsobenej cesty CSS a môže sa definovať a prideliť podľa požiadaviek koncového používateľa. V zásade umožňuje užívateľovi navrhnúť fázu podľa definovaných špecifikácií.
- Použitie animácie SVG (škálovateľná vektorová grafika) je ďalšou výhodou CSS3. Pri použití SVG s animáciou CSS3 sa medzifáza stane interaktívnejšou a SVG má tiež svoje vlastné DOM API.
- Funkcia mapy sa použije na všetky položky vo vstupnom zozname.
- Funkcia redukcie sa používa na vykonanie niektorých výpočtov v zozname a vráti hodnotu
- Hover Effects môžu byť implementované pomocou CSS3 Cheat Sheet
- Gooey menu je možné implementovať pomocou CSS3 a SVG filtrov, čo pomáha novému reprezentatívnemu prístupu z pohľadu používateľskej fázy
- Z hľadiska navrhovania webu je možné paralaxové efekty dosiahnuť pomocou CSS3.
- Interaktívna 3D štruktúra a užívateľská fáza sa dajú vytvoriť pomocou CSS3
- Použitím kombinácie rôznych selektorov je možné pomocou odkazu CSS3 vytvoriť ikonu formátu súboru vedľa odkazu na stiahnutie.
záver
V tomto článku Cheat sheet CSS3 sme videli, že CSS3 sa ľahko používa a jeho syntax je ľahšie zapamätateľná. CSS3 sa dá použiť na znázornenie technológií na vývoj webových aplikácií pomocou rôznych prístupov a technológií so štýlmi, ktoré podporujú CSS3. Na základe typu potreby projektu, času práce a všetkých ďalších diskutovaných aspektov by sa CSS3 mala použiť na dosiahnutie požadovaného cieľa.
Odporúčané články
To bol sprievodca Cheat sheet CSS3 tu sme diskutovali o obsahu a príkazu, rovnako ako bezplatné tipy a triky cheat sheet CSS3, môžete sa tiež pozrieť na nasledujúci článok, aby ste sa dozvedeli viac -
- Cheat Sheet CSS
- Kódy HTML
- Úžasný cheat sheet pre UNIX
- Cheat Sheet JavaScript: Funkcie