Frage von Stagfarillah, 46

HTML/CSS Fragen: 1. Wie kann ich Bilder positionieren 2. Wie kann ich Links nebeneinander tun 3. Was ist ein Wrapper?

Hallo Ich habe kürzlich mit HTML/CSS angefangen zu arbeiten und habe manche Fragen. Wie kann ich die Position eines Bildes ändern z.B oben rechts/zentriert/unten links? -ich habe schon von margin,float, border gehört, aber verstehe das nicht mit Aussenabstand und so. Kann mir jemand das auf eine einfache Art und Weise erklären, so dass auch bei de rCoderiung ich einen Unterschied feststellen kann und nicht auswendig lernen muss,sondenr verstehen. 2. Wie kann ich zwei Links nebeneinander tun und wie kann ich den Unterschied zwischen den Beiden beeinflussen? 3. Was ist ein Wrapper, wofür brauch ich ihn und was bewirkt das div in ihn? Bitte keine Verlinkunfen auf der Seite Self-HTML, ich habe schon im Internet gesucht, aber nun schenke ich euch meinen Vertrauen.

Lieeber Gruss neverbecucessfull

Hilfreichste Antwort - ausgezeichnet vom Fragesteller
von medmonk, 21

Wie kann ich die Position eines Bildes ändern z.B oben rechts/zentriert/unten links? -

Seetz dich mit dem CSS Box und Flex-Modell auseinander. Wenn du das verinnerlicht hast, weißt du auch wie du einzelne Elemente beinah beliebig positionieren kannst.

Wie kann ich zwei Links nebeneinander tun und wie kann ich den Unterschied zwischen den Beiden beeinflussen?

Der Anker-Tag ist ein inline-Element. Daher werden Links (sofern nicht weiter verschachtelt) nebeneinander dargestellt.

Was ist ein Wrapper, wofür brauch ich ihn und was bewirkt das div in ihn?

Mit Wrapper ist ein Container gemeint, der andere Elemente beinhaltet. Ein solcher Container wird unter anderem zum Ausrichten verwendet. Um alles besser nachvollziehen zu können, bitte folgendes Buch lesen:

HTML5 Handbuch:

http://webkompetenz.wikidot.com/docs:html-handbuch

LG medmonk 

Antwort
von RakonDark, 14


Wie kann ich die Position eines Bildes ändern z.B oben rechts/zentriert/unten links?

Das hängt davon ab wo es sich befindet . Also welches Elternelement vorhanden ist .

Generell ist HTML ein Textfluss der von links oben Startet und dann nach rechts Unten Zeilenweise läuft.

Mann kann den Textfluss mit float aufheben bzw mit position arbeiten .

position:absolute ; ist von oben links beim BODY der Ausgangspunkt

mit float , wird innerhalb der Zeile an den Anfang(left) oder ans Ende(right) gesprungen , das folgende Umfliesst das ganze .

also Bild links oben wäre float:left; , wenn danach Text folgt , würde der netterweise das Bild umfliessen . Mehrere float:left auf Blockelemente bewirken das diese nicht untereinander dargestellt werden sondern nebeneinander (aber nur wenn genug platz ist, sonst gehts eine Zeile weiter )

mit margin erzeugt man den Abstand um das Element  , mit padding den Abstand innerhalb des Elements . Wobei hier bei Inline Elementen das etwas tricky ist und sich nicht immer der gewünschte Erfolg einstellt.

Das Problem um es zu verstehen, nennt sich Ausprobieren . Und ganz schlimm , viele Browser verhalten sich ganz anders bei gleichem CSS .

Generell sind wir auch alles keine genies , aber wir wissen wo wir nachschauen müssen . z.b. SelfHTML oder die vielen anderen W3C Scool . Einfach mal googeln und schauen was Du so als beste Referenz bzw Erklärung findest .


Kommentar von fluffiknuffi ,

Oder MDN. :'D

Antwort
von GoldenGiraffe, 21

Bilder positionieren mit img src

Links nebeneinander mit margin und padding...

Kommentar von Stagfarillah ,

Ja aber wie setze ich margin und padding ein?

Kommentar von GoldenGiraffe ,

Wie wäre es wenn du dich ein wenig mit der Auszeichnungssprache auseinander setzt? Oder willst du einfach nur Codes kopieren und einfügen? 

Bist doch kein Scriptkiddie??

Also google einfach nach den Begriffen und viel Spaß beim Lernen, homeboy :)

Kommentar von medmonk ,

Bilder positionieren mit img src

Mit dem img-tag werden Bilder lediglich eingebunden und hat mit der Positionierung so erst einmal nichts am Hut.

Links nebeneinander mit margin und padding...

Ein Anker ist ein inline-Element. Wird daher sofern nicht mit CSS formatiert nebeneinander dargestellt. 

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten