CSS outline ominaisuus

Määrittely ja käyttö

Outline (reunaviiva) on viiva, joka piirretään elementin ympärillä, sijaitsee reunan reunan ulkopuolella ja voi korostaa elementtiä.

Huomautus：Reunaviivat eivät vie tilaa ja eivät välttämättä ole neliömäisiä.

Outline-yhteenveto-ominaisuus asettaa kaikki reunan ominaisuudet yhdessä lauseessa.

Voit asettaa nämä ominaisuudet järjestyksessä：

Jos et aseta jotain arvoa, ei ole ongelmaa, esimerkiksi outline:solid #ff0000; on myös sallittu.

Lisäksi tutustu：

CSS-opetus：CSS-reunat

HTML DOM -viittausopas：outline-ominaisuus

Esimerkki

Aseta neljän reunan tyyli：

p
  {
  outline:#00FF00 dotted thick;
  }

Kokeile itse

CSS-grammatiikka

outline: outline-width outline-style outline-color|initial|inherit;

Ominaisuusarvo

Arvo Kuvaus
outline-color Määritetään reunan väri. Katso：outline-color mahdolliset arvot.
outline-style Määritetään reunan tyyli. Katso：outline-style mahdolliset arvot.
outline-width Määritetään reunan leveys. Katso：outline-width mahdolliset arvot.
inherit Määritetään, että outline-ominaisuuden asetukset tulisi periä vanhemmalta elementiltä.

Tekninen yksityiskohta

Oletusarvo： invert none medium
Perinnäisyys： ei
Versio： CSS2
JavaScript-grammatiikka： object.style.outline="#0000FF dotted thin"

TIY-esimerkki

Piirrä viiva elementin ympärillä
Tämä esimerkki näyttää, kuinka outline-ominaisuutta käytetään elementin ympärillä viivan piirtämiseen.

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen versio, joka tukee tätä ominaisuutta täysin.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

Huomautus：Jos määritetty !DOCTYPE, IE8 tukee outline-ominaisuutta.