CSS outline-style ominaisuus

Määrittely ja käyttö

outline-style ominaisuus käytetään elementin koko reunan tyylittelyyn. Tyyli ei voi olla none, muuten reunaviiva ei näy.

outline (reuna) on viiva, joka piirretään elementin ympärille, sijaitsee reunan reunan ulkopuolella ja voi korostaa elementtiä. outline-ominaisuus asettaa elementin ympärillä olevan reunaviivan.

Huomautus:Ilmoita aina ensin outline-color-ominaisuus ennen outline-style-ominaisuutta. Elementti voi muuttaa reunan väriä vain sen jälkeen, kun se on saanut reunan.

Huomautus:Reunaviivat eivät välttämättä täytä tilaa eivätkä ole välttämättä suorakulmaisia.

Lisäksi:

CSS-opas:CSS reunat

CSS -viittausopas:outline-ominaisuus

HTML DOM -viittausopas:outlineStyle-ominaisuus

esimerkki

Aseta reunan tyyli:

p
  {
  outline-style:dotted;

Kokeile itse

CSS-grammatiikka

outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

ominaisuusarvo

arvo kuvaus
ei mitään Oletus. Määritellään, että reunaa ei ole.
piilotettu Määritellään piilotetun reunan muoto.
piste Määritellään pisteitä olevan reunan muoto.
viivamerkki Määritellään viivamerkkinä olevan reunan muoto.
kiinteä Määritellään kiinteän reunan muoto.
kaksois Määritellään kaksoisreunuksen muoto. Kaksoisreunuksen leveys on sama kuin outline-width-arvo.
syvenevä Määritellään 3D:n syvenevän reuna-aukon muoto. Tämä vaikutus riippuu outline-color-arvosta.
kohoutuva Määritellään 3D:n kohoutuvan reuna-aukon muoto. Tämä vaikutus riippuu outline-color-arvosta.
syvenevä Määritellään 3D:n syvenevän reunan muoto. Tämä vaikutus riippuu outline-color-arvosta.
kohoutuva Määritellään 3D:n kohoutuvan reunan muoto. Tämä vaikutus riippuu outline-color-arvosta.
peri Määritellään, että reunan tyylin asetukset tulisi periä vanhemmalta elementiltä.

Tekninen yksityiskohta

Oletusarvo: ei mitään
Perinnäisyys: ei
Versio: CSS2
JavaScript-grammatiikka: objekti.style.outlineStyle="dotted"

Kokeile itse

Aseta reunan tyyli
Tämä esimerkki näyttää, miten voit asettaa reunan tyylin.

Selaimen tuki

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

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

Huomautus:Jos on määritelty !DOCTYPE, IE8 tukee outline-ominaisuutta.