Ecken o.ä. zeichnen mit purem HTML
kniff
- html
Hallöle,
ich habe hier vor einigen Monaten mal einen Link zu einer Seite gesehen, wo Ecken oder irgendwelche Formen ausschließloch mit HTML und glaub bissl CSS umgesetzt wurden. Weiß zufällig jemand, was mir da gerade im Kopf rumschwirrt?
Ich frage, weil ich gerade überlege, wie ich eine Box mit runden Ecken umsetze - ja die Lösung von SelfHTML ist mir Bekannt oder eine feste px-Größe vorraussetzen, aber das beliebt mir beides nicht. Warum mir zweiteres nicht beliebt dürfte klar sein, ersteres beliebt mir nicht, da es mich irgendwie stört für eine Runde Box eine div-Suppe coden zu müssen. (Ok mit obiger Methode würde sich die div-Suppe wohl nicht verringern, aber das fiel mir auf der Suche nur ein.)
Welche Möglichkeiten gibt es denn noch runde Ecken zu gestalten ohne für jede Box 3-4 divs zu benötigen?
Gruß
Hallo!
Welche Möglichkeiten gibt es denn noch runde Ecken zu gestalten ohne für jede Box 3-4 divs zu benötigen?
Außer zum Teil nur spärlich unterstützten CSS-Attributen wie -webkit-border-radius und -moz-border-radius bleibt nur noch JavaScript, es sei denn, Du willst Dich in Hinsicht auf Höhe oder Breite auf einen Wert festlegen.
Gruß, LX
Yerf!
Welche Möglichkeiten gibt es denn noch runde Ecken zu gestalten ohne für jede Box 3-4 divs zu benötigen?
Eigentlich nur eine: auf border-radius warten. Ein paar Browser könnens ja schon. Die Varianten für Grafiken per HTML die ich kenne produzieren alle noch einen viel wüsteren DIV-Verhau, im Extremfall ein DIV pro Pixel...
Obwohl: das wäre eigentlich eine schöne Anwendung für SVG, aber da weigert sich ja MS auch standhaft, das in den IE einzubauen...
Gruß,
Harlequin
Hello,
Eigentlich nur eine: auf border-radius warten. Ein paar Browser könnens ja schon. Die Varianten für Grafiken per HTML die ich kenne produzieren alle noch einen viel wüsteren DIV-Verhau, im Extremfall ein DIV pro Pixel...
Du meinst so? http://selfhtml.bitworks.de/grafik/sinus.php
Obwohl: das wäre eigentlich eine schöne Anwendung für SVG, aber da weigert sich ja MS auch standhaft, das in den IE einzubauen...
jo mei, könne ma da nicht moa interveniere?
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
jo mei, könne ma da nicht moa interveniere?
"HI
Ihr System wurde gekapert.
Genug ist genug.
Ab sofort kann ihr MSIE runde Ecken.
mfg
Volksfront für mehr Porc-Elan!
[ ] Die Meldung, weil's so schön ist, bitte nochmals anzeigen."
mfg Beat
Also aufgrund von Ideologie, drohender div-Suppe und unschönem Code auf runde Ecken bzw. in irgendeiner Form gestylte Boxen verzichten?
@@kniff:
nuqneH
ich habe hier vor einigen Monaten mal einen Link zu einer Seite gesehen, wo Ecken oder irgendwelche Formen ausschließloch mit HTML und glaub bissl CSS umgesetzt wurden. Weiß zufällig jemand, was mir da gerade im Kopf rumschwirrt?
CSS 3: ‘border-radius’ properties
Bisher in Firefox und Webkits in Form von proprietären Eigenschaften implementiert, Opera und und IE bekommen halt eckige Ecken. Geht deshalb die Welt unter?
Qapla'
[latex]Mae govannen![/latex]
Welche Möglichkeiten gibt es denn noch runde Ecken zu gestalten ohne für jede Box 3-4 divs zu benötigen?
Willst du reine runde Ecken, d.h. ohne Bilddatei? dann hilft dir bei neuen Browsern border-radius bzw ein wenig SVG
http://my.opera.com/Fyrd/blog/2007/09/10/css-svg-rounded-corners-for-multiple-browsers
Diverse Browser schauen allerdinsg in die Röhre, dafür bleiben dann nur solche verschachtelten Lösungen.
Cü,
Kai
[latex]Mae govannen![/latex]
Welche Möglichkeiten gibt es denn noch runde Ecken zu gestalten ohne für jede Box 3-4 divs zu benötigen?
Und dann gibt es natürlich noch die brutale Methode. ;)
Cü,
Kai
Hi,
ok mit border-radius mache ich ja nichts kaputt?!
Dann werde ich wohl dies benutzen, gibts da eine Übersicht, welche Browser das unterstützen? Wird eventuell eine Lösung mit border-image besser unterstützt?
Für den IE könnte ich ja dann innerhalb von conditional-comments die div-Suppe einfügen? Und für andere Browser dies nicht unterstützen, falls es für die conditional comments gibt ... aber eigtl ist das nicht sonderlich schön ...
gruß
[latex]Mae govannen![/latex]
ok mit border-radius mache ich ja nichts kaputt?!
Nein. Browser, die das nicht kennen, überspringen diese Deklaration dann einfach[wenn sie spezifikationsmäßig arbeiten].
Dann werde ich wohl dies benutzen, gibts da eine Übersicht, welche Browser das unterstützen? Wird eventuell eine Lösung mit border-image besser unterstützt?
Eher schlechter. Das ist alles noch nicht offiziell spezufiziert, aber man arbeitet dran
Für den IE könnte ich ja dann innerhalb von conditional-comments die div-Suppe einfügen?
So viel Zusatzaufwand nur für IE? Dann kannst du auch direkt mit den verschachtelten divs für alle Browser arbeiten.
Und für andere Browser dies nicht unterstützen, falls es für die conditional comments gibt
CC gibts nur bei IE
Cü,
Kai
Hi kniff!
ich habe hier vor einigen Monaten mal einen Link zu einer Seite gesehen, wo Ecken oder irgendwelche Formen ausschließloch mit HTML und glaub bissl CSS umgesetzt wurden. Weiß zufällig jemand, was mir da gerade im Kopf rumschwirrt?
Klingt nach Slants
Hat aber wenig mit runden Ecken zu tun.
MfG H☼psel