.õmmeldud (täidis: 20 pikslit; veeris: 10 pikslit; taust: # ff0030; värv: #fff; fondi suurus: 21 pikslit; fondi kaal: rasvane; joone kõrgus: 1,3em; ääris: 2px katkendlik "

P (font-size: 24px! oluline;) Väärtuse lõpus olev oluline reegel alistab selle atribuudi kõik muud stiilideklaratsioonid, sealhulgas tekstisisese "

A (/ * täielikult kehtiv URL, tõenäoliselt väline link * /) a (/ * link konkreetsele veebisaidile * /) a, (/ * sisemine suhtelink * /) a (/ * e-posti link * /) a (/ * "

Populaarne disainitehnik on luua sisukonteiner, mis näeb välja nagu paberileht, ja laduda selle alla teised paberilehed, lisades kihilise "

Avaleht Kataloog Hind kontaktandmete kohta nav (laius: 960 pikslit; kõrgus: 100 pikslit; veeris: 120 pikslit automaatselt; teksti joondamine: keskel;). Top-menu li (kuva: inline-block; "

Siin on Google Code Prettify (leitud sellest allikast). .prettyprint (värv: # 839496; taustavärv: # 002b36;) .prettyprint .pln (värv: pärima;) "

H1 # logo (laius: 200px; // pildi kõrgus: 100px; // pildi tausta kõrgus: url (../ path / to / image.jpg.webp); teksti taane: -9999px;) See tehnika "

Blokeeritud pakkumine kuvatakse standarditele vastavates brauserites efektiga "suured jutumärgid enne" ning IE-s paksu vasaku äärega ja helehalliga.

Nõuab tegeliku liuguri jaoks jQuery ja jQuery kasutajaliidese. Nägu on valmistatud piirjoontega ringideks tehtud elementidest. Suu, mis näitab õnne "

CSS-Tricksi v8 kujunduse jalusest. Kuva demo jalus (selge: mõlemad; ülevool: peidetud; fondi suurus: 16 pikslit; joone kõrgus: 1,3;) # jalusekastid ("

Vaikimisi on kõigil IE versioonidel tekstiribadel kerimisriba, isegi kui need on tühjad. Ükski teine ​​brauser seda ei tee, nii et kui soovite selle eemaldada, et IE saaks "

Iga ankrulink võib olla link PDF-dokumendile, kuid muul viisil mõtlemisel sellise lingi klõpsamine võib olla kasutaja jaoks üllatav ja ebamugav. See "

See eeldab automaatse parandaja kasutamist. .face: hõljumine (animatsioon: raputada 0,82 s kuup-bezier (.36, .07, .19, .97) mõlemad; transform: translate3d (0, 0, 0); "

Standard: -moz-piiri-raadius: 10px; -veebikomplekt-raadiuse raadius: 10px; piiri raadius: 10 pikslit; / * tulevikukindlus * / -khtml-border-radius: 10px; / * vana jaoks "

Võtke kaasa oma eesliited! .grow (üleminek: kõik .2s hõlbustavad sisselaskmist;) .grow: hover (teisendus: skaala (1.1);) "

Kõik armastavad paelu

.ribbon (font-size: 16px! oluline; / * See lint "

Suure eraldusvõimega graafika lisamiseks, kuid ainult ekraanide jaoks, mis neid kasutada saavad. "Võrkkest" on "2x": @media (-webkit-min-device-pixel-ratio: 2), "

Mõnikord võib tõeliselt pikk tekstistring paigutuse konteineri üle voolata. Näiteks: URL-idel pole tavaliselt tühikuid, nii et nad "

Paremast vasakule keelte puhul saate enamikus brauserites vasakult paremale vaikepaneeli vahetada lihtsalt atribuudi dir kaudu. tekst paremalt vasakule "

A (kontuur: 0;) Eemaldage linkide kontuuristiilid ettevaatlikult, kuna need on kasutatavuse funktsioon. Kui teete seda, määrake kindlasti fookusstiilid. Kui "

Mõnikord võib olla soovitav eemaldada konteineri esimese elemendi ülemine või vasak serv. Samamoodi parem või alumine veeris viimasest "

Sellel lehel on loetletud terve hulk erinevaid seadmeid ja meediumipäringuid, mis sihiksid just selle seadme. See pole ilmselt üldiselt hea tava, kuid on kasulik teada, millised on kõigi nende seadmete mõõtmed CSS-i kontekstis. "

Webkit-tap-highlight-color: rgba (0,0,0,0); Ja siis lubada: aktiivsed stiilid töötavad teie CSS-is Mobile Safari lehel: "

Lingid ümbritsevad punktiirjooned on enamikule brauseritest vaikimisi juurdepääsetavuse funktsioon. See on mõeldud kasutajatele, kes peavad klaviatuuri abil navigeerima või valivad seal "

HTML: .. või .. Go CSS: input.button (teksti taane: -9000px; text-transform: suurtäht;) Ainult negatiivne taane teksti eemaldamiseks kahjuks ei toimi "

Pisut heledam värv (eeldades, et teie tekst on must), punktiiriga alumine äär ja küsimärgikursor. Sellest on saanud mõnevõrra standardiseeritud lähenemine, "

CSS-i taustapiltide puhul .valik (laius: 200px; kõrgus: 100px; background: url (/folder/yourimage.png.webp) no-repeat; _background: none; "

Suur märkus siin! Liuguksed on üsna vana tehnika. Sellel oli oma aeg veebis, kuid ilmselt pole see tänapäeval kõige targem viis. Meil on"

Sup, sub (vertikaalne joondus: lähtejoon; asend: suhteline; ülemine: -0,4em;) alam (ülemine: 0,4em;) "

@media print (a :: after (sisu: "(" attr (href) ")";)) "