Border-*-*-radius: Skillnad mellan sidversioner
PGJ (diskussion | bidrag) Skapade sidan med 'Egenskapen <code>border-*-*-radius</code> används för att sätta radien på ett blockelement. Eftersom det finns en flera varianter av denna som alla gör precis samma sak,...' |
PGJ (diskussion | bidrag) |
||
| (6 mellanliggande sidversioner av samma användare visas inte) | |||
| Rad 1: | Rad 1: | ||
Egenskapen <code>border-*-*-radius</code> används för att sätta radien på ett | Egenskapen <code>border-*-*-radius</code> används för att sätta radien på ett rundat hörn på ett element. Eftersom det finns en flera varianter av denna som alla gör precis samma sak, fast för olika hörn, har vi valt att samla beskrivningen på en enda sida. | ||
Det första "<code>*</code>"-tecknen ska ersättas med ett av följande positionsord;<code>bottom</code> eller <code>top</code>. | |||
Det andra "<code>*</code>"-teckent ska ersättas av ett av följande positionsord; <code>left</code> eller <code>right</code>. | |||
Om vi t.ex. vill runda av det nedre, vänstra hörnet skulle egenskapen skrivas; <code>border-bottom-left-radius</code> | |||
== Egenskaper == | == Egenskaper == | ||
| Rad 18: | Rad 24: | ||
| Alla element | | Alla element | ||
|} | |} | ||
''Längdvärdet1'' anger den horisontella radien på avrundningen. Om detta är det enda längdvärdet, kommer det att sättas lika på bägge radierna. | |||
''Längdvärdet2'' anger den vertikala radien på avrundningen. | |||
Längderna kan anges med hjälp av alla [[Måttenheter_i_CSS|CSS-måttenheter]]. | |||
== Exempel == | == Exempel == | ||
<codepen pen="mJNzmV" height=" | <codepen pen="mJNzmV" height="300" tab="css,result"> | ||
</codepen> | </codepen> | ||
== Egenskapens definition == | == Egenskapens definition == | ||
https://drafts.csswg.org/css-backgrounds-3/#border-bottom-left-radius | |||
Nuvarande version från 30 januari 2019 kl. 14.26
Egenskapen border-*-*-radius används för att sätta radien på ett rundat hörn på ett element. Eftersom det finns en flera varianter av denna som alla gör precis samma sak, fast för olika hörn, har vi valt att samla beskrivningen på en enda sida.
Det första "*"-tecknen ska ersättas med ett av följande positionsord;bottom eller top.
Det andra "*"-teckent ska ersättas av ett av följande positionsord; left eller right.
Om vi t.ex. vill runda av det nedre, vänstra hörnet skulle egenskapen skrivas; border-bottom-left-radius
Egenskaper
| Parametrar | <längdvärde1> | <längdvärde2> | initial | inherit
|
| Defaultvärde | 0
|
| Ärvs? | Nej |
| Animerbart? | Ja |
| Fungerar med... | Alla element |
Längdvärdet1 anger den horisontella radien på avrundningen. Om detta är det enda längdvärdet, kommer det att sättas lika på bägge radierna.
Längdvärdet2 anger den vertikala radien på avrundningen.
Längderna kan anges med hjälp av alla CSS-måttenheter.
Exempel
Egenskapens definition
https://drafts.csswg.org/css-backgrounds-3/#border-bottom-left-radius