„Wenn ein Arbeiter seine Arbeit gut machen will, muss er zuerst seine Werkzeuge schärfen.“ – Konfuzius, „Die Gespräche des Konfuzius. Lu Linggong“
Titelseite > Programmierung > Das Odin-Projekt – Einführung in CSS

Das Odin-Projekt – Einführung in CSS

Veröffentlicht am 08.11.2024
Durchsuche:885

The Odin Project -Intro to CSS

Hallo ?,

Ich bin ein Frontend-Entwickler mit 3 Jahren Erfahrung. Ich wollte schon immer die Lücke in meinem Wissen schließen und ein Full-Stack-Entwickler werden. Ich habe mehrere Versuche unternommen, das Odin-Projekt zu starten, konnte es aber nicht konsequent durchziehen. Dieses Mal bin ich fest entschlossen, dabei zu bleiben und meine Fähigkeiten zu verbessern.

Um meine Fortschritte zu verfolgen, werde ich eine Reihe von Blogbeiträgen veröffentlichen, in denen ich meine Erkenntnisse aus den einzelnen Kapiteln des Odin-Projekts detailliert beschreibe. Betrachten Sie diese als meine Entwicklungstagebücher.

Ich werde die Themen hinzufügen, die ich gelernt habe, und Dinge teilen, die ich vorher nicht wusste.

Ich beginne mit CSS als HTML und all den einführenden Dingen, die ich zuvor gemacht habe oder die mir zumindest bekannt sind.

Gelernte Themen

  • Selektoren
  1. Universeller Selektor
  2. Typauswahl
  3. Klassenauswahl
  4. ID-Auswahl
  5. Gruppierungsauswahl
  6. Verkettungsauswahl
  • Kombinator Ich wusste zwar, wie man den Kombinator verwendet, aber dieser spezielle Begriff war mir nicht bekannt. Auch die Definition, dass es um eine Beziehung zwischen Selektoren geht, die nicht um deren Gruppierung oder Verkettung geht.
  • Absteigender Kombinator

Grundlegende CSS-Eigenschaften

  • Farbe, Hintergrundfarbe
  • Typografie
  1. Schriftfamilie und generische Schriftfamilie
  • Bildhöhe und -breite
    Eine weitere Sache, die ich hier gelernt habe, ist, dass es ratsam ist, in HTML immer sowohl Breiten- als auch Höhenattribute für Bilder anzugeben. Dadurch wird sichergestellt, dass der Browser beim Rendern der Seite den entsprechenden Platz für das Bild reserviert, wodurch unerwartete Verschiebungen im Inhaltslayout beim Laden von Bildern verhindert werden. Um das ursprüngliche Seitenverhältnis eines Bildes beizubehalten, können Sie nur das Breitenattribut ändern und die Höhe auf „Auto“ setzen. Dadurch wird die Höhe automatisch an die Proportionen des Bildes angepasst.

  • Externes CSS

  • Internes und Inline-CSS

Ich erinnere mich an einen Fall, als mein technischer Leiter unserem HTML Inline-CSS hinzufügte. Ich zögerte, seine Entscheidung in Frage zu stellen, da er ein erfahrener Profi war und ich noch relativ neu auf dem Gebiet war.

Jetzt verstehe ich jedoch, dass ein effektiverer Ansatz darin bestanden hätte, den Einsatz von Inline-CSS zu minimieren. Indem wir Inline-Stile auf diejenigen beschränken, die für die Funktion der Regel unbedingt erforderlich sind, können wir eine übermäßige Anwendung von Spezifität vermeiden und eine sauberere, besser wartbare Codebasis beibehalten.

Ich plane außerdem, einen wöchentlichen Podcast zu veröffentlichen, der die Dinge, die ich gelernt habe, noch einmal zusammenfasst.

Freigabeerklärung Dieser Artikel ist abgedruckt unter: https://dev.to/iamhrk/the-odin-project-intro-to-css-3opa?1 Bei Verstößen wenden Sie sich bitte an [email protected], um ihn zu löschen
Neuestes Tutorial Mehr>

Haftungsausschluss: Alle bereitgestellten Ressourcen stammen teilweise aus dem Internet. Wenn eine Verletzung Ihres Urheberrechts oder anderer Rechte und Interessen vorliegt, erläutern Sie bitte die detaillierten Gründe und legen Sie einen Nachweis des Urheberrechts oder Ihrer Rechte und Interessen vor und senden Sie ihn dann an die E-Mail-Adresse: [email protected] Wir werden die Angelegenheit so schnell wie möglich für Sie erledigen.

Copyright© 2022 湘ICP备2022001581号-3