CSS div abgerundete Ecken

8

Ich versuche folgendes zu tun ...

Hier ist, was ich gerade habe .. aber es wird nicht richtig dargestellt. Hat jemand eine Idee, wie ich das beheben würde?

CSS

%Vor%

HTML

%Vor%     
Skizit 31.12.2010, 02:31
quelle

5 Antworten

20

Stattdessen schlage ich vor, dass Sie CSS3 verwenden, was im Gegensatz zu anderen Methoden kein überflüssiges HTML oder Javascript-Markup erfordert, das notorisch dazu führt, dass gerundete Elemente beim Laden der Seite "blinken".

%Vor%

Dieser Generator ist auch hilfreich: Ссылка und es gibt noch einen anderen Ссылка

In den neuesten Versionen der meisten (wenn nicht allen) Browser funktioniert border-radius: 10px; einwandfrei, und die Browser-spezifischen Deklarationen werden innerhalb der vorgegebenen Zeit veraltet sein.

Um den Grenzradius in IE6, 7 und 8 zu verwenden, versuchen Sie ms-border-radius js Bibliothek , obwohl ich es nicht getestet habe (und jemand hat geantwortet, dass es nicht funktioniert.) Meine persönliche Meinung ist, dass, wenn jemand immer noch diese Browser benutzt, das Internet wie ein seltsames und gruseliges aussehen muss legen Sie sie täglich auf, und so werden sie ihre abgerundeten Ecken nicht verpassen.

Beiseite: Die Methode, die Sie verwenden möchten, war besser geeignet, wenn CSS3 nicht so häufig unterstützt wurde. Es wurde während einer seltsamen Zeit des Internets geschaffen, als die Popularität von IE6 zahllose Webentwickler dazu trieb, stark nicht-semantische kreative Lösungen für ansonsten einfache Probleme zu finden. Vielen Dank, Internet Explorer, dass Sie sich ein paar Jahre Zeit genommen haben und den Fortschritt von Webdesign und -entwicklung verlangsamt haben.

    
Sandwich 31.12.2010, 02:33
quelle
2

Es gibt immer curvycorners auch, es verwendet native css für Geschwindigkeit, wenn der Browser es unterstützt oder greift auf Javascript zurück, wenn der Browser doesn 't.

    
David Hewitt 31.12.2010 02:37
quelle
2

Kann einfach mit abgerundeten Ecken von jQuery erstellt werden gerundete_ecke

%Vor%

Sie müssen sich keine Sorgen über Cross-Browser-Probleme mit dem jQuery-Ansatz machen.

    
A_Var 31.12.2010 03:39
quelle
1

Eine fantastische Zusammenfassung für alle gängigen Browser, die Ihnen erklärt, wie Sie jede Ecke oder alle Ecken abrunden:

Ссылка

    
Ben 31.12.2010 02:34
quelle
0

Stattdessen fügen Sie diesen Code in die Klasse ein, in der Sie abgerundete Ecken haben wollen. Es wird definitiv funktionieren.

%Vor%     
vikram 20.02.2013 06:50
quelle

Tags und Links