Schneller Start für das Erlernen von HTML-Grundlagen | Laurence Svekis | Skillshare

Playback-Geschwindigkeit


  • 0.5x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 2x

Schneller Start für das Erlernen von HTML-Grundlagen

teacher avatar Laurence Svekis, Best Selling Course Instructor

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu jedem Kurs
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Eine Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu jedem Kurs
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Eine Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

15 Einheiten (1 Std. 17 Min.)
    • 1. Promo

      1:26
    • 2. HTML

      2:36
    • 3. Einführung in HTML

      2:29
    • 4. HTML

      4:13
    • 5. HTML-Struktur

      3:19
    • 6. HTML vs Tags Abstände von p-Tags

      4:10
    • 7. HTML

      2:47
    • 8. HTML-Kurs Linie bricht nesting

      3:18
    • 9. HTML

      4:14
    • 10. HTML-Kurs Hyperlinks

      8:10
    • 11. HTML-Kurs wie man Bilder zu HTML-Seiten fügt

      6:14
    • 12. HTML-Listen Typen

      8:59
    • 13. HTML Divs Spannt neue HTML5-Struktur

      10:31
    • 14. HTML-Kurs mit CSS verwandeln deinen HTML in eine Webseite

      10:42
    • 15. Wenden Sie an, was wir in dem Kurs gelernt haben

      3:26
  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Alle Niveaus

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

193

Teilnehmer:innen

--

Projekte

Über diesen Kurs

Schneller Start für das Erlernen von HTML-Grundlagen

aaa1b2fb


Einfaches Beispiel für HTML-Tags und wie du sie
use mit diesem einfachen geradlinigen HTML-Kurs eine Website von Grund auf zu erstellen. Wenden Sie gemeinsame HTML-Tags an, die Sie wissen müssen, um Websites erstellen zu können. Perfekt für Anfänger, die neu in HTML sind und die gemeinsame HTML-Tags verwenden möchten, um Websites zu erstellen.

Beginnen Sie von vorne mit dabei, wie du eine grundlegende HTML5 strukturierte Website erstellen kannst.


Top um dir schnell zu bewirkenHTML5 Web-Seiten
Strukturelemente und
quicklyHTML5 mit Kommentaren
zu
get und wie du Elemente
quicklyHTML5
erstellen zum Verbinden von Inhalten
contentadd du mit Listen arbeiten
listsUsing von Divs und Spanen in HTML5 Elementen in
HTML5 Elementen
nest du deinen
HTML-Code mit dem Styling
nest top und Quellcode aus dem Kurs werden bereitgestellt, damit du direkt am Kurs mit dem Code arbeiten kannst.

Ich helfe dir dabei HTML zu lernen und bereit für alle Fragen die du vielleicht hast. Ich habe mehr als 15 Jahre Erfahrung in der realen Welt in der Webentwicklung, die ich in diesem Kurs mit dir teilen
will ist eine infrage kommende Fertigkeit und überall
used zu verlieren, es gibt ein 100% Geld zurück, wenn du es nicht
like mehr wissen, was wartest du auf den ersten Schritt gehen. Jetzt beitreten und noch heute HTML lernen.

Triff deine:n Kursleiter:in

Teacher Profile Image

Laurence Svekis

Best Selling Course Instructor

Kursleiter:in

Web Design and Web Development Course Author - Teaching over 1,000,000 students Globally both in person and online.    Google Developer Expert since 2020 GDE

I'm here to help you learn, achieve your dreams, come join me on this amazing adventure today
Google Developers Expert - GSuite

Providing Web development courses and digital marketing strategy courses since 2002.

Innovative technology expert with a wide range of real world experience. Providing Smart digital solutions online for both small and enterprise level businesses.

"I have a passion for anything digital technology related, enjoy programming and the challenge of developing successful digital experiences. As an experienced developer, I create... Vollständiges Profil ansehen

Kursbewertungen

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%
Bewertungsarchiv

Im Oktober 2018 haben wir unser Bewertungssystem aktualisiert, um das Verfahren unserer Feedback-Erhebung zu verbessern. Nachfolgend die Bewertungen, die vor diesem Update verfasst wurden.

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen bei Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Promo: lernen, eine Website von Grund auf neu zu erstellen mit dem einfachen, unkomplizierten HTML-Kurs perfekt für Anfänger, die neu in HTML sind und mehr darüber erfahren möchten , wie man gängige HTML-Tags verwendet, um ihre Websites von Grund auf neu beginnen zu lassen. Erfahren Sie, wie Sie eine grundlegende HTML strukturierte Website Talk-Ressourcen erstellen, damit Sie schnell loslegen können . Jedes Team von fünf Webseitenstruktur diskutiert HTML-Tags Elemente Abstand, wie Kommentare verwenden , Zeilenumbrüche, wie Verschachtelung von Elementen zu tun, jeweils zwei mil Überschriften Erstellen von Hyperlinks, um Inhalte zu verbinden. Wie man Bilder hinzufügt, wie man mit Listen arbeitet Welche dibs Spannweiten werden für HTML und brandneue HTML fünf Elemente verwendet. Und schließlich, wie Sie Ihren HTML-Code mit Styling in eine tatsächliche Website umwandeln können. Alle wichtigsten Ressourcen und Quellen, die für diesen Kurs bewertet wurden, werden bereitgestellt, damit Sie beide üben können mit dem Code zu arbeiten, der innerhalb des Kurses bereitgestellt wird. Ich bin hier, um dir zu helfen, Mel zu lernen und bereit. Beantworten Sie alle Fragen, die Sie mit über 15 Jahren Real World Web Development Erfahrung haben , die ich hier bin, um mit Ihnen in diesem Kurs zu teilen, HTML ist eine gefragte Fähigkeit. Es wird überall dort verwendet, wo man nichts verlieren kann. Es gibt 100% Geld-zurück-Garantie. Möchten Sie mehr wissen? Worauf wartest du? Machen Sie den ersten Schritt. Jetzt beigetreten, um HTML heute zu lernen. 2. HTML: Willkommen zu unserer Schnellstart-Einführung in HTML, die alle HD Mel B sechs vorstellen, die Sie wissen müssen, um eine Website wie diese zu erstellen . Dies wird also tatsächlich das Endprodukt aller verschiedenen HTML-Codes sein, die wir betrachten werden und wir werden während dieses Kurses lernen. Mein Name ist Lawrence, und ich werde dein Lehrer für diesen Kurs sein. Ich bin seit über 15 Jahren Webentwickler. Ich habe an Hunderten von Websites gearbeitet und auch viele Webanwendungen entwickelt. Also werde ich Sie durch, wie Sie anfangen, Websites mit HTML zu erstellen und dann einige CSS-Zehe anzuwenden, tatsächlich ein schönes Aussehen und Gefühl für Ihre HTML-Inhalte zu bekommen. Der erste Teil dieses Kurses führt Sie in die HTML-Struktur ein. Also, wie Sie Ihre grundlegende HTML-Seite einrichten und strukturieren, einschließlich HTML-Tags Überschrift Tags Titel führen Sie uns auch, wo Styling-Informationen platzieren , und dann werden wir über alle verschiedenen Elemente sprechen, die verfügbar sind in allen verschiedenen Tags, die in HTML verfügbar sind. Wir werden uns also all die verschiedenen gängigen Tags ansehen, die regelmäßig alles verwenden würden, von Absätzen bis Zeilenumbrüchen, wie man Bilder einfügt, wie man Bilder einfügt, wie man Überschriften für Ihre Website und Ihre Webinhalte einrichtet. Außerdem werden wir Hyperlinks diskutieren, wie Hyperlinks einzurichten hatte sie in Ihrem Code enthalten , wie Listen auf geordnete Listen und geordnete Listen zu erstellen. Und auch werden wir uns ansehen, wie man Styling anwendet und verschiedene Attribute auf HTM ein Gericht . Dann werden wir uns die Spannweiten und Dibs ansehen, und wir werden uns die neue Struktur von HTML fünf Webseiten ansehen, in der wir jeweils spezifische Tags verwenden , um Inhaltsinformationen zu enthalten und unsere Webseiten besser zu strukturieren . Und dann, schließlich, werden wir CSS zu allem, was wir gelernt haben, um eine vollständige und vollständige Website zu erstellen . Der gesamte Quellcode und die Ressourcen sind in diesem Kurs enthalten. Um Ihnen zu helfen, besser durch die Inhalte zu gehen und lernen, die im Kurs präsentiert werden . Also, wenn Sie bereit sind, fangen wir an, einige HTML-Code zusammen zu erstellen und zu schreiben 3. Einführung in HTML: Herzlich willkommen zu unserem Einführungskurs zu HTML. HTML steht für Hypertext-Markup-Sprache, und es ist die Sprache des Web. Also hier haben wir ein Beispiel, wie Standard-HTML-Code aussieht. Und in diesem Kurs werde ich durchlaufen, wie Sie HTML-Code schreiben können sowie Webseiten erstellen und wie Sie Ihre Webseiten so strukturieren, dass sie richtig strukturiert sind, um durch Browser gelesen zu werden . Im Wesentlichen, seit seiner Gründung, gab es fünf verschiedene es Orationen von HTML. Und wenn Sie zu w drei Punkt-Org's gehen, so wird dies das Hauptkonsortium sein, das HTML steuert. Eso in diesem bekam all die verschiedenen Informationen hier über HTML. Was passiert mit HTML? Was ist als Nächstes los? Eso Sie haben hier einige ah blawg Einträge und haben eine ganze Reihe von Informationen über HTML und wie es im Web funktioniert. Und auch, dies wird ein guter Bezugspunkt sein, wenn Sie mehr über HTML erfahren und ausprobieren und sicherstellen möchten , dass Sie mit HTML kompatibel sind. Es wird also einige Möglichkeiten geben, um einige Tests durchzuführen und mehr über die verschiedenen Standards zu erfahren , die online zugänglich sind. Wenn Sie mehr über die Geschichte von HTML erfahren möchten, haben sie hier einen guten Hintergrund darüber, wie HTML gestartet wurde. Sie haben den Gründer hier, der erste Natur des Tees, Tim Berners Lee. Und er ist im Wesentlichen einer der Gründer des oder des Erfinders des World Wide Web. Also gibt es noch mehr Informationen über ihn hier auf Swell. Und dann hat es die ganze Geschichte von HTML und bringt es den ganzen Weg dorthin, wo wir heute sind , und ebenso einige Beispiele zum Schreiben von HTML, über die wir in den kommenden Lektionen diskutieren werden. In der nächsten Lektion werden wir uns mit gängigen Tools beschäftigen, um HTML zu schreiben und diese HTML-Webseiten zu erstellen . Holen Sie sie ins Internet, und das alles wird es, was wir in den kommenden Lektionen durchmachen werden. 4. HTML: Wenn Sie zu einer Webseite wechseln, können Sie die andere Quelle öffnen und auschecken, die auf der Seite verfügbar ist. Also auf einem Windows-Computer, es kontrolliert Sie, und wir können sehen, dass es aus all diesem Code besteht. Und dieser Code ist, was vom Browser gelesen wird. Und der Browser interpretiert diesen Mantel und versteht, wie man ihn in einem besser lesbaren Format für Web-Benutzer ausgibt . Das ist also, was ist die Karte? Das, was sind die Inhalte einer Webseite und Sie können sehen? Überwiegend? Es ist HTML. Es gibt auch etwas JavaScript und auch etwas Styling, also werden wir den HTML-Teil des Webseiten-Codes innerhalb dieses Kurses abdecken . Und eine der ersten Fragen, die Leute immer stellen, ist OK, also verstehe ich, was HTML ist. Aber wie erstelle ich diesen HTML-Code, wie man tatsächlich auf eine Webseite gelangt? Und es gibt ein paar gängige Werkzeuge. Eines der gebräuchlichsten Tools auf Windows-Maschinen ist die Verwendung von Notizblock plus Plus. Dies ist ein Open-Source-Download-Editor, den Sie herunterladen und erstellen können Quellcode mit und als auch. Es gibt viele verschiedene Editoren da draußen, also haben Sie wahrscheinlich etwas auf Ihrem Computer, in dem Sie tatsächlich Quellcode schreiben können . Wenn Sie also einen Platz benötigen, um Ihren HTML-Code zu schreiben, können Sie sich kein Pad plus plus ansehen. Und für Max, einer der beliebtesten Redakteure wird Text Wrangler sein. Also diese Luft sowohl Open Source als auch kostenlos zum Download. Ah, und du könntest sie auf deinen Computer herunterladen und sofort mit ihnen loslegen. Sie sind wirklich einfach, unkompliziert, installiert und was es ist. Es ist im Wesentlichen ein Texteditor. Es ist sehr unkompliziert. Ich habe Notizblock geöffnet, weil ich auf einem Windows-Computer bin und wir sehen, dass es eine sehr typische Einrichtung ist, wo Sie diese Registerkarten hier oben haben, wenn Sie neue Seiten öffnen und Sie die Möglichkeit haben , etwas zu schreiben und dann diese Datei zu speichern. Also im Moment habe ich eine Standardseite erstellt. Ich habe es Index dot html genannt. Also, wenn es darum geht, einen Ausgangspunkt für Ihr Internet zu finden, wenn Sie also einfach zu einer Domain wie Notiz, Notizblock, Bindestrich plus Start gehen Notiz, Notizblock, oder es tatsächlich eine Startseite haben muss Also ist es wahrscheinlich eine Sammlung von Dateien hier auf dem Stammverzeichnis und dem Server. Die Art und Weise, wie es interpretiert, ist, dass Index dot html eine Standardstartseite für Ihre Domain ist , so dass Sie diese Startseite nicht wirklich angeben müssen. Der Server ist klug genug, um diesen Startseiten-Index dot html dienen zu können. Manchmal kann man es genauso gut als Standard-Punkt-HTML sehen. Typischerweise Typischerweise Indizes am häufigsten verwendet. Wenn Sie Skriptsprachen verwenden, sehen Sie möglicherweise etwas wie Index Punkt PHP oder so etwas, um die Startseite anzuzeigen . Aber da wir HTML-Code schreiben, werden wir ihn Index dot html nennen. Und das Gute an HTML-Seiten ist, dass sie direkt in Ihrem Browser rendern können , so dass Sie eigentlich keine Hosting-Maschinen haben müssen. Server-Maschine läuft ohne Paddel Sie tun müssen, ist gehen Sie laufen und wählen Sie den Browser, in dem Sie es starten möchten, und wir können sehen, dass wir diese Index-Seite starten und es im Browser rendert , genau wie es auf dem Server, denn wieder, dies wird HTML und HTML CSS und JavaScript sein. Das sind also die drei Front-End-Sprachen. Eso rendern sie alle über den Browser, und sie brauchen kein serverseitiges Scripting, und wir werden auch einen Blick auf Wrangler werfen. Also schreib Wrangler. Es ist also der Art, wie Notizblock funktioniert, sehr ähnlich. Und wieder, Sie könnten einfach auf die Website gehen und sie herunterladen und anfangen, HTML-Code zu erstellen , den wir in der kommenden Lektion durchlaufen werden. 5. HTML-Struktur: HTML-Seiten sind mit Kopf, Abschnitt und Körper Abschnitt strukturiert , und alle Inhalte, einschließlich Kopf und Körper, werden in den HTML-Tanks enthalten. Also, was es ist, es ist ein Siris von Tags, die Tags öffnen und schließen, sowie von selbstschließenden Tags, die wir auch später im Kurs betrachten werden. Und so ist HTML im Wesentlichen Struktur. Also werde ich voran gehen und meinen Editor öffnen und die grundlegende Struktur einer HTML-Seite durchgehen . Im Wesentlichen haben wir ein öffnendes und schließendes HTML-Tag. Das sind also die verschiedenen HTML-Tags. Und weil wir ein HTML-Dokument erstellen und HTML-Inhalte hier drin haben, zeigen wir an, dass, indem wir mit HTML beginnen und HTML schließen und dann die Idee ist, dass alles dazwischen, dies Teil dieses HTML-Dokuments sein wird. Eine Sache, die wir tun müssen, und was immer gut zu tun ist, ist die Angabe des Dokumenttyps. Jetzt, mit HTML fünf, haben sie die Fähigkeit, den angegebenen Doc-Typ festzulegen, wirklich vereinfacht. Alles, was wir tun müssen, ist doc-Typ html, und dies wird den Browser wissen lassen, dass dies kein html fünf Dokument ist und es in der Lage sein wird es als solches zu behandeln. Jetzt mit Browsern. Sie werden tatsächlich klug genug sein, um zu rendern, ah, Webseite oder HTML-Dokument und rendern es als tatsächlich sichtbare Inhalte in Ihrem Browser. Also dies, obwohl sie klug genug sind, um das zu tun, ist es immer eine gute Idee, Ihre Website tatsächlich innerhalb dieser Art von Format zu strukturieren. Also, wenn ich nur entfernen all dies und wenn ich tippe hallo, eine kleine Welt, speichern Sie das und ich gehe auf meine Webseite, die ich erstellt hatte und eine Aktualisierung es, wir sehen, dass hallo Welt tatsächlich gerendert wird. Auch wenn es in der Lage ist, diese acht zu machen, ist dies kein richtiger Weg, um unsere Website zu formatieren und zu strukturieren. Also müssen wir zurück zu dem, was wir früher hatten, wo wir diese öffnenden und schließenden HTML-Tags hatten , und dann haben wir einen vorangegangenen Abschnitt hier, und hier werden alle Kopfinhalte für Ihre HTML-Seite platziert und dann auch Körper und Körper ist in der Regel dort, wo der gesamte visuelle Inhalt geht. Also, wenn ich hallo Welt austippen möchte, sollte ich es in den Körper so platzieren, speichern Sie es zurück und erfrischt es. Und wir sehen, dass es eigentlich nichts anderes gibt, das ausgeschildert wird. Aber wenn wir zur Seitenquelle gehen, können wir sehen, dass sie tatsächlich richtig strukturiert ist. Und eso dies ist eine HTML-typische HTML-Dokumentstruktur, in der wir wieder den Dokumenttyp deklarieren . Wir haben das Öffnen und Schließen von HTML-Öffnen und Schließen Kopf. Das enthält also alle Kopfinhalte, die wir uns in der kommenden Lektion ansehen werden. Und dann enthält dieser Teil alle Körper aller sichtbaren Inhalte, die Sie tatsächlich wollen, dass Benutzer, die auf die Website kommen, sehen können. 6. HTML vs Tags Abstände von p-Tags: Also, wenn wir uns auf HTML beziehen, sprechen wir über Elemente. Wir reden über Tags. Also möchte ich nur schnell den Unterschied zwischen Elementen und Tags erklären. Und im Wesentlichen wird es das Gleiche sein. Also Tag ist so etwas wie P und dann schließen p Tags. Diese Luft wird also Absatz-Tags sein und es wird tatsächlich zu einem Element, wenn es ein öffnendes Tag, schließendes Tag und Inhalt umfasst ein öffnendes Tag, . All das, zusammen mit dem Inhalt in der Mitte, wird das ein Element sein. Und dann lüften diese die Tags für dieses Element. Das ist also der Unterschied zwischen Elementen und Tags. Oft werden Sie hören, wie sie austauschbar benutzt werden. Es gibt also einen subtilen Unterschied, aber keinen großen Unterschied. Wenn ich also auf Tags wie Absatz-Tags verweise und im Wesentlichen, so erstellen Sie ein Absatz-Tag, Absatz-Tags sind wirklich beliebte Tags. Innerhalb von HTML werden sie sehr oft verwendet, und dort haben sie Öffnungsspitze und schließen p und dann den Inhalt in der Mitte. Dies ist, was auf diese Tag-voreingestellten Styling-Cues und alles in der Mitte angewendet wird. Hier ist, was darauf angewendet wird. Also, wenn ich es wirklich tue. Absatz, Absatz, Absatz. Ich gehe aus und eine Aktualisierung meiner Seite. Ich sehe, dass ich hier drei Absätze habe und ich habe eine Standardformatierung, die mit diesem Absatz einhergeht . Zunächst einmal, wenn ich mir den Code anschaue, sehe ich das. Okay, nun, es ist nur Hallo Welt, und ich habe keine Inhalte neben dort. Aber obwohl es einen völlig neuen Raum einnimmt, eine neue Zeile, ich habe Abstand in der Mitte, nicht rechts übereinander, obwohl ich keinen Abstand dazwischen habe, und das ist alle aus dem Absatztyp kommen. Selbst wenn ich so etwas mache und es auffrische, wird das Ergebnis die Szene sein. Und das ist eine andere Sache. Wichtige Sache zu beachten über HTML. Und wenn Sie Ihre HTML-Seiten schreiben, all dieser Leerraum, den ich jetzt einschließe. Auch wenn es hier in meinem Editor wirklich schrecklich aussieht, sehen wir, wenn ich es aktualisiere, wenn ich es aktualisiere,nichts ändert sich. Und das liegt daran, dass der Browser HTML-Code rendert, so dass er es nicht tut, wenn er Abstand sieht, es standardmäßig diesen Zehe ein Leerzeichen vorgibt. Es liest nicht den Abstand zwischen den Tags. Also, wenn es hier keinen Abstand dazwischen gibt, wird es nicht den zusätzlichen Abstand zur Verfügung stellen . Und wenn ihr Abstand innerhalb der Tags innerhalb des Elements ist, wird es nur auf ein leeres Leerzeichen vorgegeben und außerdem wird es keinen dieser Zeilenumbrüche sehen. Also, wenn ich etwas habe Also, wenn ich so etwas habe, denkst du, dass dies jetzt anders sein wird, wenn wir es betrachten, sehe ich, dass ich einen Zeilenumbruch habe Ich habe Hallo. Ich habe keinen Platz und ich habe am Ende die Welt hier unten. Also, glaube ich, ist das zweite Element S o Glaubst du, dass sich das ändern wird? Glaubst du, ich verliere hier meinen Platz? Glaubst du, es wird einen Platz da drin behalten, wenn ich ihn auffrische? Also, wenn ich es auffrische, sehen wir, dass es tatsächlich einen Raum behält. Neben der Standardeinstellung für all diesen zusätzlichen Platz aus Abstand, standardmäßig auf Lee toe ein Leerzeichen, was auch immer Sie einen Zeilenumbruch tun, beginnen Sie eine neue Zeile. Es ist immer noch standardmäßig, dass dieser Abstand dort, also sehen wir, dass, wenn ich es nach unten ziehe, es in diesem Raum hinzufügt, obwohl ich diesen Raum nicht wirklich auswählen kann. Und wenn ich zurückgehe, ist dort standardmäßig kein Platz mehr. Es fügt immer noch diesen Abstand innerhalb des Browsers hinzu, wenn es diese HTML-Datei rendert . 7. HTML: , wenn Sie HTML-Code schreiben. Gelegentlich müssen Sie einige Dokumentation hinzufügen, einige Kommentare innerhalb des Codes. Wenn Sie also zurückgehen und das später referenzieren, können Sie besser verstehen, warum Ihr Code so angelegt ist. Also, wenn ich zu diesem Code zurückging und ich sehe, dass ich Hello World dreimal gelistet habe, also vielleicht sechs Monate nach unten, könnte ich mir diese bestimmte HTML-Datei ansehen und ich frage mich vielleicht, warum habe ich Hello World dreimal geschrieben? Das ergibt momentan keinen Sinn. Was Sie also innerhalb von HTML tun können, ist in Commons hinzuzufügen. So sehen wir hier, dass wir innerhalb des Stils in einem Kommentar hinzugefügt haben, den wir in JavaScript hinzugefügt haben. Wir haben einen Kommentar hinzugefügt, damit wir das Gleiche mit in unserem HTML-Code machen können, und dies hilft wirklich, zu dokumentieren, was Sie tun und warum Sie es zu der Zeit tun, wenn Sie es tun, und ermöglicht es Ihnen, es sowie ermöglicht es anderen Entwicklern, einen Blick darauf zu werfen und leicht zu verstehen, warum bestimmte Dinge auf bestimmte Weise gemacht werden und wie während das Kommentieren wirklich gut ist. Wenn Sie etwas später als Platzhalter oder so etwas hinzufügen möchten, und Kommentare werden tatsächlich nicht im Browser gesehen. So macht der Browser keine Kommentare und Kommentare können irgendwo in Ihrem HTML-Code platziert werden . Also werde ich schreiben. Das ist ein Komet und ich habe genau richtig, denn und um das abzuschließen, schließen wir es auf die gleiche Weise ab, die zwei zu Minuszeichen und das Größer-als-Zeichen. Also öffneten wir den Uhrkommentar mit der Erklärung weniger als Zeichen. Markieren Sie zwei Bindestriche. Wir direkt in unseren Kommentarinhalt hier und zusätzlich, wenn wir mehrere Zeilen hier haben, so dass manchmal werden Sie Kommentare wie folgt geschrieben sehen. Ah, und wieder, das ist für die Lesbarkeit. Seek eso jedoch am besten für Sie, funktioniert jedoch am besten für Sie,die in Ihrem Code am besten aussieht, ist, wie Sie strukturieren und schreiben können. Ihre Kommentare und Kommentare können so wenig oder so viel wie nötig gemacht werden. Und im Wesentlichen ist es eine andere Möglichkeit, einige zusätzliche Informationen hinzuzufügen, nicht für die Benutzer, die hereinkommen, sondern für die Entwickler oder jeden, der den Code liest, um den Zweck dieses Gerichts besser verstehen zu können . An diesem Punkt, 8. HTML-Kurs Linie bricht nesting: in der vorherigen Lektion hatten wir uns Absätze angesehen und diese Lektion möchte ich mir ansehen, was wäre, wenn Sie einfach nur Welt in eine neue Zeile bringen wollten und Sie nicht alle diese Standardformatierung für einen neuen Absatz haben möchten . Also Sie im Wesentlichen, Sie wollen schreiben Hallo Welt, und vielleicht werde ich nur Kaffee einige Inhalte hier draußen und wir aktualisieren es. Wir sehen, das ist alles in der gleichen Zeile, aber sie sind durch Absatz getrennt. Nun sagen wir, ich möchte diese Hallo Welt hier unten bringen, aber ich möchte keinen neuen Absatz beginnen, damit Sie dies tun können, indem Sie einen Zeilenumbruch machen . Und dies ist ein weiteres von diesen selbst enthaltenen Tags, in denen Sie keinen Inhalt enthalten . Es ist so alles, was es ist, dem Browser zu helfen, zu verstehen, wie Sie Ihre Webseiteninhalte strukturieren möchten . Also, jetzt, im Wesentlichen, wenn es hier durch den Absatz kommt, sieht es Zeilenumbruch hier, und es weiß, dass dies die Zeit ist, einen weiteren Zeilenumbruch zu platzieren. Also, wenn ich es aktualisiere, sehen wir, dass jetzt diese bestimmte Zeile zu einer völlig neuen Zeile gegangen ist. Selbst wenn ich die Größe ändere, wird es immer auf einem neuen Lügen sitzen. Und das ist, was der Zeilenumbruch tut. Strukturieren, helfen, Ihre Website zu strukturieren und wie es geht ein bisschen Ausgabe und im Browser gerendert . Jetzt ist es auch wichtig zu beachten, dass wir hier ein Tag innerhalb eines Elements platziert haben , und wir können auch Elemente innerhalb von Elementen machen. Und wir können weiterhin acht all diese Elemente in ihnen verschachteln, und diese Luft wird ihre eigenen Eigenschaften enthalten. Also, dass der erste übergeordnete Absatz wird seine Menge von Eigenschaften und Styling enthalten. Diese Absätze in diesem Abschnitt werden zusätzliche Absatz-Styling beibehalten, die in diesem übergeordneten Absatz enthalten sein wird . Wenn ich es aktualisiere, sehen wir, dass es nicht viel ändert, was hier ausgegeben wird. Aber der Unterschied wird kommen, wenn wir etwas Styling anwenden, oder wenn ich hier einen anderen Abschnitt schreiben möchte, ist das völlig dasselbe. Und wir sehen, dass dies jetzt das Elternteil ist, diese Luftabsätze innerhalb des Elternteils und wir haben unseren Zeilenumbruch dort, natürlich, und dann wird diese Luft durch Absatz getrennt werden. Wenn wir also andere HTML-Tags als die Absätze verwenden, sehen wir hier wahrscheinlich einen größeren Unterschied und ähnlich, wenn wir die Zeilenumbrüche verwenden. Also, wenn ich etwas hatte, einen Zeilenumbruch und ich einen hatte, und wenn ich es aktualisiere, sehen wir, dass das Absatzstyling angewendet wird. Also hat es diesen Puffer hier im unteren Puffer hier oben, standardmäßig. Und selbst wenn es sich um eine verschachtelte innerhalb eines anderen Absatzes oder innerhalb eines anderen Satzes von Tags innerhalb eines Elements handelt, können wir sehen, dass es immer noch oben und unten puffert. Und so sind dies die Standard-Styling-Hinweise für Absätze. 9. HTML: Also, wenn wir uns typische Websites ansehen, so dass wir nicht nur alle Inhalte die gleiche Größe haben, einige davon können Sie sehen, dass Boulder ist. Einige sind größer, die auffällig sind. Wir sehen also, dass wir diese Überschriften haben, die mehr abheben als der Rest des Textes, und es hilft uns, den Benutzer besser zu verstehen. Verstehen Sie besser? Okay, nun, das hat mit Website, Web, Webdesignund Anwendungen zu tun Web, Webdesign . Dies ist ein Netz von Geräten, und wenn ich mir den Quellcode hier dieses bestimmten Elements anschaue, sehen wir, dass es ein H ist, um zu markieren. Also diese Luftleitungs-Tags. Und wenn wir hier rauf gehen, sehen wir, dass dies ein Schwung ist. Dies sollte auch ein H sein, um zu markieren. Also alle diese sind, was heißt H zwei Tags auf. Und wir sehen die grundlegende Struktur der Webseite, dass alles, was hervorgehoben , wir haben unsere Hauptüberschrift hier ist H eins. Und dann von dort haben wir die Unterüberschriften hier, die H zwei sind. So können wir zunächst sehen, dass diese Webseite will, dass Standards am meisten hervorstechen, und dann sind diese nicht so wichtig wie Standards, aber wir sehen, dass es in irgendeiner Weise eine gewisse Bedeutung für diese. Es gibt also im Wesentlichen 36 verschiedene Ebenen von jedem Tank von Überschriften-Tags, und jede dieser Ebenen schrumpft die Größe des Textes und macht es immer weniger auffällig , indem sie den ganzen Weg von einer der höchsten ist, die größte Größe, und dann gehen den ganzen Weg nach unten h zwei, h drei und so weiter. Wenn ich also einige Unterüberschriften hier unten hätte, würde ich sie als H-Dreier einrichten. Und dann, wenn ich Untertitel unter Türen da unten hätte, würde ich H vier gehen und so weiter und so weiter. Und so strukturieren wir wichtige Inhalte innerhalb unserer Webseite. Und in der Regel werden Sie für Seo-Zwecke sehen und Standard-Art der Strukturierung Ihrer Webseiten-Inhalte ist, dass Sie Ihren Titel hier und dann auch auf der Seite haben. Du markierst diesen Titel wirklich gut, mit den H ein-Tags. Das ist eine typische Möglichkeit, Überschriften-Tags hinzuzufügen. Und das ist eines der Dinge, dass es immer eine gute Idee ist, bestimmte Inhalte hervorzuheben . Und dann wären Sie in Ihrem HTML-Gericht so in der Lage, es zu tun, also übertreiben Sie es nicht. Sie müssen nicht alles hervorheben. Sie möchten nur, dass bestimmte Textstücke auffallen und sichtbarer werden. Also werde ich genau die richtige Richtung eins gehen. Und so wird dies ein typisches Element sein, bei dem ich meine öffnenden und schließenden H-Tags habe. Und sagen wir, ich habe ein paar Überschriften hier unten, also zu und dann wäre das ein H zwei. Und natürlich können wir den ganzen Weg runter gehen, wenn wir wollten. Also wird dieser auch ein h zwei sein und dir einfach zeigen, wie das aussieht. Also, wenn ich die Seite aktualisiere, sehen wir, dass sie inkrementell kleiner ist als H zwei s o Überschrift eins steht wirklich heraus weil dies der Hauptinhalt unserer Webseite sein würde, und dann wäre die Überschrift für diese besondere Abschnitt und so weiter. Dies wäre für diesen speziellen Abschnitt. Und nur um den Unterschied zwischen all den Überschriften zu veranschaulichen, während wir einige , die ein schnelles Kopieren und Einfügen dort machen, und ich werde das in drei ändern, ändern Sie es zu vier und wir können den ganzen Weg nach unten auf sechs gehen. Also sechs sind die kleinsten der Überschriften-Tags und Sie werden feststellen, dass alles wirklich unter drei sehr selten verwendet wird. Sie sehen nur sehr wenige Webseiten, die über die ersten drei obersten Überschriften hinausgehen. Aber nur für den Fall, dass du es wissen wolltest, wird das der Unterschied zwischen den Überschriften und den Größen sein. Also stärke ich uns wieder auf 100% zurück. Wir können sehen, dass wir besser verstehen können, wie die Überschriften in unseren Webseiteninhalten dargestellt werden . 10. HTML-Kurs Hyperlinks: Ein weiteres beliebtes Tag, das fast jede Webseite enthalten wird, wird Links sein. Links sind also im Wesentlichen das, worum es im Internet geht. Sie können zu jeder Website gehen, jede Webseite, und alles, was Sie sehen, ist eine Reihe von verschiedenen Links und Links sind nur das. Sie verlinkt tatsächlich alle verschiedenen Webseiten, um eine neue gesamte Website zu erstellen, Und das ist, wie Benutzer, die auf die Website kommen, haben die Möglichkeit, durch die Website zu navigieren , indem Sie auf die Links klicken und auf die nächste Seite, die vorgeschlagen hier innerhalb des HTML-Codes und um Links in Ihrem HTML-Code zu erstellen, verwenden wir das A-Tag, so dass dies auch als Anker-Tag oder Hyperlink-Tag eso bekannt ist, wenn ich ein bestimmtes Stück meines HTML-Codes verlinken möchte . Also lassen Sie uns sagen, ich möchte eine dieser Hallo Welten Hyperlink, und ich möchte einen Link es zu einer anderen Webseite. Ich fing mit dem Anker-Tag an und schloss dann das Anker-Tag ab. Das hier ist also ein anderer. Jetzt wird es zu einem Element, weil wir öffnen und schließen, und der Unterschied hier ist, dass es zwei Informationen geben wird, die für diesen Hyperlink benötigt werden könnten . Also müssen wir nicht nur wissen, welcher Text Hyperlink war, sondern wir müssen auch wissen, was mit diesem Hyperlink passieren soll. Und das ist, wo H ref ins Spiel kommt. H ref wird dort sein, wo wir den Benutzer schicken wollen. Dies ist also der Earl der Webseite oder die Website oder der Link, zu dem wir unseren Benutzer senden möchten , wenn sie auf Hallo, Welt klicken . Dies könnten also entweder interne oder externe Links sein, so dass Sie auf etwas wie http Google verlinken können. Und jetzt, wenn der Benutzer auf diesen Link klickt, wird es sie zu dieser Website bringen oder wir können Teoh einen internen Link verknüpfen. Also gebe ich Ihnen ein Beispiel dafür in dem Link hier unten, und ich werde nur auf dieselbe Webseite verlinken. Und so jetzt, wenn ich in einem Refresh es gehe, sehen wir, dass ich diese Hyperlinks hier habe, also sind sie tatsächlich unterstrichen und etwas ging schief dort. Also werde ich mir das schnell ansehen und eso ansehen. Ich habe diesen Hyperlink nicht wirklich geschlossen. Deshalb habe ich diesen Grund unter all dem zusätzlichen Text, den ich dort hatte. Also wollte ich zunächst nur den Hyperlink unter dieser einen Stelle. Aber wenn ich nicht schließen, dass ein Tag dann, was passiert ist, ist, dass der Browser automatisch dachte, dass l Dieser Text muss mit Index dot html verlinkt werden und es versucht, diesen Fehler zu korrigieren, indem automatisch alles als Hlinka ble ausgewählt wird. Also werde ich das auffrischen und das sieht ein bisschen besser aus. Onda auch zu schwächen bemerken, dass Hyperlinks standardmäßig. Wenn Sie also kein Standardstyling für sie haben, werden sie standardmäßig unterstrichen. Sie werden blau sein. Und wenn es ein Link ist, auf dem wir waren, und wenn wir es besuchen, erinnern Sie sich daran, dass dieser Link zurück auf die gleiche Indexseite verlinkt . Eso Wenn es ein Link ist, auf den wir bereits geklickt haben oder ihn besucht haben, dann wird es diese violette Farbe sein. Also, wenn ich hier klicke und wir auf die Website gehen, dass es uns zwei bringt, was Google Now sein wird, wenn ich diese Seite aktualisiere, wird der Link das nächste Mal lila sein, weil jetzt, wo wir es besucht haben Also, wenn ich aktualisieren Sie die Seite eso, dass wir bereits darauf geklickt haben. Und der Grund, dass dies derzeit nicht lila wird, ist, weil wir immer noch von dieser lokalen Datei arbeiten , also wird es nicht wirklich eingelöst. Aber in der Regel, wenn Sie diese Webseite hochgeladen und Sie klicken auf die Länge und es würde lila, keine zusätzliche zu, dass. Manchmal ist es nicht immer der ideale Zeh. Öffnen Sie es im selben Fenster, z. B. in diesem Fall, in dem ich darauf klicke. Und dann musste ich zurückklicken, um auf die gleiche Seite zu gehen, die ich mit eso begonnen habe. Sie haben eine gewisse Kontrolle darüber, wenn Sie Ihren HTML-Code eingeben. Dies ist nur Klammern, die ich auch geöffnet habe, hat sich auf die gleiche Seite geöffnet. Dies ist ein weiteres Beispiel für einen anderen Editor auf, und es ist ein bisschen bunter. Es hat eine Menge mehr Optionen hier, und es erlaubt uns, ähm, HTML Code und verschiedene andere Sprachen als auch. Also das ist Klammern I Oh, das ist ein kostenloser herunterladbarer Editor und als Alternative zur Verwendung von Notizblock oder einem dieser typischen Texteditoren, ist eine wirklich gute Alternative, Aber in der Regel wollen Sie von Weiß, wenn Sie beginnend mit etwas wie Klammern, weil es Ihnen hilft, die Kälte einzustellen. Es tut das Öffnen und Schließen der Tags standardmäßig. Sie erwägen, das automatisch zu tun, und es ist im Wesentlichen führt es Sie entlang des Codes. Und der Nachteil ist natürlich, natürlich, dass du es nicht tust. Eigentlich muss ich mir die Zeit nehmen, es richtig zu machen, alles abzuschließen, wie Sie es in der Notiz tun. Pad eso. Das ist einer der Nachteile, denn es kann tatsächlich ein Hindernis für das Lernen von eso sein, wenn man lernt und anfängt . Es ist im Allgemeinen besser, bei den wirklich einfachen Texteditoren zu bleiben, bis Sie sich mit dem Code vertraut machen und Ihre Geschwindigkeit beim Schreiben des Codes verbessern und erhöhen möchten . Und Sie könnten zu so etwas wie Klammern io in den Hyperlinks wechseln, damit ich hier runter gehen kann . Und ich musste Ihnen nur ein Beispiel in Klammern zeigen. Also, jetzt können wir in unsere Hyperlinks gehen und wir können angeben, wo das Ziel sein wird. Eso Ziel wird uns helfen, anzugeben, was wir mit dem Link machen wollen Also wenn Hallo Welt geklickt wird, was wollen wir passieren? Und typischerweise wird der Link standardmäßig zu sich selbst gehen. Das bedeutet nur, dass jedes Mal, wenn wir auf den Link klicken, es wird den neuen Inhalt neu laden, die neue Webseite innerhalb desselben geöffneten Fensters im Browser. Aber wenn wir ein brandneues Fenster öffnen wollen, würden wir leere Angaben machen. Und was das tun wird, wird das völlig neues Fenster öffnen? Also typischerweise die Art und Weise, wie wir das tun, wenn wir externe Links haben, verknüpfen wir leer mit ihnen S O. Das öffnet unser neues Fenster. Und es nimmt den Benutzer nicht wirklich weg von Ihrem Web, Ihrer eigenen Website und Ihren eigenen Web-Inhalten. Aber innerhalb Ihrer Webseite. Also, wenn wir intern verlinken, behalten wir es normalerweise selbst, weil wir möchten, dass Benutzer in der Lage sein, durch die Website zu navigieren ohne mehrere Registerkarten geöffnet zu haben. Also zeig dir einfach, was der Unterschied hier sein wird, wenn ich ihn auffrische. Und wenn ich auf Hallo Welt klicke. Wir sehen, dass wir automatisch zu Google gehen, und wenn ich auf den Link klicke, den Hyperlink an sich, wird es versuchen. Es wird einfach diese Indexseite neu laden, und es wird kein neues Fenster öffnen. Aber alternativ, wenn ich hier leer eingerichtet habe, was ich wirklich schnell tun kann und es jetzt aktualisieren kann, jedes Mal, wenn wir Hyperlink klicken, werden wir ein völlig neues Fenster öffnen. Und wie wir sehen können, ist dies nicht ideal, wenn Sie versuchen, Menschen in Ihrer gleichen Webseite zu halten. 11. HTML-Kurs wie man Bilder zu HTML-Seiten fügt: so zusätzlich zu Hyperlinks. Etwas anderes, das auf Websites sehr häufig ist, ist die Verwendung von Bildern, also können wir es hier bei W 3 sehen oder wir haben ein Bild dort, und wenn wir das untersuchen, können wir sehen, dass dieses Bild-Tag verwendet wird. Es hat die Quelle dort. Es hat eine Breite und eine Höhe, also hat es einige zusätzliche Attribute. In dieser Lektion werden wir Attribute sowie Bilder abdecken und Bilder in Ihren Quellcode einfügen . Es wird relativ einfach sein und Bilder und das Bild-Tag werden ein weiteres selbstschließendes Tag sein. Also alle Informationen, die wir wissen müssen, wenn der Browser in der Reihenfolge wissen muss, Rend schrieb , Dieses Bild wird in I M. G enthalten sein . So wie wir dort sehen, gibt es kein Öffnen und Schließen des Bildes. Es schließt sich selbst, und dann nimmt es seine Informationen wie das, was hier in dem Hyperlink passiert ist, wo wir unsere H ref haben, wo wir tatsächlich gehen. Aber wir müssen eine Quelle für das Bild auflisten, und das ist, was wir hier haben, und dann die Höhe und die Breite und die Ault sind alle zusätzlichen Attribute, die verfügbar sind. Also gehe ich rüber zu Loren Pixel und das gibt mir. Dies ist eine Website, die es Ihnen ermöglicht, Dummy-Bildpfade zu erstellen oder Dummy-Bildpfade zu erhalten, damit ich so etwas als Platzhalter für meine Website verwenden kann , und ich könnte es einfach kopieren. Und das wird mir erlauben, Dummy-Bilder im Wesentlichen wie Laura, ähm, Text, aber mit Bildern zu setzen ähm, Text, Text, . Und wenn Sie nicht vertraut sind mit dem, was Lauren Text ist, es ist ein Lauren-Text ist wieder. Es ist eine Nachricht von Polizeiinhabern. Wenn Sie Ihre Website entwerfen, möchten Sie in der Regel nicht haben oder Sie wollen, dass diese Stelle diese Standardformatierung einnimmt . Also hier drüben habe ich gerade einen Dummy-Text geschrieben. Aber wenn ich nicht durch den Prozess des Schreibens in diesem Dummy-Text gehen wollte, möchte ich nicht all diese Hello Welt und kopieren und ersetzen. Und wenn ich eigentlich wie tatsächlicher Text, etwas anderer Inhalt auf meiner Webseite aussehen wollte , würde ich so etwas wie Lauren-Text verwenden, um diesen Text zu platzieren. Also kommen wir zurück zu unseren Bildern und ich schaue gerade gerade jetzt, wo wir ein Bild hinzufügen können , also werde ich es genau hier unter diesen Absatz-Tags verschachteln. Und wie wir sehen können, ist das Format I M G und es ist ein selbstschließendes Tag, und dann müssen wir eine Quelle auflisten. Also werde ich die gleiche Quelle verwenden, die ich gerade kopiert habe, und dies als Quelle für mein Bild bereitstellen . Und jetzt, wenn ich hier rausgehe und es aktualisiere, sollten wir ein Bild auf unserer Seite haben, was wir jetzt tun. Wir haben das standardmäßig gesehen oder nicht standardmäßig, aber es ist immer eine gute Übung, alle Tags einzubeziehen. Und alle Tags sind Anat-Hommage, die Sie in Ihrem Bild festgelegt haben, und das wird etwas sein, das angezeigt wird, wenn das Bild nicht gerendert wird oder wenn jemand ein Bildschirmlesegerät verwendet und es offensichtlich nicht lesen kann, was der Bildinhalt sind. Aber es kann lesen, was die Attribute alle kennzeichnen. Das Bild-Tag wird enthalten, und von dort wird es in der Lage sein, besser zu entschlüsseln, was in diesem Bild enthalten ist . Also, zum größten Teil, verwenden Sie immer alle Tags, und wir sehen auch, dass wir dort einige zusätzliche Attribute haben, so dass Sie dies auch über Styling festlegen können. Oder Sie können es als In-Line-Standardattribute für Bilder setzen wir unsere mit und Höhe, so um eine Breite zu setzen. Dies wird also auf der Anzahl der Pixel basieren, die standardmäßig über ESO gehen waren 400 mal 200. Also, wenn ich es auf kleiner setzen wollte, kann ich diesen Standard jetzt mit dem B 300 einstellen. Das Interessante an HTML ist, dass, wenn Sie die gleichen Dimensionen behalten möchten, Sie nicht wirklich notwendig sind. Sie müssen die Höhe angeben, denn solange Sie entweder die Breite angeben oder wenn Sie die Höhe angeben und die mit dynamisch haben möchten , können Sie dies auch tun. Und die Browser sind intelligent genug, um zu wissen, dass Sie die gleichen Dimensionen behalten möchten. Und im Wesentlichen ist es einfach Lee zu erzählen, dass diese Dimensionen in jene Dimensionen passen, die dort angegeben wurden , also wird es die Breite von 300 nehmen, es wird die Höhe auf 150,286 neu berechnen und natürlich wenn wir in unseren Editor gingen und wenn wir ah setzen, Höhe. Wenn wir also eine Höhe von 300 einstellen, wird es tatsächlich die Abmessungen des Bildes verzerren. Aber es wird in der Lage sein, es zu setzen und zu zwingen, 300.300 zu sein. So sehen Sie jetzt in unserem Dev Consul hier, haben wir 300 mal 300. Das sind Ihre Optionen, wenn Sie Bilder festlegen, und so fügen Sie zusätzliche Attribute und Attribute hinzu. Wir haben sie vorher auch hier oben im Meta-Tag verwendet, wo wir Attribute von Name und Inhalt festgelegt haben. Alle diese verschiedenen Tags können also ihren eigenen Satz von Attributen enthalten und Attribute können alles sein, vom Styling von zwei zusätzlichen Informationen , die für dieses Tag erforderlich oder typisch wären , und wir sahen es im Hyperlink, wo wir zwei Attribute haben, die so eingestellt wurden, dass Sie l sind, dass wir besuchen möchten , wenn der Link geklickt wird und wie wir wollen, dass der Browser Teoh diesen Link rendern . Egal, ob es sich um eine neue Seite oder innerhalb derselben Seite handelt, 12. HTML-Listen Typen: in dieser Lektion. Ich möchte Ihnen zeigen, wie man Listen für geordnete Listen und geordnete Listen in HTML erstellt. Also werden wir weitermachen und unsere HTML-Seite öffnen und dann innerhalb des Body-Abschnitts. Hier werden wir unsere erste Liste erstellen. Und die erste Art von Liste, die wir erstellen werden, wird auf einer neuen geordneten Liste . Es gibt also zwei verschiedene Arten von Listen, und dies wäre ein Beispiel für eine Nord fehlerhafte Liste und die Art und Weise, wie Sie Listen erstellen können, die Sie zuerst mit dem UL-Tag begonnen haben. Und das zeigt an, dass der Inhalt zwischen der U. L-Öffnung und Ihnen alle schließenden Tag ist, wo Sie Ihre Listenelemente enthalten und Listenelemente erstellen. Sie erstellen Listenelemente mit dem L I-Tag und dann den Inhalt von diesem bestimmten Element. Also werde ich eine Liste erstellen. Vielleicht fängt das zuerst an und schließt dann das Verbündet-Tag ab. Also werden diese Elemente hier zu den Listenelementen werden. Also habe ich Ally einen 1. 2. 3. und wir können weiterhin Listenelemente hinzufügen, wenn nötig. Also gehen wir auf unsere Webseite, also muss ich einfach unsere Indexpunkt-HTML-Seite aktualisieren, und wir können das automatisch sehen. Die geordnete Liste verwendet Aufzählungszeichen, und es listet alle Listenelemente auf, die wir hier aufgelistet haben, und Sie werden in der Regel feststellen , dass Listen eine Nord-Listen für Navigationsmenüs verwendet werden. Sie werden gestylt, um es eher wie ein Navigationsmenü aussehen zu lassen. Aber Sie werden feststellen, dass Listen oft innerhalb von HTML verwendet werden. So haben Sie auch einige Optionen, wenn es darum geht, Ihre Listenelemente zu stylen und zu stylen. Also, wenn ich es stylen wollte, so werde ich in den Attributen Stil hinzufügen. Das ist also CSS, das ich hier hinzufüge, und ich kann Listenstiltyp einrichten. Und dann gebe ich hier an, welchen Typ ich will. So viele Navigationsmenüs werden Sie sehen, dass keine verwendet wird. Sie haben auch eine Option für den Standardwert für den Kreis oder die Festplatte. Sie können auch quadratisch tun. Sie haben also ein paar verschiedene Optionen für die verschiedenen Stile Ihrer Listenelemente für Ihre Aufzählungspunkte . Also jetzt, wenn ich aktualisiere, dass wir sehen, dass wir jetzt quadratische Elemente in unserer Liste haben. Also auch, zusammen mit einer neuen geordneten Listen, haben wir, was bestellt Listen genannt wird. Nun werden geordnete Listen gehen Sie ermöglichen es Ihnen, Elemente in einer Rolle entweder numerisch, alphabetisch, mit römischen Ziffern aufzulisten alphabetisch, . Also mehrere verschiedene Optionen für verschiedene Möglichkeiten, um geordnete Listen zu präsentieren. Also werde ich unseren Editor wieder öffnen, und ich werde eine neue geordnete Liste erstellen, also wird das anders sein als die geordnete Liste. Aber es wird immer noch die gleichen Listenelemente in ähnlicher Art und Weise enthalten und so ähnlich einrichten , wie wir mit der bestellten Liste der Vereinten Nationen gemacht haben. Ich werde ein Tag für die geordnete Liste und das schließende Tag für die geordnete Liste einrichten. Und dann ist hier drin, wo wir alle unsere Listengegenstände auflisten werden. Also, das gleiche, was wir hier gemacht haben, werde ich sie nehmen und den ersten 2. und dritten auflisten. Das wird also nur eine standardmäßige geordnete Liste sein. Wir gehen zurück und aktualisieren Ihre Seite, und wir können sehen, dass unsere Listenelemente tatsächlich mit tatsächlichen physischen Zahlen nummeriert werden, anstatt mit den Aufzählungspunkten , die wir in der geordneten Liste hatten. Das ist im Wesentlichen, was die Unterschiede zwischen der Verwendung einer Nord irrten Listen und geordneten Listen ist, dass wir die Möglichkeit haben, die geordneten Listeninformationen zu definieren, anstatt nur Aufzählungspunkte aufzuzeigen und sie so zusätzlich zum Standardwert aufzulisten Typ , der mit Zahlen nummeriert ist, können wir einen Typ auflisten und feststellen, dass dies ein Standardattribut in der geordneten Liste ist, während eine noch Liste wir tatsächlich Styling-Attribute verwenden mussten, die wir uns gut für die randlosen verwenden konnten, so dass wir kann im Wesentlichen die geordnete Liste aktivieren und auf ein ähnliches Format wie auf einer neuen geordneten Liste. Wenn ich das aktualisiere, sehen wir, dass sie jetzt gleich aussehen. Und das ist eines der wirklich coolen Dinge über die Verwendung von CSS, dass Sie all diese verschiedenen wunderbaren Optionen haben , um die Art und Weise anzupassen, dass Sie Elemente in Ihrer Webseite präsentiert werden . In diesem Beispiel möchte ich Ihnen auch zeigen, dass die geordnete Liste die Standardattribute vom Typ und innerhalb des Typs hat . Standardmäßig wird es eins sein. Das bedeutet also, dass wir standardmäßig mit Nummer eins beginnen und von da an auflisten . Das ist also unsere Standardeinstellung, und wir haben auch die Fähigkeit, alphabetisch zu verwenden, damit wir Kleinbuchstaben A, B, Cusw. verwenden können B, C . Und auch können wir einen Großbuchstaben A verwenden und dies wird es mit Buchstaben, Großbuchstaben und zusätzlich zu dem innerhalb der Standardtypen präsentieren , haben wir auch die Möglichkeit, römische Ziffern zu tun. Und das wird mit auf I eso wieder angezeigt, es könnte Groß- oder Kleinbuchstaben I sein. Und wenn wir es aktualisieren, sehen wir, dass sie automatisch diese Eigenschaften dieser Listenelemente übernehmen. Also, eigentlich, wenn ich das auf unseren Inhalt innerhalb dieser Listenelemente duplizieren würde, so wird es nicht sein, dass es hier nicht belastend sein wird, weil wir das nicht eingerichtet haben. Aber wir werden in der Lage sein, alle verschiedenen römischen Ziffern darzustellen, die den ganzen Weg nach oben und kontinuierlich inkrementell gehen . Und auch, wenn es um geordnete Listen geht, schwächen angeben, welche Zahl es mit beginnen wird, und wir tun, dass durch Angabe von Start. Wenn ich also mit fünf beginnen will, könnte ich das auch tun, und ich könnte das zurück nach Amerika wechseln, wenn ich wollte, und so weiter. Jetzt sehen wir das, weil wir mit der römischen Zahl fünf beginnen und wir bis 10 11 12 und 13 inkrementell sind . Und so haben wir mit Listenelementen auch Optionen zum Styling. Also habe ich Ihnen hier gezeigt, wie wir einige Styling Teoh a Norden Listen anwenden können, und wenn Sie Styling anwenden möchten, können wir UL angeben, um dieses bestimmte Tag auszuwählen und dann das Styling darauf anzuwenden. Und wir können all dieses Styling in ihre bringen. So wird dies in einer viel saubereren Art und Weise präsentiert. Und was dies tun wird, ist, dass dies den Listentyp A Nordling ist innerhalb von CSS setzen wird. Also, wenn wir es aktualisieren, schauen wir immer noch auf die Szene eingerichtet und ebenso, Ich habe erwähnt, dass in der Regel werden Sie eine neue geordnete Liste in Navigationsmenüs verwendet zu sehen . Und wenn wir uns diese Woche ansehen und sagen: Nun, Nun, das sieht nicht wirklich aus wie ein Navigationsmenü, weil ich all diese Aufzählungspunkte habe und es ist horizontal. Also, was wir tun würden, ist, wer würde darauf hinweisen, dass wir einen Listenstiltyp haben, um diesen auf keinen zu setzen . Legen Sie eine neue geordnete Listeneinträge fest. Wir müssen sicherstellen, dass wir unsere Selektoren richtig gebracht haben, und wenn Sie es in einem Navigationsmenü haben, stellen Sie immer sicher, dass Sie nicht nur die eine geordnete Listenliste Elemente auswählen, sondern Sie wählen auch -Element in Ihrem HTML. Also würden wir festlegen, wie wir das Display machen, und das wird durch die Anzeige angezeigt, und wir würden das in Linie setzen. Also jetzt, wenn ich gehe und aktualisiere es, sehen wir, dass jetzt mehr wie Menüpunkte aussehen würde. Und außerdem könnten wir das weiterhin aktualisieren, wo wir dort auch etwas Padding hinzufügen und es erneut aktualisieren konnten . Jetzt fängt es an, mehr und mehr wie Menüpunkte zu sehen. 13. HTML Divs Spannt neue HTML5-Struktur: in dieser Lektion. Ich möchte über Davids und Spans reden. Lassen Sie mich Ihnen ein Beispiel geben, was Dibs sind und welche Spannweiten hier unten so sind. Also werde ich diese geordnete Liste loswerden, und ich wollte einen grundlegenden Dip erstellen. So werden Dips als Behälter verwendet, die Inhalt darin enthalten. Und dann ist die Idee, dass wir mit CSS Styling diesen speziellen Dibs, die wir sammeln, Styling anbringen. Geben Sie sie auf I D oder eine Klasse. Und dann strukturieren wir unsere Website. Also normalerweise, bevor Sie so etwas wie ich d gleich Header haben würden. Also fügen wir dieses Attribut von Header hinzu und dann würde dies hier oben gehen. Und dann hätten wir einen anderen hier für Navigationen hätte ein I d knave oder so etwas , je nachdem, was wir es nennen wollten, und dann hier unten, damit wir ein anderes div haben würden und dieses würde unsere -Inhalt. Also würden wir es vielleicht so etwas wie Container oder so etwas nennen. Und dann haben wir schließlich ein anderes div hier unten namens Footer. Also, als html five kam, haben wir tatsächlich viele dieser verschiedenen Arten von Dibs weggegeben , die wir für die Strukturierung verwenden. Und jetzt haben wir aktuelle Tags, die verwendet werden, um dieses Markup zu ersetzen. Anstatt also einen div i d Header zu haben, hätten wir einfach ein Header-Tag und dann hätte hier ein knave Tag, und dann hätten wir hier, ah, ein Foto-Tag und dann auch die Container. Nun, da hat es einige Änderungen gegeben. Dies ist also wieder abhängig davon, was Ihre Präferenzen, wenn Sie Ihre Webseiten erstellen. Im Wesentlichen, was ein Diff tut, ist, dass es ähnlich dem, was ein Absatz tut, ist, dass es uns erlaubt, Inhalte zu trennen. Also, wenn ich auf meine Webseite gehe und ich sie jetzt aktualisiere und ich gehe einfach zu einem Laura um ipsum Generator eso, das ist Standardtext, den Sie verwenden können, wenn Sie eine Website erstellen, also machen Sie es authentischer aussehen, so dass Sie nicht nur eine Bündel von Leerabstand. Es ermöglicht Ihnen Teoh besser zu verstehen, was Ihre Website und wie das Layout sein wird. Das ist also, was ich hier hinzufüge, und ich sollte diesen Eid auch durch Absätze trennen. Also einige dieser Generatoren, sie geben Ihnen die Möglichkeit, es als HTML-Code aufzunehmen und einige nicht. Also, jetzt ist es als Absatz getrennt, und ich werde hier im Fußzeilenbereich einen zusätzlichen Text hinzufügen, und ich werde etwas mehr Text innerhalb des Überschriftenbereichs hinzufügen. Und so im Wesentlichen wird dies viel meine Website und mein Textlayout der Website simulieren. Und jetzt können wir besser verstehen, was die Dips tun werden. Also werde ich es auf 100% zurückbringen und wir sehen, wie die Dibs funktionieren. Eso arbeiten sie ähnlich wie Absätze funktionierten, wo sie die gesamte Zeile gefangener Inhalte aufnehmen und, ähm, sie haben einige Abstände darüber, und darunter, in der Reihenfolge, geklebt, in der Lage, zwischen den verschiedenen Dips zu unterscheiden. Also hier haben wir unsere Überschrift hier haben wir unseren Hauptinhaltsbereich, und dann hier, natürlich, haben wir unseren Fußzeilenabschnitt und für ihren Inhalt. Wenn Sie also Styling anwenden wollten, wird es sehr einfach sein, denn jetzt, an diesem Punkt, müssen wir nur zu I d Header gehen. Und dann, natürlich, können wir etwas Styling anwenden, damit ich eine Hintergrundfarbe oder so etwas machen und es aktualisieren kann und wir können sehen, dass wir dieses spezielle def auswählen können. Was wäre, wenn wir tatsächlich ausgewählte Inhalte hier drin sitzen wollten? Was also, wenn ich dieses bestimmte Stück Text hervorheben möchte, aber ich wollte nicht das Ganze hervorheben. Dies ist also, wo wir Spannen und Spannweiten sind ein weiterer dieser HTML-Tags, die wir verwenden können um bestimmte Teile des Inhalts anwenden und auswählen zu können. Wenden Sie das Styling an. Also suche ich nur, wo sich dieser befindet. Und sagen wir, wir wollen etwas Styling darauf anwenden, damit wir Spannen machen können und normalerweise mit Spannweiten würde viel Zeit die Klasse verwenden. Vielleicht könnte ich es so etwas wie Highlight oder so etwas nennen. Und dann, was auch immer Text ich hervorheben möchte, ich würde in diesem bestimmten Element, dem Span-Element, nisten , und dann würde ich zu meinem Styling gehen und ich würde Highlights tun und es könnte Hintergrundfarbe und gelb eso tun. Nein, wenn ich es auffrische, können wir sehen, dass das jetzt gelb ist. Und die Sache mit Spannweiten ist, dass wir bemerken, dass es innerhalb des Textes in Linie hält, so dass es kein zusätzliches Styling darauf anwendet. Es gibt also kein Standardstyling, das darauf angewendet wird, und es funktioniert direkt in unserem Text. Also, jetzt mit dem Aufkommen von HTML fünf, sind wir jetzt alle diese Dibs abgeschnitten. Sie haben tatsächlich eine Umfrage über all die verschiedenen Millionen und Milliarden von Webseiten, und sie fanden die verschiedenen Ideen, die in den Dibs am häufigsten verwendet wurden. Und sie nahmen diese heraus, und in HTML fünf führten sie sie als separate Steuer ein. Im Wesentlichen funktionieren sie genauso wie ein div. Sie werden die gleichen Eigenschaften wie ein Diff nehmen. Aber wir haben nur ein besseres Layout und Strukturierung unserer Webseiten. Also, jetzt können wir angeben, anstatt es ein I d zu geben, ein div mit einem I d zu setzen. Alles, was wir jetzt tun, ist, dass wir Header hier drüben setzen. Jetzt können wir dies so einstellen, dass dies typisch ist, dass jede Website ein Navigationsmenü haben würde und wir würden dies nur in der Regel wie jetzt und jetzt mit Containern einrichten. Container sind also einer von denen, die in der Debatte, weil es verschiedene Arten von Inhalten gibt , die hier vertreten werden. Eso Möglicherweise müssen Sie den Container, Sek., Container-Tags oder Container i d innerhalb verwenden Sek. . Normalerweise haben Container keinen eigenen Satz von Tags wie Kopf- und Fußzeilen und Knaves. Aber wir haben eine Möglichkeit, etwas wie Abschnitt zu tun. Wir können auch Artikel und so weiter tun. Typischerweise würde ein Abschnitt diesen gesamten Containerbereich umfassen. Und wieder, dies ist repräsentativ für die Inhalte, die Sie in diesem Bereich s zur Verfügung stellen. Deshalb halten wir diese Ideen, weil wir normalerweise einen Abschnitt als Trennlinie für die Struktur haben würden . Und dann hätten wir zusätzliche Abschnitte. Oder vielleicht würden wir Artikel und so weiter haben, was die verschiedenen Inhaltsstrukturen darstellen, die wir innerhalb unseres HTML-Codes haben. Also werde ich diese 1/2 Fußzeile jetzt und jetzt anpassen, wenn ich sie aktualisiere. Also, natürlich muss ich mein CSS auch aktualisieren, um den neuen Überschriftenabschnitt eso wieder darzustellen , Sie müssen wirklich vorsichtig sein, da Sie normalerweise innerhalb des Abschnitts möglicherweise Header wiederverwenden könnten. Fußzeile immer und immer wieder. Und wenn das der Fall ist, dann müssen Sie natürlich spezifischer mit Ihrem Selektor sein. Aber weil ich dieses Mal nur Header in meinem HTML-Code verwende, kann ich damit davonkommen, nicht spezifisch zu sein. Aber wenn es um CSS geht, müssen Sie wirklich vorsichtig mit Ihren Selektoren sein und sicherstellen, dass Sie Ihre Elemente richtig auswählen und sicherstellen, dass Sie diejenigen erhalten, die Sie wollen, aber auch keine Teile Ihrer HTML-Code, den Sie nicht in ihre. Also, wenn ich so etwas wie knave auswählen wollte, aber dann hatte ich woanders eine zusätzliche Navigation. Vielleicht kleinere Navigation. Ich möchte nicht, dass mein Navigationsleisten-Styling Teoh auf zusätzlichen Navigationsbereichen implementiert wird . Oder vielleicht mache ich es wieder. Es hängt davon ab, was und wie Sie Ihre Website einrichten. Also, jetzt werde ich wieder raus gehen und es auffrischen, und jetzt sehen wir, dass die Kopfzeile wieder rot ist. Also wieder werden wir feststellen, dass wir nicht verwenden. Es gibt so viel, aber sie haben immer noch ihren Platz. Also, wenn Sie Styling Teoh die gesamte Webseite anwenden möchten, möchten Sie vielleicht ein div verwenden und es dann hier schließen, bevor wir den Körper beenden. Und das gibt uns die Möglichkeit, Styling in diesem gesamten Inhaltsbereich anzuwenden, so dass wir nicht unbedingt Styling an den Körper anbringen müssen. Wir können mit uns davonkommen, schlüpfen es bis zu diesem Tag, von dem nur ein Rapper ist, falls wir nicht wollen Styling auf einen bestimmten Körper anwenden. Dann müssen wir nur diesen I d Rapper eso nicht einschließen. Jetzt kann ich auf Rapper zugreifen und ich kann etwas Styling auf Rapper eso setzen, wenn ich eine Seite auswählen möchte , mit der wir Ihnen zeigen werden, wie das in der kommenden Lektion zu tun ist. Eso, wenn wir das tun wollen und wir wollen Ah setzen, mit dieser Seite, wir könnten das einfach tun, indem wir dieses def auswählen, so dass sie immer noch ihren Platz haben, um Styling auch jetzt anzuwenden, innerhalb von HTML fünf 14. HTML-Kurs mit CSS verwandeln deinen HTML in eine Webseite: in dieser Lektion. Ich möchte ein wenig tiefer in die Erstellung einer tatsächlichen Website aus all diesem HTML-Code schauen, den wir in den vorherigen Lektionen angesehen haben. Also werde ich den Header aktualisieren und ich werde nur so etwas wie meinen Firmennamen schreiben. Und dann wird das in der Kopfzeile enthalten sein. Und dann, natürlich, haben wir unseren Navigationsbereich und ich werde diese Hintergrundfarbe für ihre loswerden und ich werde die Farben ein bisschen besser aktualisieren. Vielleicht behalte ich das Highlight. Gehen Sie abstimmen und aktualisieren Sie die Seite. Also haben wir unseren Firmennamen. Wir haben unsere Navigationsleiste. Wir haben alle unsere Inhalte hier und dann unsere Fußzeileninformationen. Also werde ich das aktualisieren, um eher typisch für eine Website zu sein. Also vielleicht ein paar Copyright-Informationen, und dann werde ich einige Piper-Links hier unten hinzufügen, und ich werde es noch nicht überall hin gehen lassen, damit wir das bei Bedarf aktualisieren können, wann immer wir in diesen Seiten hinzufügen . Das wird also leeren Hash behalten. Da ist oh, das wird die Seite neu laden und dann schließen Sie sie aus. Und so sieht das jetzt eher wie eine tatsächliche Webseitenstruktur aus. Dann natürlich könnten wir natürlichauch zusätzliche Inhalte hinzufügen. Vielleicht generieren wir einen zusätzlichen Laura Mo-Text. Und ich werde nur einen Teil dieses neu generierten Textes kopieren und in unseren Inhalt einfügen. Und ich muss in all diesen Absätzen und abschließenden Absätzen, Tags hinzufügen und möchte auch zurückgehen und ein Bild hier aufnehmen. Also werde ich einfach dieses Standardbild hinzufügen, das wir uns vorher angesehen haben. Also vielleicht füge ich das hier im oberen Textbereich hinzu und aktualisiere es, um zu sehen, wie unsere Seiten jetzt aussehen. Jetzt haben wir noch mehr Text. Wir haben ein Bild. Wir haben eine klare Fußzeile, Navigation und ah, Überschrift Bereich. So können wir jetzt voran gehen und etwas Styling anwenden. Eso in der Regel innerhalb unseres Navigationsmenüs eso diese wäre Länge Also dies wären Hyperlinks. Also alle aktualisieren sie als solche Und auch wir haben wahrscheinlich auf über Abschnitt. Also nenn das ein Boot und dann verlor Lee, wir haben wahrscheinlich so etwas wie Kontakt oder so etwas. Dies ist typisch für Websites, daher wären dies wahrscheinlich drei typische Navigationselemente. Hier s so ist dies eher eine Navigationsleiste. Also jetzt müssen wir etwas zusätzliches Styling anwenden. Also haben wir uns bereits angesehen, wie wir uns innerhalb des Listentyps bewerben, also gehen Sie einfach zurück zu dem und werfen Sie einen Blick auf unsere UL. So ist der Typ der Ul-Liste keine. Wir müssen auch diese Ränder und Padding aktualisieren. Das wäre also Marge, nur um sicherzustellen, dass wir kein anhaltendes Styling aus der geordneten Liste haben , weil sie bemerkt haben, dass wir hier standardmäßig eine Marge haben. Wir haben etwas Padding ihre eso, wenn wir das entfernen. Das ist im Wesentlichen, dass Anno die Liste vollständig seiner Standard-Ränder und Poundings bestellt hat. Die andere Sache, die wir tun müssen, ist, dass wir Teoh es in einem Blockformat anzeigen müssen, und wenn wir es betrachten, haben wir bereits in der Reihe. Also werde ich das einfach aktualisieren, um im Zeilenblock zu sein. Das ist eine bessere Formatierung für unsere Listenelemente und dannkann ich hier tatsächlich eine Breite festlegen oder etwas, das ich verwenden möchte, und ich werde nur für die Hyperlinks aktualisieren, um dieses kann ich hier tatsächlich eine Breite festlegen oder etwas, das ich verwenden möchte, und ich werde nur für die Hyperlinks aktualisieren Padding einzuschließen, so dass es direkt um diesen Hyperlink geht eso Dies wird ein mit dieser ganzen Listenelement Zelle sein. Also, wenn ich es aktualisiere, können wir das Space Date ein bisschen besser sehen. Und dann direkt darunter, werde ich diese ein oder hat Listenelemente aktualisieren, die Ah, Hyperlink haben . Und dann werde ich hier einen Anzeigeblock machen, um sicherzustellen, dass er tatsächlich als Block angezeigt wird. Und ich werde ihm den Text in die Mitte geben, um sicherzustellen, dass mein Text ein Zeilenzentrum ist. Ich möchte die Unterstreichungen entfernen. So Textdekoration keine. Und ich möchte eine Hintergrundfarbe festlegen, weil ich sie auch aktualisieren möchte, wenn sie über den Mauszeiger bewegt wird . Also werde ich es einfach als großartig festlegen, und ich werde ihm eine Farbe von Weiß geben, die Textfarbe von Weiß. Sieh mal, wie das aussieht. So, jetzt beginnt es mehr wie eine tatsächliche Navigationsleiste aussehen. Und natürlich, jetzt müssen wir nur diesen Hover-Effekt hinzufügen, damit wir dies durch Listenelement Ally a hinzufügen und hinzufügen und schweben können , und immer, um jetzt zu tun, ist der Hintergrund zu aktualisieren. Also, wenn es über den Mauszeiger bewegt wird, kann ich die Hintergrundfarbe aktualisieren. Vielleicht verwandle ich es in Block. Sie sehen also, dass wir diese Hervorhebung dort haben. Und dann natürlich können wir natürlichdie eigentliche Navigationsleiste komplett aktualisieren, damit wir dort etwas wie so falsch nehmen können . Also ist es nur ah, wir können vielleicht eine schwarze Linie über die ganze Sache setzen, wo wir so etwas auch tun können . Und jetzt können wir es auswählen, indem wir nav selbst auswählen und ihm das Elternteil geben, damit wir ihm eine Hintergrundfarbe geben können . Wir können sicherstellen, dass es mit 100% ist und schauen und sehen, wie das ab und zu aussieht. Schließlich möchte ich hier wieder rüber gehen, weil eigentlich, ich sollte etwas Eintopfen hinzufügen, also werde ich hinzufügen, nur nach oben und unten klopfen, und ich werde keine Polsterung auf links und rechts haben eso jetzt, wo wir eine voll, mehr Stil Navigationsleiste, so ein paar andere Stücke, die wir auch aktualisieren sollten. Jetzt, da wir ein Rapper-Set haben. Wenn also tatsächlich einen Standard mit setzen wollen, könnten wir so etwas wie Max mit eso setzen. Dies wird es reaktionsfähiger machen. Wann immer wir Größe neu, wird es automatisch auf 100% gehen, so dass wir etwas wie maximale Breite von 11 40 Pixel tun könnten. Und dann, natürlich, müssen wir es in der Art und Weise zentrieren, dass wir unseren Inhalt zentrieren, ist es Ah, Marge von Null oben und unten, ein Auto links und Raten. Also, jetzt, wenn ich es aktualisiere, war es tatsächlich für unseren Inhalt zentriert und wir sollten auch unseren Header aktualisieren . Also aktualisieren oder Header, vielleicht können wir einige zusätzliche Hintergrundfarbe oder Styling hinzufügen. Also werde ich einfach Hintergrund machen. Also tun Sie so etwas für den Hintergrund und wir sollten diesen Text weiß machen. Und wir sollten dort etwas Polsterung hinzufügen. Vielleicht kann ich 25 Picks machen und so gekämpft Größe von 24 Picks. So aktualisieren Sie das und sehen Sie, wie das aussieht, sieht aus wie eine Website. Und natürlich sollten wir etwas mit diesem Bild machen, weil wir es im Einklang mit dem Text uns haben wollen. Nun, also gehen Sie zurück zu unserer Quelle. Also werden wir es tun, wir werden es nach links schweben. Das wird also das Bild nach links von jedem Inhalt ziehen. Und natürlich sollten wir einen Spielraum haben, Sohn. Das wird anwesend sein. Auswählen, Rand, Aktualisieren. Es ist in unserem Bild auf der linken Seite schweben. Hier haben wir unsere Marge um sie herum. Und schließlich müssen wir jetzt nur unsere Fußzeile aktualisieren. Und mit der Fußzeile werde ich auch eine Hintergrundfarbe setzen. Und ich werde dort auch etwas Polsterung machen. So sticht es ein bisschen mehr in der Mitte. Und jetzt können wir sehen, dass wir eine mehr gestylt und mehr von einem typischen Website-Gefühl zu unserem HTML-Code haben. So aktualisieren Sie Ihren HTML-Code und verwandeln ihn tatsächlich in das, was mehr wie eine Website aussieht , mit CSS und Styling 15. Wenden Sie an, was wir in dem Kurs gelernt haben: Also möchte ich diesen HTML-Kurs beenden, indem ich die verschiedenen Tags anwende, über die wir während des Kurses gesprochen hatten . Also hatten wir auch über Überschriften-Tags gesprochen und uns angeschaut. Also, wenn wir hier bemerken, dass unsere Webseite tatsächlich keine Überschrift hat und wir tatsächlich einige Überschrifteninformationen hier einfügen sollten , damit wir mit einem H ein Tag beginnen können und dies normalerweise ähnlich wäre, was in meinem Titel enthalten ist. Also, wenn ich hier HTML-Kurs hätte, könnte ich sehr gut H ein Tags hier mit h html natürlich setzen . Und dann, natürlich, wenn ich verschiedene Abschnitte in hier hatte, Also, wenn ich meinen ersten Abschnitt oder so etwas hätte, Also werde ich in einigen zusätzlichen Abschnitten hinzufügen und ich werde diesen Abschnitt schließen und ich bin Ich werde einen Abschnitt zur Gehirnnutzung haben und dann, natürlich, den Abschnitt geschlossen, damit ich immer öffne und schließe, um sicherzustellen, dass ich all diese Elemente habe. Letztendlich möchte ich das vielleicht herausziehen und hte-Tags einrichten. Also, wenn ich dort einige neue Untertitelinformationen hatte und dann, wenn ich meine Website in dieser Art von Mode aussehen lasse. Dann möchte ich diese H-Zweien auch hier verwenden, so dass ich eine gute, ähnliche Struktur wie meine Website habe . Und Sie können sehen, dass ich jetzt meine beiden habe. Ich habe meine h twos eingerichtet und alles ist bereit, innerhalb meiner Web-Inhalte zu gehen. Also, obwohl ich vielleicht dieses Bild anpassen sollte, weil es gerade jetzt, wo ich dieses neue Schnitt habe , passt dieses Bild nicht wirklich so gut mit dem Fluss der Website. Also natürlich, manchmal sollten Sie einige Anpassungen vornehmen. Was ich eigentlich tun werde, ist, dass ich den Code aktualisieren werde, und ich werde dort einen zusätzlichen Text hinzufügen, damit dieser erste Abschnitt länger sein wird und ich mehr Informationen darin enthalten werde, damit es mehr aussehen wird vorzeigbar und mawr im Einklang mit den anderen Unterpositionen. Sie sind also eines der Dinge, die Sie sicherstellen müssen, und stellen Sie sicher, dass Sie beobachten wenn Sie diese Arten von Überschriften erstellen. Eso. Eine andere Sache, über die wir gesprochen hatten, ist, wie man Zeilenumbrüche erstellt. Also vielleicht hier drin, füge ich einfach einen Zeilenumbruch hinzu. Also beginnend, wenn Sie das waren, äh neue Informationen, vielleicht wollen wir es auf einer neuen Linie beginnen. Eso haben wir über Hyperlinks in Bildern hinzufügen sprechen eso auch, wenn wir Kommentare einzurichten eso in der Regel möchte ich in einem Kommentar hier oben hinzufügen und sagen ein Logo einen Punkt oder so etwas, so dass ich weiß, dass ich diese Notiz hier dass ich definitiv eine lokale hinzufügen möchte, vielleicht eine Unterzeile darunter oder etwas Mawr, um über diese bestimmte Seite beschreibender zu sein . Also, jetzt, wenn ich aktualisiere, ist es so, jetzt haben wir alle typischen Elemente, die Sie in HTML-Seiten verwendet sehen würden und wir haben alles schön und ordentlich, schön und ordentlich mit CSS