Ecken abrunden

Fragen zu allen Themen rund ums Programmieren außerhalb von phpBB können hier gestellt werden - auch zu anderen Programmiersprachen oder Software wie Webservern und Editoren.
P7BB
Mitglied
Beiträge: 383
Registriert: 15.07.2008 19:40

Ecken abrunden

Beitrag von P7BB »

Hallo,
wie kann ich denn eine Art Rahmen um meine Homepage machen, der abgerundete Eckenhat? Wenn es geht, sollte es kein Bild sein, die Gründe dafür kennt bestimmt jeder (kann bei längeren Texten zu Verschiebungen führen, etc.)

Edit: Wo ich grad so den Banner hier seh:
[ externes Bild ]
Da sind die Ecken ja abgerundet... ich möchte praktisch das gleiche, aber natürlich innerhalb von diesem feld noch mit php und javascript arbeiten... ;) aber eben nicht als bild, sondern mit html-technischen mitteln...
Benutzeravatar
gn#36
Ehrenadmin
Beiträge: 9313
Registriert: 01.10.2006 16:20
Wohnort: Ganz in der Nähe...
Kontaktdaten:

Beitrag von gn#36 »

Wie das geht kannst du dir beim phpBB 3 abgucken. Im Prinzip musst du "nur" an den Stellen an denen normalerweise die spitzen Ecken liegen teiltransparente Bilder hinlegen die eine runde Ecke enthalten. Wenn du Firefox nutzt dann schau dir einfach mal per Firebug die Stellen an an denen runde Ecken genutzt werden. (Und wenn nicht, dann besorg ihn dir, früher oder später musst du sowas nämlich sowieso mit mehreren Browsern testen).
Begegnungen mit dem Chaos sind fast unvermeidlich, Aber nicht katastrophal, solange man den Durchblick behält.
Übertreiben sollte man's im Forum aber nicht mit dem Chaos, denn da sollen ja andere durchblicken und nicht nur man selbst.
P7BB
Mitglied
Beiträge: 383
Registriert: 15.07.2008 19:40

Re: Ecken abrunden

Beitrag von P7BB »

Sry, dass ich diesen Thread ausgrabe, aber ich bekomm das einfach nicht hin...
Ich habe folgendes Bild:
http://www.LupiUpload.de/file.php?dat=BMHMEjlZ.png

Das dort abgebildete Bild hat einen blauen Rand mit runden ecken. An den Ecken selbst ist ein Stück nicht durchsichtig, allerdings ist der Hauptteil schon durchsichtig.
Wenn ich jetzt versuche, das ganze mit runden Eckn hinzubekommen, funktioniert eine Ecke einwandfrei, 2 Ecken durchkreuzen sich irgendwie selbst und eine Ecke ist ganz blau. Kann mir jemand vllt einen Beispielcode posten?

Edit: Ich hab das nun anders gelöst. :) Aber wo ich hier grad schon einen Thread offen hab:
wie kann ich den Abstand zwischen zwei <tr> abschalten? also die obere zeile hat sowohl in FF als auch im IE einen kleinen Abstand zur nächsten Zeile. Das ist aber nicht ganz praktisch für mich... Es gibt bestimmt eine Möglichkeit, das irgendwie abzuschalten, oder? :)
Boecki91
Ehemaliges Teammitglied
Beiträge: 4744
Registriert: 18.06.2006 15:21

Re: Ecken abrunden

Beitrag von Boecki91 »

Tabellen für das Gestallten einer Webseite sind mehr so modern, man benutzt mittlerweile div und co

Aber Hier die Lösung:
http://forum.de.selfhtml.org/archiv/2005/1/t100155/
Standart: Am besten mit beiden Beinen auf dem Boden
Standardmäßig antworte ich nicht auf PMs
P7BB
Mitglied
Beiträge: 383
Registriert: 15.07.2008 19:40

Re: Ecken abrunden

Beitrag von P7BB »

Danke.
Naja ich benutze lieber die Tabellen, weil ich das persönlich am einfachsten finde... Aber ist ja jedem selbst überlassen :) ;)
Benutzeravatar
gn#36
Ehrenadmin
Beiträge: 9313
Registriert: 01.10.2006 16:20
Wohnort: Ganz in der Nähe...
Kontaktdaten:

Re: Ecken abrunden

Beitrag von gn#36 »

Runde Ecken sind in meinen Augen per Div und Span allerdings deutlich leichter zu realisieren, da du immer zwei verschachtelte Elemente brauchst um das zu realisieren (schau dir mal den Quellcode dieser Seite an, da wird das mit den Runden Ecken ja auch an einigen Stellen gemacht. Im Prinzip nichts anderes als die Ecken als Hintergrundgrafik des inneren Elements und die Hintergrundfarbe im äußeren Element (das dann von den Ecken überdeckt wird).
Begegnungen mit dem Chaos sind fast unvermeidlich, Aber nicht katastrophal, solange man den Durchblick behält.
Übertreiben sollte man's im Forum aber nicht mit dem Chaos, denn da sollen ja andere durchblicken und nicht nur man selbst.
P7BB
Mitglied
Beiträge: 383
Registriert: 15.07.2008 19:40

Re: Ecken abrunden

Beitrag von P7BB »

ich hab mich ein bisschen doof ausgedrückt... meine seite hat nun eine statische größe von 1000px... das hab ich mit einer tabelle gemacht. Nun kann ich ein einfaches Hintergrund-Bild benutzen, welches auch 1000px breit ist und ich hab meine Runden Ecken.
So ist der Kopf der Homepage nun eine Tabelle, die 1000px breit und 100px groß ist. Nun habe ich ein weiteres <tr> gemacht, um danach den rand (ebenfalls ein pic mit der größe 1000 px) darzustellen. Doch leider ist bei dem Übergang von der einen Zeile zur nächsten Zeile ein kleiner weißter rand. Der stört natürlich... Ich wweiß aber ncith wie ich den wegbekommen soll... Boecki91s Link hat mir leider nicht geholften :'(
Doktor Smile
Gesperrt
Beiträge: 56
Registriert: 08.01.2009 14:53

Re: Ecken abrunden

Beitrag von Doktor Smile »

Um ganz ehrlich zu sein verstehe ich das auch nicht so ganz,
wie das mit den DIVs geht.

Problem ist bei mir irgendwie immer:
Wenn ich eine Spalte verschieben will musste ich bei Tabellen nur "<td>" und dann den Inhalt inklusive schließendem Tag dort hinsetzen, wo es hin soll.

Bei den DIVs läuft das irgendwie soweit ich weiß auch noch alles über die CSS Dateien undso.
Wenn ich mal eine ganze Spalte verschieben will, verschob sich immer nur der obere Teil, und hinterher war es nur ein Chaos.

Was ist an Tabellen nicht modern?
ich meine warum soll man immer kompliziert programmieren, wenn man es doch ganz einfach haben kann?
Tabellen finde ich auch, sind die einfachste Möglichkeit,
warum diese nicht auch verwenden?
herzliche Grüße
Dr. :)

Die Wahrheit über phpBB.de:
Wacht auf!

http://www.phpbb.de/community/viewtopic ... 0#p1072780
Benutzeravatar
gn#36
Ehrenadmin
Beiträge: 9313
Registriert: 01.10.2006 16:20
Wohnort: Ganz in der Nähe...
Kontaktdaten:

Re: Ecken abrunden

Beitrag von gn#36 »

Wenn du sie einmal verstanden hast sind Divs viel einfacher als Tabellen, zumindest in meinen Augen. Da musst du nämlich dann am HTML gar nichts mehr ändern und kannst sie trotzdem verschieben. Es gibt so viele Tutorial Seiten die dir ein mehrspaltiges Layout mit Divs liefern. Du kannst auch Divs pixelgenau platzieren wenn du willst, alles was du kennen musst sind ein paar CSS Befehle. Der Vorteil gegenüber Tabellen ist, dass Divs für die meisten Inhalte barrierefreier sind als Tabellen (stell dir vor, dir wird der Inhalt einer Seite vorgelesen, inklusive der Tatsache, dass bestimmte Daten in Tabellenform vorliegen. Bei Tabellen als Layoutmittel verstehst du irgendwann aufgrund der vielen verschachtelungen nichts mehr, bei Divs dagegen kommen nur dann Tabellen vor, wenn sie auch wirklich gebraucht werden).

Ein ganz akzeptables anfängertutorial hier arbeitet sich schrittweise durch und das Endresultat braucht keine Tabellen für das Layout. Klar, das wird nicht genau so aussehen wie du es dir wünscht, aber man sieht dass es eigentlich nicht schwierig ist wenn du damit fertig bist.
Begegnungen mit dem Chaos sind fast unvermeidlich, Aber nicht katastrophal, solange man den Durchblick behält.
Übertreiben sollte man's im Forum aber nicht mit dem Chaos, denn da sollen ja andere durchblicken und nicht nur man selbst.
piero
Mitglied
Beiträge: 476
Registriert: 10.11.2008 17:15
Wohnort: Schweiz

Re: Ecken abrunden

Beitrag von piero »

tabellen sind für tabellarische daten da und nicht fürs design ;)
wäre dann sowas wie wenn du aus einer Vase trinken würdest :P
Semantischer Code
Antworten

Zurück zu „Coding & Technik“