In diesem Codelab kannst du zeigen, wie du deine Inhalte am liebsten zentrierst Preisvergleichsportal.
In meinem Blogpost Centering in CSS (in CSS zentrieren) werden 5 von meine Lieblingsmethode zum Zentrieren in CSS. Oder schau dir dieses Video an!
Einrichtung
- Klicke auf Zum Bearbeiten Remix, damit das Projekt bearbeitet werden kann.
- „
app/index.html
“ öffnen - Ersetzen Sie bei
line 23
/* your centering CSS here /*
durch Ihr Preisvergleichsportal. - Optional: Benennen Sie die Zentrierungstechnik und ersetzen Sie den Text im Feld
<h1>
Stile
- Eine neue Datei im Ordner „
app/css/
“ erstellen - Erstellen Sie einen Selektor für Ihre Zentrierungslösung, z. B.
.turbo-center
oder[floaty-mcfloat]
- Schreiben Sie in den neuen Selektor Ihre Zentrierungstechnik (Sie können sich
der anderen in
app/css/
als Beispiele) - Optional: Unterstützungsstile angeben damit wir sehen können, welche Kinder um die Zentrierung zu unterstützen,
- Öffnen Sie
app/css/index.css
und importieren Sie Ihre neue Datei unten.
Alles zusammenfügen
app/index.html
wieder öffnen- Suchen Sie den
<article>
und weisen Sie ihm den benutzerdefinierten Selektor zu, den Sie in Schritt 2 der Anleitung erstellt haben. im vorherigen Abschnitt. - Tweete mich über deinen Glitch und ich werde ihn auf den Blogpost!