Prepričajte se, da izbrišete tudi rob in oblazinjenje teh elementov (običajno pri vsaki ponastavitvi ali normalizaciji). html, body (višina: 100%; preliv: "

Tako kot v igri PICROSS3D. CSS3 Gumb gumba za tehniko .btn (barva: bela; družina pisav: Helvetica, Arial, Sans-Serif; velikost pisave: "

To deluje pri besedilnih vnosih (npr. Besedilo, e-pošta itd.), Vendar dejanskih vnosov gesel ne morete spremeniti. Primer uporabe = ???. vnos (-webkit-text-security: none;) "

Ime barve HEX Barva AliceBlue # F0F8FF AntiqueWhite # FAEBD7 "

To je bil demonstracijski izvirnik Martina Ivanova, ki je s skritimi potrditvenimi polji in sosednjimi kombinacijami bratov in sester določil "stanje" vsake mape. Predstavitev v živo "

Tu je primer preprostega razreda v treh stolpcih: .three-col (-moz-column-count: 3; -moz-column-gap: 20px; -webkit-column-count: 3; -webkit-column-gap : "

Ul.box (položaj: relativno; z-indeks: 1; / * prepreči, da bi sence zaostale za ozadji * / overflow: hidden; style-list: none; margin: 0; "

Zaslon @media in (najmanjša širina: 320 slikovnih pik) in (največja širina: 767 slikovnih pik) in (usmeritev: pokrajina) (html (preoblikovanje: zasukanje (-90 stopinj); preoblikovanje izvora: levo zgoraj; "

Img (-ms-interpolation-mode: bicubic;) Če sliko zmanjšate z atributi širine in / ali višine, bo v IE videti grozno, če ne uporabite "

Slika ozadja:"

To ni nabor polj

Booyah!

.fieldset (position: relative; border: 1px solid "

Uporaba psevdo (-ov) elementov Lahko postavite psevdo-element tako, da je bodisi za elementom bodisi večji, s čimer ustvarite učinek obrobe s svojim "

Osnovna izjava in uporaba @ -webkit-keyframes NAME-YOUR-ANIMATION (0% (motnost: 0;) 100% (motnost: 1;)) @ -moz-keyframes NAME-YOUR-ANIMATION (0% ("

Spletne strani v iOS-u imajo privzeto pomikanje v slogu "zagon", kjer s prstom pošljete spletno stran, ki se pomika in se nadaljuje do konca. "

Brskalniki, ki podpirajo več ozadij (WebKit od zgodnjih dni, Firefox 3+), uporabljajo takšno sintakso: #box (background: url (icon.png.webp) zgoraj levo "

Html, body, div, span, aplet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, kratica, naslov, big, cite, code, del, dfn, em, pisava, "

Besedilo v oznakah

 se privzeto ne zavije. Na primer, glejte delček kode spodaj! Če to povzroča težave s postavitvijo, je ena od rešitev, da

									

Na element lahko vedno uporabite filter, da postane enoličen v sivinskem smislu: glejte Monotonsko pero - slika Chrisa Coyierja (@chriscoyier) "

Howdy .layered-paper (ozadje: #eee; box-shadow: 0 1px 1px rgba (0,0,0,0.15), / * Senca zgornje plasti * / 0 10px 0 -5px #eee, / * Druga plast * / 0 "

Enota velikosti pisave rem je podobna em, le da je namesto kaskadne vedno v primerjavi s korenskim (html) elementom (več informacij). To je precej "

A: povezava (barva: modra;) a: obiskana (barva: vijolična;) a: lebdenje (barva: rdeča;) a: aktivna (barva: rumena;) povezava, obiskano, lebdenje, aktivno L, V, H, A Ljubezen sovraštvo"

Lahko se samodejno skrije, namesto da bi se vedno prikazoval: html (-ms-overflow-style: -ms-autohiding-scrollbar;) Izkaže se tako: Zasluga za Thierryja "

Ko pridemo desno do kode, tukaj je delujoča izvedba: html (velikost pisave: 16px;) @media zaslon in (min-width: 320px) (html (velikost pisave: calc (16px + "

Ta delček smo premaknili v naš kanonični delček o tej temi. Glej: Ravnanje z dolgimi besedami in URL-ji "

Zaslon samo za @media in (širina naprave: 768px) (/ * Za splošne postavitve za iPad * /) Zaslon samo za @media in (min-device-width: 481px) in (max-device-width: "

* Jezik specifično * /: lang (af) (narekovaji: '201E' '201D' '201A' '2020-2021';): lang (ak) (družina pisav: Lucida, "DejaVu Sans", deduj; ): lang (ar) (družina pisav: Tahoma "

.hexagon (širina: 100px; višina: 55px; položaj: relativno;) .hexagon, .hexagon: before, .hexagon: after (ozadje: rdeče; box-shadow: 0 0 10px "

To je samo WebKit, vendar je to najčistejši način za njegovo izvedbo, saj besedilo še vedno omogoča urejanje in izbiranje spletnega besedila. h1 (velikost pisave: 72 slikovnih pik; ozadje: "

A (položaj: relativno; oblazinjenje-dno: 2 slikovnih pik; okrasitev besedila: nič;) a: hover :: after (vsebina: ""; položaj: absolutno; spodaj: 2 slikovnih pik; levo: 0; višina: 1 slikovna pika; "

Tako kot Twitter leta 2012. vhod, textarea (-webkit-prehod: vseh 0,30s enostavno vstopanje; -moz-prehod: vseh 0,30s enostavnost vstopa; -ms-prehod: vseh 0,30s "