Úryvky kódu 2025, Apríl
.stitched (padding: 20px; margin: 10px; background: # ff0030; color: #fff; font-size: 21px; font-weight: bold; line-height: 1.3em; border: 2px dashed "
P (font-size: 24px! important;) Pravidlo! important na konci hodnoty prepíše všetky ostatné deklarácie štýlov tohto atribútu, vrátane vložených "
A (/ * úplne platná adresa URL, pravdepodobne externý odkaz * /) a (/ * odkaz na konkrétny web * /) a, a (/ * interný relatívny odkaz * /) a (/ * e-mailový odkaz * /) a (/ * „
Populárnou dizajnovou technikou je vytvorenie kontajnera obsahu, ktorý vyzerá ako list papiera, a stohovanie ďalších listov papiera pod ním a pridanie vrstvených vrstiev “
Hlavná stránka Katalóg Cena O aplikácii Kontakt nav (šírka: 960 pixelov; výška: 100 pixelov; okraj: 120 pixelov automaticky; zarovnanie textu: stred;). Horná ponuka li (zobrazenie: vložený blok; "
Tu je služba Google Code Prettify (nachádza sa pri tomto zdroji). .prettyprint (farba: # 839496; farba pozadia: # 002b36;) .prettyprint .pln (farba: inherit;) "
H1 # logo (šírka: 200px; // šírka obrázka, výška: 100px; // výška pozadia obrázka: url (../ cesta / k / obrázku.jpg.webp); indent-text: -9999px;) táto technika "
Blokový citát sa zobrazuje v prehliadačoch vyhovujúcich štandardom s efektom „veľké úvodzovky pred“ a v IE so silným ľavým okrajom a svetlošedou farbou.
Vyžaduje sa jQuery a jQuery UI pre skutočný posúvač. Tvár je tvorená prvkami vytvorenými do kruhov s polomerom ohraničenia. Ústa naznačujúca šťastie “
Z päty dizajnu v8 CSS-Tricks. Zobraziť ukážkovú pätu (jasné: obe; prepad: skryté; veľkosť písma: 16px; výška riadku: 1,3;) # päty-boxy ("
Všetky verzie prehliadača IE majú predvolene na textových plochách posúvač, aj keď sú prázdne. Žiadne iné prehľadávače to nerobia, takže ak ich chcete odstrániť, aby ich mohol prehliadač IE „
Akýkoľvek starý odkaz môže byť odkazom na dokument PDF, ale kliknutie na takýto odkaz, ak si myslíte niečo iné, môže byť pre používateľa prekvapujúce a nepríjemné. Toto “
Toto predpokladá použitie autoprefixeru. .face: hover (animation: shake 0.82s cubic-bezier (.36, .07, .19, .97) both; transform: translate3d (0, 0, 0); "
Štandard: -moz-border-radius: 10px; -webkit-border-radius: 10px; polomer okraja: 10px; / * budúca korektúra * / -khtml-border-radius: 10px; / * pre staré "
Prineste si svoje vlastné predvoľby! .grow (prechod: všetky .2s easy-in-out;) .grow: hover (transformácia: mierka (1.1);) "
Každý miluje stužky
.ribbon (font-size: 16px! important; / * Táto stužka)Na zahrnutie grafiky vo vysokom rozlíšení, ale iba pre obrazovky, ktoré ich môžu využiť. „Retina“ je „2x“: @media (-webkit-min-device-pixel-ratio: 2), “
Sú chvíle, kedy skutočne dlhý reťazec textu môže pretekať cez kontajner rozloženia. Napríklad: URL zvyčajne neobsahujú medzery, takže „
V prípade jazykov sprava doľava môžete vo väčšine prehliadačov zameniť predvolené rozloženie zľava doprava jednoducho pomocou atribútu dir. text sprava doľava “
A (outline: 0;) Buďte opatrní pri odstraňovaní štýlov obrysov z odkazov, pretože sú funkciou použiteľnosti. Ak tak urobíte, nezabudnite definovať jasné štýly zaostrenia. Ak „
Niekedy môže byť žiaduce odstrániť horný alebo ľavý okraj z prvého prvku v kontajneri. Rovnako tak pravý alebo dolný okraj od posledného „
Táto stránka obsahuje zoznam rôznych zariadení a mediálnych dotazov, ktoré by konkrétne zacielili na dané zariadenie. To asi nie je všeobecne dobrá prax, ale je užitočné vedieť, aké sú rozmery všetkých týchto zariadení v kontexte CSS. “
Webkit-tap-highlight-color: rgba (0,0,0,0); A potom povoliť, aby aktívne štýly fungovali vo vašom CSS na stránke v Mobile Safari: "
Bodkované okraje okolo odkazov sú funkciou prístupnosti, ktorú má väčšina prehliadačov v predvolenom nastavení. Je to pre používateľov, ktorí musia alebo sa rozhodnú navigovať pomocou klávesnice. “
HTML: .. or .. Prejsť CSS: input.button (odsadenie textu: -9000px; text-transformácia: použitie veľkých písmen;) Samotné odsadenie bohužiaľ na odstránenie textu nefunguje. "
Mierne svetlejšia farba (za predpokladu, že váš text je čierny), bodkované spodné ohraničenie a kurzor otáznika. Toto sa stalo trochu štandardizovaným prístupom, “
Pre obrázky pozadia CSS .yourselector (šírka: 200px; výška: 100px; pozadie: url (/folder/yourimage.png.webp) no-repeat; _background: none; "
Veľká poznámka tu! Posuvné dvere sú dosť stará technika. Malo to svoj čas na webe, ale dnes to asi nie je najchytřejšia cesta. Máme"
Sup, sub (vertical-align: baseline; position: relative; top: -0,4em;) sub (top: 0,4em;) "
@media print (a :: after (content: "(" attr (href) ")";)) "