Runde Ecken mit CSS in allen Browsern darstellen?
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
abgerundete ecken
aktuellen browser
alten browser
browser
code
darstellen
diversen versionen
empfehlenswerte methode
folgenden adressen
grossartigen tipps
guter browser
http
moderne browser
radius
richtige gefunden danke
runde ecken
tip
transparenten ecken
url
variante interessieren
-
Hallo Lima People :)
Ich habe da mal eine Frage und zwar wie kann man denn runde Ecken per css darstellen und zwar so, dass es so gut wie alle grossen/gängigen Browser auch erkennen? Ich habe zwar von einem jQuery Script gelesen mit dem man das schnell erwirken kann, aber ich würde mich eher für eine CSS Variante interessieren.
Ihr seid da sicher schlauer als ich, darum hoffe ich mal auf Antwort.
LG Andy -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
border-radius: 10px;
Damit kannst du Runde ecken einbauen. Google das mal ein bisschen
Ein Tipp: Nutze auch das std border-radius (was oben steht), denn das ist die allgemeingültige CSS3 schreibweise, wie sie eigentlich die meisten Browser unterstützen. Verwende nicht nur sowas wie -moz-border-radius oder -webkit-border-radius . Ein guter Browser unterstützt Standarts, und den border-radius unterstützt eigentlich sogar der IE .
Hier ein Direktlink zu einer meiner Lieblingsseiten:
http://www.w3schools.com/cssref/css3_pr_border-radius.asp
Liebe Grüße -
Was garantiert immer und mit jedem noch so alten Browser richtig dargestellt wird ist das da:http://www.webbe.de/index.shtml?CONTENT=script_css_corner;LANG=de.
-
ggamee schrieb:
und den border-radius unterstützt eigentlich sogar der |E.
aber erst ab ab IE9
border-radius unterstützen alle aktuellen Browser.
für ältere eventuell noch die entsprechenden Browser Prefixe davor.
Was welcher Browser momentan unterstützt ist hier ganz übersichtlich aufgelistet.
Für einen schnellen Überblick empfehlenswert:
http://www.findmebyip.com/litmus -
Mann Leute Ihr seid ja mal echt super hilfsbereit. Vielen Dank für die grossartigen Tipps. Habe da nun auch das Richtige gefunden.
Danke nochmal :) -
Webdesigner haben schon viel Energie investiert, abgerundete Ecken zu erzeugen, bevor die neuste Browserversion auf den Markt kam.
Es gibt Lösungen mit Bildern, transparenten Ecken und sogar mit eigens geschriebenen Skripts.
Eine andere Lösung als border-radius:
Bilddateien nutzen!
Anregungen kann man sich bei folgenden Adressen holen:
[/b]
www.net-developers.de/blog/2010/01/17/runde-ecken-in-css-fur-alle-browser-auch-ie
http://matthiasschuetz.com/css-abgerundete-ecken-in-allen-browsern-darstellen
www.alistapart.com/articles/mountaintop
www.alistapart.com/articles/customcorners
www.alistapart.com/articles/customcorners2
gruß
-
ich würde es so machen, mit css3 eben:
border-radius:10px;
und dann für browser die es noch nicht direkt unterstützen, nur in dieser form: z.B.
-webkit-border-radius:10px;
-moz-border-radus:10px;
so funktioniert das Ganze in gängigen Browsern! -
edel-in-sibirien schrieb:
so funktioniert das Ganze in gängigen Browsern!
Ob man sie mag oder nicht, Internet-Explorer in diversen Versionen vor 9 sind durchaus gängig und weit verbreitet. Dort allerdings funktioniert das nicht!
Eine sichere, wenn auch nicht empfehlenswerte Methode ist die, von Kaetzle genannte.
Alternativ wäre zu empfehlen, mit Browserweichen zu arbeiten. Für "moderne Browser wird CSS genutzt, für alle anderen wird mit Graphikelementen gearbeitet.
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
