CSS kirjasin ominaisuus
- Edellinen sivu float
- Seuraava sivu @font-face
Määrittely ja käyttö
Fontin lyhennetty ominaisuus asettaa kaikki kirjasinominaisuudet yhdessä lauseessa.
Huomautus:Tällä ominaisuudella on myös kuudes arvo: "line-height", joka asettaa rivivälin.
Selitys
Tämä lyhennetty ominaisuus käytetään kerralla asettamaan elementin kirjasimen kaksi tai useampi puoli. Käyttämällä avainsanoja kuten icon voidaan asettaa elementin kirjasin sopivasti, jotta se on yhdenmukainen käyttäjän tietokoneympäristön kanssa. Huomaa, että ilman näitä avainsanoja vähintään fonttikoko ja fonttityyppi täytyy määrittää.
Ominaisuudet voidaan asettaa järjestyksessä seuraavasti:
Yksi arvo voi olla jätetty pois, kuten font:100% verdana; on myös sallittu. Määrittelemättömät ominaisuudet käyttävät oletusarvojaan.
Katso myös:
CSS-opasCSS kirjasin
HTML DOM-oppaastifont-ominaisuus
Esimerkki
Aseta kaikki kirjasinkohteet yhdessä lausekkeessa:
p.ex1 { font:italic arial,sans-serif; } p.ex2 { font:italic bold 12px/20px arial,sans-serif; }
CSS-syntax
font: font-style font-variant font-weight font-size/line-height font-family|caption|icon|menu|message-box|small-caption|status-bar|initial|inherit;
Ominaisuuden arvo
Arvo | Kuvaus |
---|---|
font-style | Määrittelee kirjasimen tyylin. Katso:font-style mahdolliset arvot. |
font-variant | Määrittelee kirjasimen eri muodon. Katso:font-variant mahdolliset arvot. |
font-weight | Määrittelee kirjasimen paksuuden. Katso:font-weight mahdolliset arvot. |
font-size/line-height | Määrittelee kirjasinkoon ja riviväljän. Katso:font-size ja line-height mahdolliset arvot. |
font-family | Määrittelee kirjasinkoon.font-family mahdolliset arvot. |
caption | Määrittelee otsikkokehyksen (esim. painikkeet, pudotuslistat jne.) käyttämän kirjasimen. |
icon | Määrittelee kuvakkeen merkinnän käyttämän kirjasimen. |
menu | Määrittelee pudotuslistan käyttämän kirjasimen. |
message-box | Määrittelee dialogin käyttämän kirjasimen. |
small-caption | caption-kirjasimen pieni versio. |
status-bar | Määrittelee ikkunatilan tilapalkin kirjasimen. |
Tekninen yksityiskohta
Oletusarvo: | ei määritelty |
---|---|
Perinnäisyys: | kyllä |
Versio: | CSS1 |
JavaScript-syntax | object.style.font="italic small-caps bold 12px arial,sans-serif" |
TIY-esimerkki
- Kaikki kirjasinkohteet yhdessä lausekkeessa
- Tämä esimerkki näyttää, miten kirjasinkohteet asetetaan yhdessä lausekkeessa käyttämällä lyhennettyjä ominaisuuksia.
- Aseta kappaleen kirjasinkoot käyttämällä "caption"-arvoa
- Tämä esimerkki näyttää, miten asetetaan kappaleen kirjasinkoot käyttämällä "caption"-arvoa.
Selaintuki
Taulukossa olevat numerot osoittavat ensimmäisen selausohjelman version, joka täysin tukee kyseistä ominaisuutta.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- Edellinen sivu float
- Seuraava sivu @font-face