Runde Rahmenecken [Netscape und Mozilla]


Rahmen sind mit der Zeit langweilig. Wie wäre es desshalb mal damit die Ecken abzurunden? Geht nicht? Doch!
Netscape und Mozilla stellen die Ecken rund da, wenn man dem jeweiligen Element ein bestimmtes Styleattribut hinzufügt.


Beim Stöbern über eine CSS Seite bin ich darauf gestoßen und es sieht einfach nur geil aus! Ist mal etwas anderes =)

Code:
.rund {
border: 3px solid #FF0000;
background-color: #FFFF00;
-moz-border-radius: 20px;
}


die Bedeutung der Klassenelemente:
Code:
border:3px solid #ff0000;

das Attribut Boarer hat 3 Parameter:
dicke des Rahmens, Rahmentyp und Rahmenfarbe

Code:
-moz-border-radius:30px;

-moz-boarder-radius ist eine Art Filter und hat nur einen Parameter: den Radius der abgerundeten Ecke.


Das ganze kann so benutzt werden:
Code:
<table class="rund">
<tr>
<td>...</td>
</tr>
</table>


So sieht das ganze aus (für alle IE und Opera Nutzer):
Bild, URL: http://coolklicks.de/tutorials/yubb/roundboarders/roundboarders.jpg

und für alle Mozilla/Firebird und Netscape Nutzer:
L I V E - D E M O (http://coolklicks.de/tutorials/yubb/roundboarders)

Bemerkung: im IE werden die Ecken normal dargestellt, wenn mandas auf der Seite nutzen sollte, nur mit Mozilla/Firebird und Netscape werden sie rund dargestellt. Man kann diesen Effekt also ohne Probleme für die paar wenigen nicht IE-Nutzer einbauen.Geschrieben von michi am 18.06.2004 (6803x gelesen)
Diese News stammt von der Seite http://www.yubb.de
Sie ist unter http://www.yubb.de/artikel433.html direkt aufrufbar.

Jegliche Reproduktion dieser Seite oder ihrer Inhalte ist strengstens untersagt.