Siehe https://www.w3schools.com/html Abschnitt Layout
Hilfe
-
-
Dankeschön.
Weißt du hier auch Abhilfe?
Die Aufgabenstellung lautet so:
Lege ein Html Dokument an mit einem DIV Element und 3 darin liegenden Absatzelementen.
So wie ich das verstanden habe wäre das dann so:
<div> <br>
</br>
<p>
</p></div>
Aber 1. kenn ich nicht 3 Absatzelemente und 2. bin ich mir auch nicht sicher, ob das so richtig ist
-
ich vertstehe das so
<div>
<p>absatz1</p>
<p>absatz2</p>
<p>absatz3</p>
</div>
und <br> nutzt man heut zu Tage kaum noch .Abstände macht man mit css mit margin oder so.
Das <p> mach von sich aus schon einen neuen Absatz weil ist ja ein Absatzelement.
-
Das sieht schon logischer aus, danke!
Und danke wegen der Info mit dem br.
Wenn ich den teilen jetzt eine Klasse zu ordnen möchte, wäre das so oder?
<div>
<p class=hm1>absatz1</p>
<p class=hm2>absatz2</p>
<p class=hm3>absatz3</p>
</div>
und im head würde das so aussehen?
#hm1 {
...
Wäre es möglich, mir den Unterschied zwischen Class und ID zu erklären? Gelesen hatte ich, dass ID benutzt wird wenn der darauffolgende Text einzigartig ist und class, wenns mehrmals vorkommt. Hab ich das class dann richtig genutzt oder wäre das eig. n ID?
Und im head hab ich dann für den id/class tag einmal die methode mit dem # gesehen aber auch mit dem . (Punkt) Was ist da der unterschied? Tut mir leid dass ich soviel frage, versuch nur die Informationen zu bekommen, die mein Lehrer mir nicht vermitteln kann
-
Ich kann die Fähigkeiten deines Lehrers nicht wirklich einschätzen - vielleicht hat er sich nur falsch ausgedrückt. Ein Absatzelemet gibt es nicht im HTML... oder er meint tatsächlich den <p> (von engl. Paragraph - also ein Text-Absatz) .
Nur was soll dann der Schwachsinn, diesen Tag 3 mal zu wiederholen.. das ist ungefähr so wie - schreibe 10 mal 'ich will immer artig sein!
Er meint bestimmt Blockelement - da würde er Sinn machen, den Blockelemente gibt es reichlich.
-
Zitat
Nur was soll dann der Schwachsinn, diesen Tag 3 mal zu wiederholen..
??? Ein längerer Text kann ohne weiteres aus mehreren Absätzen bestehen. Was soll daran verkehrt sein?
Und "Absatz" ist bloß die Übersetzung von "paragraph" - was soll gegen die Verwendung sprechen? SelfHTML benutzt den Betriff auch:
-
Hallo AriaSin,
Dein Code oben ist auch mir nicht klar. Hast Du den den schon mal ausprobiert?
Kann mir nicht vorstellen, dass das so funktioniert:
class="hm1"sollte es wohl sein. Wenn Du dann die Klasse definiert hast, sollte die Klasse im CSS code dann so weiter gehen:
.htm {
.......}
Was der Code aber mit dem div tag bezwecken soll ist mir immer noch unklar. Wirf doch mal die komplette, originale Aufgabenstellung hier rein.
-
Was nun die richtige Interpretation von ...'3 darin liegenden Absatzelementen'... ist, kann dann wohl nur der Lehrer beantworten. Die Frage ist aber hier wenig hilfreich, denn der nächste Punkt, Zuweisung von Klasse oder ID, trifft ja auf alle Elemente zu.
dein Ansatz ist richtig
<div>
<p class="hm1">absatz1</p>
<p class="hm2">absatz2</p>
<p class="hm3">absatz3</p>
</div>
nur solltest du die zugeordnete Klasse(n) in Anführungszeichen setzen. Ist zwar wenn nur eine Klasse zugewiesen wird nicht so entscheidend, aber man kann dort auch mehrere Klassen (class="hm1 rot rechts") angeben und dann führen fehlende Anführungszeichen zu Fehlern.
Im <head>...</head> muss dann die Klasse mit einem führenden . definiert werden!
<style>
.hm1 {
... ;
}
.hm2 {
... ;
}
</style>
Mit einem führenden # wäre es eine ID, die definiert wird.
-
Aber nie verwechseln so ist gut
so auch
aber bei ids darf es nur so sein
Niemals so
Ist am anfang vieleicht verwirrend ,aber doch wichtig.Weil wenn es eine ID Doppelt gebe dann könnte js und Css nicht richtig laufen.
Was heißt könnte? Es WIRD NICHT fehlerfrei laufen
-
Sieht gut aus.Mir fällt jetzt nix auf was man ändern könnte bzw besser machen kann.
Wenn du mal selbst nicht weiß ob was richtig ist ,könnte dir der https://validator.w3.org/ Validator helfen.
Da kopiers du deinen link oder Code rein und der sagt dir dann schon einiges .
Demnach bemängelt er das
<style type="text/css">
Weil sollte so sein
<style>
Und das
<html>
sollte
<html lang="de">
Dann ist der validator zufrieden.
Wie weit man danach gehen sollte weiß ich nicht ,aber jeder kuckt danach und macht die Fehler auch weg was da gesagt wird.
Also verkehrt kann es wohl nicht sein
-
Was ist der Unterschied an den ganzen em, px, %? Wann weiß ich was ich benutzen muss oder ist das eine Frage des Auswendiglernens?
Kennt ihr außer Flexbox und Float noch andere möglichkeiten, mit denen man die 3 Absätze von oben nebeneinander stellen kann? Mit dem Code von oben sind die ja untereinander
Und ich versteh nicht ganz wie display:flex funktioniert? Muss das in den body oder header? Muss ich davor noch irgendwas schreiben, damit er die <p> Absätze nebeneinander anordnet?
Ich muss auch ein klassisches CSS Modul nennen, welches mehrspaltige Textsatz ermöglicht. Wäre column-count eins?
-
Was ist der Unterschied an den ganzen em, px, %? Wann weiß ich was ich benutzen muss oder ist das eine Frage des Auswendiglernens?
Siehe z.B. https://wiki.selfhtml.org/wiki…9Fe_und_Ma%C3%9Feinheiten
-
Zitat
Kennt ihr außer Flexbox und Float noch andere möglichkeiten, mit denen man die 3 Absätze von oben nebeneinander stellen kann? Mit dem Code von oben sind die ja untereinander
Dass sie untereinander angeordnet werden liegt daran, dass es p-Elemente sind, diese belegen standardmäßig eine neue Zeile. Inline-Elemente wie img oder span werden dagegen standardmäßig nebeneinander angeordnet. Du kannst es testen, indem Du entweder den Tagnamen in span änderst oder den Elementen ein display:inline oder display:inline-block gibst. Womit wir bei einer dritten Möglichkeit wären, Elemente nebeneinander anzuordnen.
Ich empfehle, der Option mit flex Priorität zu geben, weil man dann viele Möglichkeiten hat, die Elemente anzuordnen und festzulegen, wie sie den Platz füllen.
-
4. möglichkeit GRID
Aber du solltest erstmal wie Sempervivum sagt es mit Flex versuchen,da du gerade am anfang bist ist das auch leichter.Finde ich zumindest
-
Könnt ihr mir aus eurer persönlichen Erfahrung Vorteile von Float und Inline-Block sagen? Zu inline block hab ich, dass es responsive ist aber das wars dann auch. Sonst hab ich nur etliche negative Aspekte
-
mit floar arbeitet man kaum noch.
man kann damit wunderbar texte um bilder fliesen lassen.Oder wer faul ist das mit flexboxen zu machen schreibt einfach float rein damit die box links ist oder so.
Bilder um fliesen lassen mache ich mitlerweile mit shapes ,da hat man paar mehr möglichkeiten mit.
Ich würde dir sagen bleib bei flex layout,damit läst es sich auch mit den reponsiv machen viel einfacher arbeiten als wie mit float kram und so was
-
Hey,
hast du schon die Pfade überprüft ob diese richtig sind?
Wie sieht deine Ordnerstruktur zu den Bilder aus?
Damit sich die Bilder nicht wiederholen:
https://www.w3schools.com/cssref/pr_background-repeat.asp
Zitat
dann muss ich ihnen noch die Position bottom center, top right und top left gebenWenn dies der Fall ist müsstest du auf die Bilder entweder position: relative oder position:absolute anwenden.
Grüße,
Stef
-
Nein, so wie Du es jetzt hast, sind es keine Hintergrundbilder. Lies hier, wie es geht:
http://wiki.selfhtml.org/wiki/…ergrundfarben_und_-bilder
Du wirst background-image, background-position und background-repeat brauchen.
-
Oh tut mir leid also die Bilder sollen IN die Div box als Hintergrund
also kann ich das dann so schreiben
<div><img src=....> ?
Ah, ich hasse diese Aufgabe. Wie kann man erwarten dass ich das innerhalb von 8 Unterrichtsstunden alles drauf habe und google verwirrt mich nur
-
Zitat
<div><img src=....> ?
Nein, wie ich schon schrieb, sind es dann keine Hintergrundbilder. Lies meinen Link, dort ist beschrieben, wie es geht.
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!