Dez 12
CSS3 Runde Ecken – Statt Grafiken einfach CSS nutzen?!
Erstellt am 12. Dezember 2009 um 12:22 Uhr Kommentar hinzufügen
Anstatt eine Grafik auseinander zu basteln und vier runde Ecken zu designen ergibt sich die Möglichkeit, runde Ecken über CSS zu realisieren.
Wer mal Webseiten gestaltet hat und immer und immer wieder die Ecken erstellt hat, wird mit diesem Beispiel schnell und ohne Probleme ans Ziel kommen.
Leider gibt es ein kleines Problem mit dieser Lösung, nämlich das der Microsoft Internet Explorer und diverse andere Browser wie Opera, welche mit dem CSS-Code nichts anfangen können, diesen ignorieren und keine runde Ecken anzeigen.
Hier ein kleines Beispiel:
Ich bin ein Beispiel
Und noch mal ohne den CSS-Code:
Ich bin ein Beispiel
Um das ganze zu realisieren einfach wie folgt vorgehen:
Der CSS-Code sollte folgendes beinhalten:
/* Die Classe für die runden Ecken */
.rundeecken {
/* Mozilla (FireFox) */
-moz-border-radius:10px;
/* Konqueror */
-khtml-border-radius:30px;
/* Allgemein */
-webkit-border-radius:10px;
}
Der Effekt kommt über den Aufruf:
was auch immer...
Schlagworte: Allgemein, Aufruf, Beispiel, Browser, Classe, CSS, CSS-Code, Ecken, Effekt, Explorer, FireFox, Grafik, Internet, internet explorer, khtml-border-radius, Konqueror, Lösung, microsoft, Möglichkeit, moz-border-radius, Mozilla, opera, Opus, Problem, radius, webkit-border-radius, Webseiten, Ziel
12. Dezember 2009 um 12:56
Standard das MS das mal wieder nicht kann. Die werden wieder CSS 3 einführen wenn 4 schon vor der Tür steht. Mit dem IE 10…
13. Dezember 2009 um 11:13
@e-bloxx: Wohl wahr, ein schöner Witz dazu: http://jasiggi.de/witzzeigen.php?id=61