CSS border-inline-end ominaisuus

定义和用法

border-inline-end 属性是以下属性的简写:

CSS 的 border-inline-end 属性与 border-bottomborder-leftborder-right ja border-top 属性非常相似,但 border-inline-end 属性依赖于行内方向。

注意:相关的 CSS 属性 writing-modetext-orientation ja direction Määrittää rivin suunnan. Tämä vaikuttaa rivin alkupisteeseen ja loppupisteeseen sekä border-inline-end Ominaisuuden vaikutus. Englanninkielisillä sivuilla rivin suunta on vasemmalta oikealle, lohkon suunta ylhäältä alas.

Esimerkki

Esimerkki 1

Aseta rivin lopun reunan leveys, väri ja tyyli:

div {
  border-inline-end: 10px solid pink;
}

Kokeile itse

Esimerkki 2: Yhdistettynä writing-mode-ominaisuuden kanssa

Rivin lopun reunan sijainti riippuu writing-mode Ominaisuuden vaikutus:

div {
  writing-mode: vertical-rl;
  border-inline-end: 5px solid blue;
}

Kokeile itse

Esimerkki 3: Yhdistettynä direction-ominaisuuden kanssa

Rivin lopun reunan sijainti riippuu direction Ominaisuuden vaikutus:

div {
  direction: rtl;
  border-inline-end: 5px solid hotpink;
}

Kokeile itse

CSS-kieli

border-inline-end: border-inline-end-width border-inline-end-style border-inline-end-color|initial|inherit;

Ominaisuusarvo

Arvo Kuvaus
border-inline-end-width

Määritä elementin reunan leveys rivin lopussa.

Oletusarvo on "medium".

border-inline-end-style

Määritä elementin reunan tyyli rivin lopussa.

Oletusarvo on "none".

border-inline-end-color

Määritä elementin reunan väri rivin lopussa.

Oletusarvo on nykyinen reunan väri.

Tekninen yksityiskohta

Tekninen yksityiskohta

initial Aseta tämä ominaisuus sen oletusarvon arvoksi. Katso: initial.
inherit Periisi isältään tämän ominaisuuden. Katso: inherit.
Oletusarvo: medium none currentcolor
Perintä: Ei
Animaation tekeminen: Tuki. Katso:Animaatiotunnukset.
Versio: CSS3
JavaScript-kieli: object.style.borderInlineEnd="pink dotted 5px"

Selaimen tuki

Taulukossa olevat numerot merkitsevät ensimmäistä selainta, joka täysin tukee kyseistä ominaisuutta.

Chrome Edge Firefox Safari Opera
69.0 79.0 41.0 12.1 56.0

Liittyvät sivut

Oppaat:CSS reunat

Viittaus:CSS border ominaisuus

Viittaus:CSS border-inline ominaisuus

Viittaus:CSS border-inline-end-style ominaisuus

Viittaus:CSS border-inline-end-color ominaisuus

Viittaus:CSS border-bottom-color ominaisuus

Viittaus:CSS border-left-color ominaisuus

Viittaus:CSS border-right-color ominaisuus

Viittaus:CSS border-top-color ominaisuus

Viittaus:CSS suunta ominaisuus

Viittaus:CSS text-orientation ominaisuus

Viittaus:CSS writing-mode ominaisuus