HTML & CSS: Schnellreferenz für Web-Grundlagen

HTML & CSS – Schnellreferenz

HTML strukturiert Inhalte, CSS gestaltet sie. Zusammen bilden sie das Fundament jeder Website – auch dieser.

HTML-Grundgerüst

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <title>Meine Seite</title>
</head>
<body>
    <h1>Überschrift</h1>
    <p>Ein Absatz mit <a href="https://...">Link</a>.</p>
</body>
</html>

Wichtigste HTML-Tags

Tag	Bedeutung
`<h1>–<h6>`	Überschriften
`<p>`	Absatz
`<a href="/...">`	Link
`<img src="/...">`	Bild
`<ul> / <li>`	Liste
`<table>, <tr>, <td>`	Tabelle
`<div>, <span>`	Container
`<form>, <input>`	Formular

CSS-Selektoren

/* Element */
p { color: #333; }

/* Klasse */
.card { border: 1px solid #ccc; }

/* ID */
#header { background: #1C5E66; }

/* Verschachtelt */
.card h2 { font-size: 1.5rem; }

Flexbox

.container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

CSS Grid

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

Responsive Design

@media (max-width: 768px) {
    .container { flex-direction: column; }
}

Verwandt: JavaScript · PHP · DNS