Was ist der Code für ein Quadrat?

Hallo ich muss im HTML(Mit der App Notepad++) eine Webseite programmieren, aber finde nirgends ein Code der mir verrät, wie man einen Quadrat hinbekommt. Also ein Quadrat und darin der bestimmte Text steht. Wollte fragen, ob mir jemand bitte einfach den Code zu einem Quadrat sagen könnte?

Answer 1

[regex9]

Hierfür eignet sich ein Blockelement. Die Höhe und Breite kannst du mit CSS beispielsweise über das style-Attribut festlegen. Damit man sieht, dass das Element quadratisch ist, wäre es nicht schlecht, zusätzlich eine Hintergrundfarbe oder einen Rahmen zu setzen.

<p style="border: 1px solid; height: 200px; width: 200px">Some text</p>

(...) aber finde nirgends ein Code der mir verrät, wie man einen Quadrat hinbekommt.

Eine HTML-Referenz findest du hier. Beachte, dass man bei HTML weniger visuell denkt. Die Elemente sollen hauptsächlich Daten (Texte, Bilder, u.ä.) in ihrer Bedeutung passend beschreiben. Ob sie dabei nun rund oder quadratisch aussehen, ist unwichtig.

Um den Elementen im Browser ein bestimmtes Aussehen zu verleihen, ist CSS da, welches auf unterschiedlichen Wegen in den HTML-Code eingebunden werden kann. Eine CSS-Referenz findest du ebenfalls auf MDN (hier).

Answer 2

[medmonk]

Hallo Luna,

dein Quadrat kannst du auf mehrere Wege umsetzen. Darunter gleiche Werte für die Höhe und Breite eines Elementes sowie mithilfe der CSS Eigenschaft aspect-ratio. Wie du es am besten umsetzt, hängt dann vom restlichen Kontext ab.

HTML:

<div class="square">
 <!-- text comes here... -->
</div>

CSS:

/* width and height values */
.square {
  width: 300px;
  height: 300px; 
  border: 1px solid;
}

/* aspect-ratio */
.square {
 aspect-ratio: 1;
 border: 1px solid;
}

/* combined properties */
.square {
  max-width: 50%;
  aspect-ratio: 1;
  border: 1px solid;
}

LG medmonk

Answer 3

[Xandros0506]

Nur am Rande.....

ich muss im HTML ... eine Webseite programmieren

HTML ist keine Programmiersprache, sondern eine Auszeichnungssprache, die dem Browser mitteilt, wie der Inhalt dargestellt werden soll. Entsprechend kann man damit auch keine Webseite "programmieren".