Folow me on Pinterest
Prvi ste put ovdje? Pročitajte faq i registrirajte se.
x
  • Registracija
Dobrodošli, ovdje možete postavljati pitanja vezana za problematiku programiranja. Da bi postavili pitanje nije potrebna registracija :)

css3 zaobljeni rubovi

+7 glasova

Jano mi je da u css3 postoji mogućnost zaobljenih rubova na ovaj način:

-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;

Da li mi netko može točno objasniti koji browseri/preglednici podržavaju ovo?

Upit Sij 18, 2012 zozzo13 (178)  
   

2 Odgovori

+6 glasova
 
Najbolji odgovor

Prije nekog vremena naiđoh na ovaj članak na tu temu CSS Rounded Corners In All Browsers (With No Images). U vrijeme pisanja članka je vrijedilo:

  • moz-border-radius za Firefox
  • -webkit-border-radius za Chrome/Safari
  • border-radius je predviđen za vrijeme kada će ga svi browseri koristiti, ali vidim da ga FF8 i Chrome 16.x koriste bez -moz-/-webkit-. možda i Safari i Opera...
Odgovoreno Sij 18, 2012 Toril Askade (111)  
odabrano Sij 18, 2012 zozzo13
Thnx Toril :)
+2 glasova

Ovo je moj mali doprinos:

/* Firefox 3.5+, Safari 3.0+, Opera 10.5+, Chrome 4.1+, IE 9.0+ početak */
-webkit-border-radius: 5px; /* Safari i Chrome */
-moz-border-radius: 5px; /* Firefox */
border-radius: 5px; /* za budućnost spremni ;) */

-khtml-border-radius: 5px; /* stari Konqueror */

/* firefox pojedinačno */
-moz-border-radius-topleft: 5px; /* top left */
-moz-border-radius-topright: 5px; /* top right */
-moz-border-radius-bottomleft: 5px; /* bottom left */
-moz-border-radius-bottomright: 5px; /* bottom right */
-moz-border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px; /* [horizontalni radijus] / [vertikalni radijus] */
-moz-border-radius:5px 5px 5px 5px;  /* skraćeno topleft topright bottomright bottomleft */

/* webkit's pojedinačno */
-webkit-border-top-left-radius:5px; /* top left */
-webkit-border-top-right-radius:5px; /* top right */
-webkit-border-bottom-left-radius:5px; /* bottom left */
-webkit-border-bottom-right-radius:5px; /* bottom right */
-webkit-border-radius: 5px 5px 5px 5px; /* skraćeno topleft topright bottomright bottomleft */

Pregled kompatibilnosti browsera:
opis slike

Odgovoreno Svi 21, 2012 pinky_mint (29)  

Molimo prijavite se ili registrirajte da bi mogli odgovoriti na pitanje