Meisterkurs für HTML- und CSS-Webentwicklung - Erstelle deine erste Website | Luis Carlos | Skillshare

Playback-Geschwindigkeit


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

Meisterkurs für HTML- und CSS-Webentwicklung - Erstelle deine erste Website

teacher avatar Luis Carlos, Engineer, Web Developer and 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

39 Einheiten (2 Std. 56 Min.)
    • 1. Trailer

      1:40
    • 2. Einführung

      1:10
    • 3. Code-Editor

      1:46
    • 4. HTML-Struktur

      2:24
    • 5. Die wichtigsten HTML-Elemente

      1:39
    • 6. HTML-Eigenschaften

      1:42
    • 7. Seitentitel und Überschrift erstellen

      3:05
    • 8. Einfügen deiner ersten Absätze

      3:13
    • 9. Textformatierung

      4:34
    • 10. Bilder hinzufügen

      2:23
    • 11. HTML-Listen

      2:18
    • 12. Erstellen von Hyperlinks

      4:46
    • 13. Tabellen

      2:52
    • 14. Kommentare hinzufügen

      1:43
    • 15. HTML

      2:58
    • 16. HTML I

      5:43
    • 17. HTML II

      2:59
    • 18. Einführung in die Multimedia-Inhalte

      0:48
    • 19. Videos in einer Website hinzufügen

      2:57
    • 20. Audio hinzufügen – HTML5

      2:02
    • 21. Objektmarke

      1:40
    • 22. Interaktive Inhalte mit der Tag - HTML5 hinzufügen

      1:25
    • 23. Youtube-Videos hinzufügen

      3:13
    • 24. Gestalte eine an

      2:54
    • 25. Einführung in die CSS

      1:48
    • 26. CSS-Syntax

      3:16
    • 27. Kurs- und Id-Selektoren

      6:35
    • 28. So fügst du CSS Styles hinzu

      8:27
    • 29. Boxmodell – Rahmen, Rand und Fülleigenschaften

      8:25
    • 30. CSS Schrifteigenschaften

      6:51
    • 31. Texteigenschaften

      5:04
    • 32. Block- und Inline-Elemente (Div und Span

      5:42
    • 33. Breite und Height

      5:23
    • 34. Eigenschaft positionieren

      9:47
    • 35. Schatten und klaren Eigenschaften

      7:02
    • 36. Relative und absolute Einheiten

      14:56
    • 37. Projekt Nr1 – Erstelle eine Webgalerie mit HTML und CSS

      13:44
    • 38. Projekt Nr2 – Webpage

      16:49
    • 39. Congratulations

      0:19
  • --
  • 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.

2.589

Teilnehmer:innen

1

Projekt

Über diesen Kurs


HTML
und CSS Web Development Masterclass ist ein Einführungskurs zur Webentwicklung, wo ich dir die wichtigsten Konzepte der HTML-Sprache und die Beziehung mit CSS erklären, die dir auf perfekte Websites führt ()

HTML ist eine power die dir dabei hilft, mobile Anwendung, Websites zu entwickeln und mit anderen Sprachen wie JavaScript oder PHP zu arbeiten, die dir die Erstellung von dinamic ermöglicht.

B3fTBjg.jpg

Warum du an diesem Kurs teilnimmst?

Dieser Kurs hilft dir, die Grundlagen von HTML, HTML5 und CSS zu lernen und richtet sich an Benutzer, die nur nur nicht oder keine HTML haben und die die Grundkonzepte zu erwerben.

Ein gutes Verständnis in HTML ist einer der wichtigsten Schlüssel zum Entwickeln von Websites und in diesem kurzen Kurs lernst du die Grundlagen der Sprache.

Nach dem Kurs kannst du in der Lage sein, in Zukunft eine statische Inhaltsseite zu erstellen und deine Kenntnisse in HTML vertiefen und die ersten Konzepte zu lernen.

Am Ende kannst du einen Kommentar hinterlassen

Viel Glück!!

Was du in diesem Kurs lernen wirst:

  • Auswahl des Code-Editors

  • HTML
  • HTML(5) Elemente und Attribute

  • Paragraph und Textformatierung

  • Kommentare

    hinzufügen
  • Die Erstellung von Tabellen und Listen zur Darstellung von Daten in verschiedenen Formaten

  • Hyperlinks, um dich mit anderen Seiten zu verbinden und mit den internen Seiteninhalten zu "springen"

  • Die Erstellung von Formularen

  • Verwendung von Bildern und Multimedia einer Webseite (Video und Audio)

  • Gestalte eine a

  • Verstehe die Verwendung von CSS auf den style

  • Grundlegende CSS-Syntax

  • Verwendung von CSS Boxmodell und einige CSS-Eigenschaften, um deine Webseite zu organisieren.

  • Verwendung von Kursen und ID-Auswahl

  • Die Bedeutung und das Einstiegsmodell verstehen

  • Block- und Inline-Elemente definieren

  • Elemente in verschiedenen Punkten der Seite zur Erstellung einer Layoutstruktur

  • Breite und Height

  • Positionseigenschaften

  • Schatten und klaren Eigenschaften

  • Relative und absolute Einheiten

  • #Projekt – Webgalerie
  • #ProjektWebpage

 

Was ist die Zielgruppe?

  • Dieser Kurs richtet sich an Anfänger:innen in der Welt der Technologie und der Webentwicklung



Wenn du mehr im web lernen möchtest, kannst du dir meine anderen Kurse anschauen:

Triff deine:n Kursleiter:in

Teacher Profile Image

Luis Carlos

Engineer, Web Developer and Instructor

Kursleiter:in

Currently, I am an exciting Engineer and Trainer , who loves to learn and share knowledge and new experiences.

As Trainer participated in many projects directed to student in the areas of math, computer science, new technologies and web development . Several years of training helped me developed many skills that contribute to the personal development of each people.

You can follow some of my articles in my website where i share some tutorials in the area of new technologies.

Follow me on Skillshare!

 

 

 

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. Trailer: Ich begrüße die HTML und CSS kers. Wir sind das wahre Leben in der Welt. Off-Web-Entwicklung Mein Name ist Wish College. Ich bin Webentwickler und Instruktor, und das wird unser Leitfaden in den nächsten Stunden sein. Indus Klasse Sie lernen HTML-Sprache Das ist die grundlegenden Strukturelemente verwendet, um Web-Seiten und CSS zu erstellen pH-Inhalt Stil, was Sie zu einem perfekt heraus und Design führt. Sie lernen den Grad HTML und CSS Gold auf einfache, effiziente und lustige Art und Weise. Diskursive ist in Modelle unterteilt, in denen Sie in der ersten lernen. Alle Grundelemente, die in einer Waffe verwendet werden, werden ebenfalls vorgestellt. Der Vormarsch. Sobald das Ihnen erlaubt, ihre Website auf eine andere Ebene im zweiten Modul zu bringen, werde ich Ihnen die Syntax und Eigenschaften von CSS-Sprache beibringen, die Ihr Website-Design zu verbessern. Am Ende der Diskussion, werden Sie ein HTML- und CSS-Experten in der Lage sein, Ihre eigenen Websites ohne Komplikationen in ländlichen Berg zu bauen und genießen Sie 2. Einführung: die Welt des Internets und sein Wachstum. Bringen Sie uns eine Reihe neuer Herausforderungen und Möglichkeiten wie erstellen Sie Ihr Online-Geschäft, generiert Multimedia-Inhalte, nutzen Sie Social-Media-Anwendungen und andere Arten von Diensten, um Online-Inhalte zu erstellen. Wir verwendeten die Website durch seine Sprache HTML, Das ist definiert S a Markup Sprache statisch verwendet, wo Seiteninhalte diese Sprache verwendet wird, um die Struktur von Webseiten mit Markup zu beschreiben. HTML ist die Sprache, mit der Sie viele verschiedene Inhalte darstellen können. Die Sprache als Elemente, die von Technikern dargestellt werden, die verwendet werden, um Inhalte wie Vera Griffs Tabellen, Bilder, Papierlinks und so eine zu erstellen Vera Griffs Tabellen, Bilder, . In den nächsten Videos lernen Sie, einige dieser Inhalte auf Ihrer Website zu erstellen. 3. Code-Editor: L O Schüler, nachdem Sie in erster Klasse Dienstprogramm aus veg Daniel Sprache lernen. Ich stelle jetzt die Software vor, die verwendet wurde, um Ziege für mehrere Sprachen zu schreiben, einschließlich HTML. Das Programm verwendet seine Klammern und intelligente und moderne Open Source, wo Sie Ihre Kälte schneller schreiben können, indem Sie automatisch verschiedene Kult-Elemente erkennen und nutzen Sie den Lebensbereich in der rechten und Spalte, die Sie mit öffnen können eine Maus. Klicken Sie auf den Browser mit diesem Aiken auf der rechten Seite neben der Anwendung. Die linke Spalte und die Spalte listet die Arbeitsdateien auf, darunter befindet sich eine Ordneransicht. In diesem letzten volleren. Sie können eine Datei mit einem Klick anzeigen, ohne sie tatsächlich zu öffnen. Ein Doppelklick öffnet die Datei zur Bearbeitung fügt sie zur Liste der Arbeitsdateien hinzu. Sie müssen auf diese Website Briketts dot io gehen und klicken Sie auf Klammern herunterladen. Um den Download in STEL-Datei zu starten, müssen Sie Anweisungen befolgen, die sehr einfach sind. In etwa zwei Minuten stehen Sie F-Klammern in Tarnung. Der letzte Schritt besteht darin, zu Ihren Programmen zu gehen und Klammern auszuwählen, um die Anwendung zu starten. Sie können jetzt mit dem Schreiben von HTML-Code beginnen. Wir sehen uns als Nächstes. Video Studenten 4. HTML-Struktur: Das Hauptziel dieser Klasse ist es, oft die Grundstruktur zu erlernen . HTML-Dokument. Bevor ich beginne, werde ich eine neue ausgefüllte E-Mail-Datei erstellen, die für die Art und Weise verwendet werden soll, die ich erstellen möchte . Ich gehe zu Männern eine Datei, wähle neue und sichere in Ordnerdateien mit Namen, zu Hause und Erweiterung HTML. Wie ich bereits sagte, eine HTML-Datei als verschiedene Arten von Inhalten Grund, warum wir X verwendet haben, um zwischen ihnen zu unterscheiden. Die Hauptstruktur. Oven HTML-Dokumente als Siris der Steuer, die für alle Dokumente gemeinsam sind, werde ich jetzt in der Erstellt die Decks abgelegt, die Teile aus dieser Struktur machen. Zuerst muss HTML mit dem Dokumenttyp Deklaration duck Typ HTML beginnen. Diese Erklärung definiert den Tod. Dieses Dokument entspricht der Version fünf von html. Die HTML-Dokumente beginnen jetzt mit Deck HTML, und wir würden HTML am unteren Rand des Dokuments, das das Wurzelelement ist, oft HTML-Seite Schrägstrich . Als Nächstes. Das Element ist das erste Element, das nach dem öffnenden HTML-Tag angezeigt wird. In dem Dokument bei haben wir Dinge wie den Seitentitel mit Titeltechnologie platziert, fügen wir JavaScript zu unserem Patch mit Skript, Tech, Endlink zu externen Stylesheets und andere Ressource ist schließlich der sichtbare Teil aus der -Dokumente. Wo schreiben wir großen Teil aus unserem Mantel. Dieser Teil aus dem HTML-Dokument ist zwischen dem Start- und End-Body-Tag Wir haben jetzt. Mach meinen Instruktor weg. Unser Dokument definiert Sie sind nun bereit, die Inhalte auf Ihrer Webseite zu erstellen. 5. Die wichtigsten HTML-Elemente: Willkommen wieder zu diesem neuen Video. Nun ist die Dokumentstruktur definiert. Mal sehen, was sind die Elemente in einer HTML-Datei? Wie ich in der Einführung sagte HTML als Elemente, die durch Tags dargestellt werden, besteht ein HTML-Element normalerweise aus startek und einem Antec mit dem Inhalt zwischen ihnen eingefügt. Erkennen des angegebenen Namens. Eine bestimmte Art von Inhalt, die ein Hinzufügen von Bildern Gefahr sein kann, ref Tabellen am wenigsten aufhören und andere Arten von Inhalten. Wenn Sie die Software verwenden und schreiben Sie das weniger als-Signal, das Sie sehen können, erscheint eine Menge Text, den Sie verwenden können, wenn Sie eine Schulden schreiben, es erstellt automatisch das Enddeck, wie Sie sehen, wenn ich die Dokumentstruktur erstellen . In diesem Beispiel Situation. Ich schrieb ein Absatz-Tag beginnend und endet Tech, und jetzt schreibe ich Tech-Tabelle, die verwendet wird, um Tabellen in HTML zu erstellen. Nun, da Sie wissen, Text zu verwenden, um verschiedene Inhalte zu erstellen, lassen Sie uns auf die nächste Ebene zu bewegen. Verpassen Sie nicht das nächste Video, in dem Sie lernen, was Elemente, Attribute und ihre Bedeutungsind Attribute und ihre Bedeutung 6. HTML-Eigenschaften: die HTML-Elemente. Wie Sie schon gesehen haben, habe ich von Tex vertreten. Jedes Element kann einen Arm haben, sind Attribute, die ein Netz Wurzeln zusätzliche Informationen über ein Element bieten . Sie sind immer im startek angegeben und haben normalerweise einen Tributnamen und entsprechenden Wert. Ich werde jetzt aufmachen. Erkennen, dass für Bilder verwendet wird. E m g tec Wenn Sie sich erinnern, sagte ich in der HTML Elements Video, dass in der Regel startek als entsprechende Endtechnologie. Die Bildtechnologie ist eine aus dem Text, die dieser Regel nicht folgen. Nur mit einem beginnenden Schwanz, der jetzt zur Bildtechnologie in den am wenigsten Off-Attributen zurückkehrt, die ich zuerst mit dem Tod zeigen werde , erhält eine Zahl, die das mit aus dem Bild angibt , und das andere ist das Ich habe, das das ich habe aus dem Bild, das mit diesen beiden Attributen eingefügt wurde. Sie können die Bildgröße auf Ihrer Webseite jederzeit ändern. Dies sind nur zwei Attribute. Der Tod. Ein Bildelement kann f, wenn wir Bilder in den zukünftigen Videos hinzufügen, Sie können mehr Attribute für dieses Element sehen 7. Seitentitel und Überschrift erstellen: Hallo nochmals und herzlichen Glückwunsch für die Reichweite an. Trotz des Fluchs lernen Sie in den besten Lektionen den Unterschied zu überzeugen und Text, den Sie in HTML verwenden können . Jetzt ist es an der Zeit, eine Website zu erstellen. Das Hauptziel der nächsten Lektionen ist es, Text und Bilder, Inhalte in Seiten, Off-Website und F-Papier-Links zu erstellen Inhalte in Seiten, , um zwischen ihnen zu navigieren. Das Team, das ich entwickeln werde, ist eine Agenturreise, wo ich beschreiben werde und immer ein Ziel. Die erste Änderung, die ich auf der Seite tun werde, ist die Titelschuld erscheint oben, ändern Sie den Inhalt von Titel-Tech, um mit uns zu reisen. Jetzt werde ich mein Thema mit der Hinzufügung Tech schreiben. Html. Eddings liefern wertvolle Informationen, indem sie wichtige Themen hervorheben und die Dokumentenstruktur verstehen . weiterer großer Vorteil ist die Verwendung von Todessuchmaschinen, indem sie als Indikator dafür hinzufügen, welcher Text auf einer Seite am wichtigsten ist. Wenn Sie eine integrale Seite essen müssen, sollte diejenige, die Eddings verwendet, oberhalb dieser Seite erscheinen. Der Tod hat nicht in den Suchergebnissen. HTML verwenden sechs Ebenen aus Hinzufügen Decks Alter 12 h sechs, wo das Alter eins definiert die wichtigsten und eine sechs. Das am wenigsten Wichtige haben. Also werde ich mein alles mit dem HTML-Code schreiben, beginnend mit der Technik es eins und das Einfügen der Decks, die verwendet werden. S-Seite Thema tat, wie ich Ihnen vor einem Schlag sagte, der über Reiseziel in Verkleidung spricht . Ich werde über Indien sprechen und einige Informationen über dieses Land für diese Jungs beschreiben . Ich habe ihm den Text willkommen gestellt. Aber zwischen dem Hinzufügen von Tex, werde ich eine weitere Kopie machen und das Hinzufügen von Technologie zu Alter von zwei Jahren ändern und die Unterschiede zwischen ihnen sehen . Jetzt, da ich die Änderungen vornehme, können Sie die Unterschiede in Bruder sehen, indem Sie die Lebensbewertung verwenden, um oben mit einem und unten mit etwas an der Spitze zu beginnen . Sie können den Titel Reisen mit uns sehen, dass ich in den Titel Tech ändern. Ich habe jetzt mein Hauptthema in Wo, Pledge Using the Endungen. Nächstes Video, werde ich über Absätze sprechen 8. Einfügen deiner ersten Absätze: Willkommen wieder, Studenten. An diesem Punkt außerhalb der Klasse ändern wir den Seitentitel und schreiben das Hauptthema mit der Hinzufügung Tech. Es ist Zeit, etwas Text über das Thema der Seite zu schreiben. Ich gehe jetzt in die Sache. Die Absätze. Sie sind eine der am häufigsten verwendeten. Html TEX Der Absatz Tech wird paarweise verwendet, das Öffnungsdeck mit P geht vor den Bären ref Texten und das schließende Tech Fleisch geht nach dem Text. Sie sollten die Absätze verwenden, um Textblöcke innerhalb Ihrer Webseite zu verwenden. Der Browser bei automatischen Zeilenumbrüchen vor und nach Ihren Absätzen, um der Seite ein konsistentes Aussehen zu geben . In meinem erstellten Ordner habe ich eine Datei namens Text India, wo ich die Decks habe, die ich für die Seite möchte. Sie müssen nur öffnen, kopieren und jetzt zwischen dem Absatz-Tag einfügen. Jetzt, da ich den Text einfüge, speichern wir die Datei und sehen, wie sie im Browser aussieht. Sie können jetzt den Text auf unserer eigenen Seite mit dem Hinzufügen oben sehen. Obwohl in meiner HTML-Datei der Kopiertext mit vielen Zeilen und Manu Leerzeichen zwischen Wörtern angezeigt wird. Der Browser spiegelt diese verschiedenen Linien in Gewürzen nicht wider, da alle Decks damit fallen. Linien in Leerzeichen werden vom Browser ignoriert. Wenn ich jetzt eine Kopie von Absatzinhalt machen, können Sie sehen, dass die Seite als ein weiterer Bär ref Ende aus Eltern zu verwenden. Wie ich bereits sagte, bei Zeilenumbrüchen am Anfang. Indianer außerhalb der neuen Barriere Wenn Sie mehr Zeilenumbrüche zwischen Absätzen oder 80 und über Text, Bild oder anderen Inhalten haben möchten , können Sie die Zeilenumbruch-Technologie verwenden, die durch B R dargestellt wird. Dieses Deck ist nur die Öffnung dick Ich benutze jetzt meine HTML-Datei, um Zeilenumbrüche hinein zu setzen. Meine erste Ersatzref gebissen die Worte Ozean und Indien und eine andere zwischen den beiden Absätzen mit dem Haupttext, den Sie im Browser sehen können. X hat erwartet, dass Sie einen Zeilenumbruch nach der Ozeanarbeit haben und wenn mehr ein Zeilenumbruch zwischen den Do Bear Riffs sind, sind Zeilenumbrüche sehr nützlich, und wir können sie nicht einfach in unser HTML legen, wo immer wir den Abstand zwischen bestimmte Elemente. Nach diesen beiden Texten werden Sie in der nächsten Lektion etwas Text lernen, um einen Text zu bilden. Bis bald 9. Textformatierung: Hallo wieder, nachdem wir über Absätze und Zeilenumbruch-Tags sprechen, lassen Sie uns die neuen Techniker vorstellen, beginnend mit fett und kursiv, wenn ich einen Bowl-Text definieren möchte. Früher war ich Tech, die in einem einzigen oder mehreren Vorwärtswörtern verwendet werden kann und in einem anderen Zelt wie einem Absatz oder einem Leaper Link oder außerhalb definiert werden kann , nur mit der fett Tech dies zu besteuern. In älteren Versionen von HTML wurden fett und kursiv formatiert. Sie sind deklarativ als abgeschrieben, aber Browser sollten weiterhin abgeschriebene Texte unterstützen, aber schließlich werden die Stände wahrscheinlich veraltet. In der Zukunft. jedoch Dies wurdejedochdurch die Betonung Tech ersetzt, die von E. M und die Stroke Tech standardmäßig repräsentiert wird. Dies wird kursiv und fett angezeigt, so dass wir sie als Directorersatz verwenden können. Plus, diese neuen Text werden mit den neuen neuesten HTML-Standards, die Betonung ed Strich html Tex erfüllt . Ich habe auf die gleiche Weise wie andere Texte verwendet. Wir platzieren das öffnende Tag vor dem Text und dann die abschließende Technologie nach dem Text, den wir schreiben möchten. Ich werde jetzt unsere HTML-Seite für diese beiden Texte in Situationen zuerst verwenden, um es mit starken Tech Wert zu bilden , Indien In meinem Absatz muss nur das Wort hinein setzen. Die Starken beginnen eine Endtechnologie für die andere Situation. Ich möchte außerhalb des Bären ref erstellen. Wir würden starke Betonung Formate. Der Text. Das ist ein Text. Wir würden starke Tag suchen auf die Seite, nachdem wir sparen Sie das Ergebnis mit der Welt mit starken Betonung Format innerhalb Bär, ref und die nächste außerhalb erwartet Welt mit starken Betonung Format innerhalb Bär, sehen. Lassen Sie uns jetzt das gleiche Verfahren mit E m Tech machen. Ich benutzte dieselben Worte, um diese Änderung vorzunehmen. Zuerst das Wort Indien innerhalb des Textes und neben dem Text, wo ich werde die Decks von stark zu wechseln . Erwarten Sie, hervorzuheben, dass der Text mit Tele-Größe erwartet im Browser sichtbar ist . Die Änderungen mit der GM-Technologie der Martek ist der nächste, über den wir sprechen. Dieses Tag wird verwendet. Wenn Sie Teile Ihres Textes hervorheben möchten, lassen Sie uns jetzt sehen, wie er im Browser aussieht. Ich benutze wieder das Wort Indien, um zwischen dieser neuen Technologie die Öffnung des Browsers setzen. Sie können Schulden Bezirk sehen. Ich mag es, Worte zu machen, wie ich schon sagte, nach dem Martek. Es ist Zeit, kleine Tag, die, wie der Name sagt, definiert einen kleineren Text mit Jetzt dieses Deck für off. Text von meinem bloßen Ref und sehen Sie die Ergebnisse. Mit dem Zusatz aus diesem neuen Tag im Browser, Sie sehen, dass Teil aus Bär linken Text ist jetzt kleiner, die beiden lastex unsere Ansicht und stattdessen die erste definiert auseinander Text, der in einem Dokument gelöscht wird und die zweite ein Wort unsere Techniker , die in ein Dokument eingefügt wird. Im nächsten Beispiel werden sie zusammen verwendet. Ich möchte das Wort Indien löschen und setzen Thailands die Arbeit, die ich in Größe Text Deal setzen möchte , ist Indien und stattdessen lohnt sich Thailand. Für das gelöschte Wort schlägt der Browser eine Zeile zu unter gelöschtem Wert, und die eingefügte Arbeit wird nun unterstrichen nach dem Einfügen Tech. Er ist jetzt so weit, Schüler,wir Schüler, sehen uns die nächste Lektion 10. Bilder hinzufügen: Willkommen wieder Studenten, nachdem wir Informa Text hatten. Wir werden jetzt das Bild auf unserer Webseite verwenden. Um Bilder hinzuzufügen, müssen Sie das Bild verwenden. Nehmen Sie, ich bin G, die nur eine Starttechnologie haben. Ich werde meinen Ted für wichtige Attribute schreiben, die zusätzliche Informationen über dieses HTML-Element bereitstellen . Die erste und wichtigste nach produzierte die Quelle, die die Haustiere aus der Datei angibt . Ich werde meine Quelle CRC schreiben und das letzte Bein, das sich in meinem Hauptverzeichnis befindet. Und wenn der Name aus Indien, dass J. Peg, Sie können sehen, dass Software erkannt automatisch defile Bild Schulden in meinem Hauptverzeichnis ist , was sehr nützlich ist. Die anderen drei wichtigen Attribute sind das ult, das einen alternativen Text für ein Bild angibt . Wenn das Bild nicht angezeigt werden kann. Schließlich, die ICT und mit aus dem Bild, um das Bild mit der Größe, die Sie wollen, Ich werde, wenn ich jetzt die Alltech und schreibt Text Indien Bild nach dis Tag I Recht, Ich habe mit Wert für Hunderte Pixel und ich will mit dem Wert zu tun off 300 Pixel Jetzt habe ich das Dokument gespeichert und ich kann das Bild in meinem Browser sehen. Wenn Sie eine von der Größe auf Routen ändern, zum Beispiel, Ich habe 200 Sie können sehen, dass das Bild mit unterschiedlicher Größe erscheint. Wie erwartet, Weniger Aktion, die ich machen möchte, ist es, den Namen des Bildes zu ändern, nicht durch den Browser erkannt werden und kann den Text sehen, den wir im Deck definiert, alle Änderung in meinem Mantel nach Indien. Eins. Das sehe ich im Browser. Das Bild wird jetzt nicht erkannt und der Text im Bild wird angezeigt. Der nächste Schritt von dieser Webseite besteht darin, mit einem Link auf Seiten außerhalb der Website zu verlinken. 11. HTML-Listen: Für dieses neue Video lernen Sie, Listen zu erstellen. HTML bietet zwei Möglichkeiten, um am wenigsten Informationen anzugeben, die enthalten müssen, wenn unser Markt am wenigsten Elemente mit Tech Sie l erstellen Sie ein A Norbert am wenigsten markiert mit Aufzählungszeichen und mit Tech O l und bestellen Sie es am wenigsten, was für dieses Beispiel eine Reihe von wenigsten bietet und mit ph eigenen dot html Ich möchte eine in der Reihenfolge zumindest nach dem Bild Tod I m in der Seite vor Beginn meiner mindestens nur einen Absatz mit Text zu erstellen, treffen Indien Top-Städte. Und nach diesem Text, Ich werde meine in der Reihenfolge Liste mit drei Stadtnamen setzen, beginnend mit meiner Tech Sie l Ich definiere, dass i f und in der Reihenfolge Liste und zwischen dem u l Start- und Ende-Tech, Ich lege jedes Element auf meiner Liste innerhalb die Tech l I erste Element aus am wenigsten ist Text Balmain. Die zweite wird Deli City und letzte Elemente Armreif sind ich jetzt auf meiner Seite aufgeführt drei Städte mit einer geordneten Listen, wie Sie im Browser sehen können, wenn Sie von Ihnen l ändern 20 l Sie sehen, dass stattdessen aus Kugeln Sie F-Zahlen in jedem Element aus der veröffentlicht werden. Wie Sie sehen können, ist es sehr einfach, Leasing mit HTML zu erstellen. Zum Beispiel. Sie können diese Listen aus Städten verwenden, um Straße individuell durch nur tot zu erstellen. Beschreiben Sie jede Stadt mit April ings zwei Zeilen zwischen den Seiten. Es ist nur ein Vorschlag, diese Liste zu verwenden. Danke und wir sehen uns die nächste Lektion. 12. Erstellen von Hyperlinks: Hallo, mach diese neue Klasse. Ich möchte jeden Link zwischen zwei verschiedenen Seiten erstellen und interne Links verwenden, um mit einem bestimmten Teil von der aktuellen Seite gesprungen , beginnend mit April Inc. Zuerst werde ich meine eigene Seite kopieren und eine weitere Schulden erstellen. Ich gebe den Namen über dot html jetzt gerade geöffnet die neue HTML-Datei und Elite die älteren Texte und ersetzt neue Inhalte Schulden. Ich möchte, dass meine zweite Seite sicher ist, dass die zweite Seillänge anders ist. Der neue Text befindet sich in meiner Textdatei, die ich für meine erste Seite verwendet habe. Ich werde jetzt den Text kopieren und die Änderung in der neuen Tonhöhe vornehmen. Nachdem ich den Text geändert habe, verwende ich ein anderes Bild mit dem gleichen Mantel. Ich muss nur in meinem Hauptverzeichnis das Bild, das wir denken, Reise dot Jay Pek statt India dot jay pek auswählen . Ich habe jetzt meine beiden Seiten mit allen Inhalten, die ich will, und es ist Zeit, die Sperling's zu erstellen. Die Technologie, die für April Links definiert ist, ist die ATEC. Eine der wichtigsten Antworten, die von diesem Element gestartet werden, ist ein Entwurfsattribute, der das Link-Ziel angibt, das ein externer Link sein kann und wo Patch einfach ein neuer Polling-Toe ist. Eine andere Seite, die ich in meinem Verzeichnis habe. Ich werde meine Technik und mein Attribut öffnen. Ein Entwurf erhält meine zweite Seite über dot html jetzt nur F zwei rechts zwischen dem Start und Tag den Text, der als April Inc Ich schreibe für getarnt dext über uns und schließen schließlich, Atec beobachten jetzt die Rohre im Browser. Ich kann sehen, dass die pro Link in den Decks und wenn ich klicke ich öffnete die Seite über dot html s wir wollten jetzt nur einen Link von Seite über dot html auf die Seite nach Hause zu erstellen. Es Platten über dot html i f. Um die gleiche Bedeutung zu verwenden, um ihre eigene Tonhöhe mit einem Entwurf Empfangsseite auf Punkt html und rechts auf Seite verbinden , Schaffung eines April auf die ursprüngliche Seite verlinkt wir fertig. Jetzt ist der tiefere Link-Teil können Sie jetzt zwischen diesen beiden Seiten navigieren. andere Möglichkeit besteht darin, eine Verknüpfung zu einem bestimmten Teil des Dokuments anstelle von einer anderen Seite zu erstellen. Wenn Sie auf einen bestimmten Teil verlinken möchten, können Sie Ideenattribute verwenden, die es Ihnen ermöglichen, einen Teil Ihrer Tonhöhe und Edelstein zu dem Abschnitt mit jeder pro Link-Seite Links unsere Rechte viermal zu identifizieren , wenn Sie eine Menge von Informationen auf einem Web haben Seite und möchten dem Benutzer eine Möglichkeit geben, zu einem bestimmten Abschnitt zu springen. Im nächsten Beispiel habe ich diese Methode verwendet, nur um von unten aus dem Biss zu gehen, stand oben mit einer Perle und Erstellen eines I D. Auf der Überschrift von der Seite Für diese Situation habe ich meine Zugabe Tech und ich d mit zurück, und dieser Teil aus dem Dokument wird jetzt erkannt. Damit muss ich jetzt nur einen Link am unteren Rand der Seite erstellen, um nach oben zu springen, indem ich in meiner Technik das Attribut, einen Entwurf mit dem Asche-Tag und die Idee verwende, die ich oben gebe. Mit dem letzten Schritt ist es, Text oberen Rand zu F schreiben jeden Perlentext, um an den oberen Rand der Seite zu springen . Ich werde nur einige Kopien aus dem Bild machen, um mehr Inhalt auf der Seite zu setzen und besser die Wirkung von den jungen zu sehen . Der untere Link springt jetzt an den Anfang, wie Sie sehen können. Also für jetzt, sehen Sie die nächste Lektion 13. Tabellen: Hallo. Es ist Zeit, Ställe auf Ihrer Website zu erstellen. HTML-Tabellen sind das Richtige, wenn Sie Informationen in einer klaren und Struktur präsentieren möchten, ist es einfacher zu arrangieren, dass, wie Text, Bilder und Links. Werfen wir einen Blick auf HTML verwendet, um eine Tabelle zu erstellen. Es gibt vier Haupttexte, die zum Erstellen von Tabellen verwendet werden. Eine HTML-Tabelle ist mit Tabellentechnologie definiert, die die Start-Off-Tabelle definiert und entsprechen, endend Tech bis zum Ende. Aus der Tabelle ist die Tabellenzeile mit TR tech definiert. Die andere ist mit th tech definiert, die durch die Fehleranzeige Tabelle Eddings mit sowohl weit Matt als auch Central mehr Wert auf unsere Tabelle Spalte geben . Methinks, dass eine Tabellendaten mit Tedy definiert sind und verwendet wird, um verschiedene Arten von Daten in Zelle zu schreiben . All dies weit Texte als Start- und Endtechnologie, um den Anfang und das Ende jedes Elements zu definieren . Für das nächste Beispiel möchte ich eine Tabelle mit zwei Spalten und zwei Zeilen erstellen, die von der Rose ging, ist das Ende der Tabelle. Wie ich bereits sagte, der Tisch beginnt mit dem Tisch Tech, und nach diesen möchte ich meine führende Rolle mit dem TR Tech. Und jetzt definiere ich die Daten innerhalb der Zeile als Hinzufügen, indem das th zweimal verwende, weil ich zwei Zellen habe, um Überschriftendaten in den th tex zu setzen, den ich schreibe, indem ich eins und Überschrift hinzufüge und meine Zeile jetzt beendet ist, um die zweite Zeile zu erstellen. Ich gerade jetzt meine tr tech und zwischen Anfang und Ende in Tech, Ich erstelle zwei TD Texte meine Tochter in die beiden Zellen setzen, Schreiben Daten ein und datiert jetzt. Es ist Zeit, meine Änderungen zu speichern und die Ergebnisse im Browser zu sehen. Wie erwartet erhalten wir eine Tabelle, die um zwei Spalten mit Hinzufügen in der ersten Spalte erhöht wird und dass in der anderen Zeile, wie Sie sehen können, ist es sehr einfach, Tabellen mit HTML zu erstellen. Wir sehen uns die nächste Lektion. 14. Kommentare hinzufügen: für diese Lektion, werde ich darüber sprechen, um Kommentare in Ihren Mänteln zu machen. Der Kommentar-Stick wird verwendet, um Kommentare einzufügen, die nicht in Ihrem Browser angezeigt werden und keinen Einfluss auf Ihren HTML-Mantel und Korrespondent haben. Wo pH-Wert erwartet Der Hauptvorteil der Verwendung von Kommentaren ist die Erklärung von rechts und Mantel mit besonderer Relevanz, wenn der Benutzer die ersten Schritte in HTML macht, oder sogar für Benutzer mit mehr Erfahrung, wenn sie sehr umfangreiches Fell verwenden und arbeiten in vielen Projekte und manchmal sind sehr Monate, ohne in einigen dieser Projekte zu arbeiten. Wie Sie auf dieser Seite sehen können, habe ich bereits die Siri aus Kommentare, um sie einzufügen. Ich benutzte die gemeinsame Technologie, und zwischen dem Anfang und Ende Tech, Ich füge die Kommentare, die jeden Teil aus dem Mantel erklären, jedes verschiedene Elemente, die ich m in meiner Datei. Immer kommentieren, nur zu sagen, welche Art von Inhalt aufgerufen werden, wird wie Absatz, Ställe, Listen und so weiter setzen Ställe, . Wenn Sie möchten, können Sie ausführlichere Kommentare hinzufügen, um im Detail zu erklären, was jeder Teil des Fells tut. In diesem Beispiel schreibe ich einen Kommentar, der besagt, dass ich Liste mit dem ol Tech bestellt habe, um zu erklären, was die gestapelt dies Es ist alles für jetzt. Wir sehen uns die nächste Lektion 15. HTML: wie zuvor. Ich sagte, der HTML wird mit dem Vorschlag der Erstellung von Inhalten für die Internetseiten verwendet. Aber wenn wir über das Aussehen seiner Elemente sprechen, ist HTML sehr begrenzt. - Was? Es ist nicht gut. Wenn Sie versuchen, einer Website ein persönliches Layout oder Identität zu geben, ist ihr Vorschlag dieses Videos nur eine kleine Einführung in die Stile aus dem HTML-Inhalt geben, um einige der Möglichkeiten aus der kaskadierenden Stylesheets Sprache hervorzuheben, auch als CSS bekannt und kehrt zum Erscheinungsbild von den Elementen zurück. Das CSS ermöglicht es Ihnen, die Änderungen aus Farbe, Position und anderen Eigenschaften von Elementen vorzunehmen, indem Sie ein Attribut mit Namensstil verwenden, das eine CSS-Eigenschaft und einen entsprechenden Wert erhält , die die Änderung des Stils in der HTML-Element. Die Hauptregel ist also die Verwendung eines Stils, der mit Angriff verbunden ist, und für dieses Beispiel, das ich in dem Angriff verwendet habe, hat P einen Stil Edward erstellt, um die Eigenschaftsfarbe aus dem Text mit dem Wert blau zu ändern. Die Eigenschaft und der Wert werden definieren, was in den HTML-Elementen für diesen Kerl Absatz ändern wird den Text Aufrufer zu blau ändern. Wie Sie im Browser sehen können. Es gibt andere Eigenschaften in Absätzen verwendet, die wir verwenden können. Weed Stil Attribut wie Text die Zeile für Textausrichtung, Telefongröße und Spaß Familie. Für Textmittel können Sie Martin eine Regel in Ihrer Technik anwenden. Sie müssen nur jedes durch Semikolon regiert trennen. Ich möchte mich jetzt bewerben. Andere Regel zu diesem Absatz. Ändern der Textgröße Mit der lustigen Größeneigenschaft mit dem Wert 14 Pixel im Browser ist sichtbar. Die Änderungen mit diesem neuen Wert Andere große Änderung, die wir vornehmen können, ist die Hintergrundfarbe der Seite, die standardmäßig weiß ist. Diese Änderung muss innerhalb des Körpers startek angewendet werden, wenn Sie die Farbe auf die gesamte Seite mit der Hintergrundfarbe Eigenschaft innerhalb body tag anwenden möchten , habe ich Hintergrundfarbe mit Wert Licht direkt nach dem Speichern der Datei definiert, können wir sehen , dass der Prozess diese Änderungen nun mit der neuen Hintergrundfarbe hellgrau widerspiegelt. Es ist alles vorerst. Vielen Dank 16. HTML I: Willkommen wieder zu diesem neuen Video. Die nächsten Minuten sind dem Erstellen von Formularen gewidmet. HTML-Formulare sind einer der Hauptpunkte der Interaktion zwischen dem Benutzer und einer Website. Sie ermöglichen es Benutzern, verschiedene Arten von Daten von Website zu senden datiert, dass die meiste Zeit Cento ist , ein Web-Server, der die Funktion zum Empfangen und Verwalten von Daten hat. Ein HTML-Formular kann aus Textfeldern, Schaltflächen, Auswahlkästen, Kontrollkästchen oder Optionsfeldern erstellt werden. Der Hauptunterschied zwischen dem HTML-Formular und dem einfachen HTML-Dokument besteht darin, dass die vom Formular erfassten Daten meistens an einen Webserver gesendet werden. Wie ich bereits sagte, in der Einheit dieses Kerls Webserver einrichten, um die Daten zu empfangen und zu verarbeiten . Das vorgeschlagene aus diesem Video ist nicht, einen Webserver einzurichten. Es ist zu lernen, verschiedene Arten von Farmen mit Textfeldern zu erstellen, senden Schaltflächen und Optionsfelder , beginnend mit dem Mantel, der Ihnen hilft, besser zu verstehen, um die Farm zu erstellen. Das HTML-Formular beginnt immer mit Fordham Tech, die einen Dokumentabschnitt darstellt, interaktive Steuerelemente enthält, um Informationen an einen Webserver innerhalb Start- und Abschlussform Tech ist, wo wir die verschiedenen Elemente einfügen. Das beliebteste Element ist das HTML-Eingabeelement, das verwendet wird, um interaktive Steuerelemente für Web-basierte Formulare zu erstellen , um Daten vom Benutzer zu akzeptieren, Es gibt verschiedene Arten von Eingabeelementen wie Textfelder, Optionsfelder, Kontrollkästchen und andere. Das erste Beispiel zu zeigen verwendet zwei Typen von Elementen Textfelder, um Informationen zu erhalten und eine Schaltfläche zum Senden. Fang an, meinen Mantel zu schreiben. Ich erstelle den Start- und Endabschnitt mit dem technischen Formular. Der nächste Schritt besteht darin, die Elemente aus der Farm hinzuzufügen, indem Eingabetechnologie eingefügt wird, dass es ein Attribut namens Typ gibt, das den Typ aus Elementen in Verkleidung empfängt . Ich möchte ein Textfeld zu Rechten, so dass dieses Element einen Werttext erhält. Der nächste danach ist der Attributname, den ich verwendet habe, um den Namen zu erhalten, unter dem der bestimmte Wert im Textfeld für die Verkleidung erkannt wird. Ich gebe das Namensattribut, Wert meinen Namen. Die letzte Aktion ist der richtige Name vor Eingabetechnologie, um die Schritte vor dem Einfügen Textfeld einen Überblick zu machen angezeigt . Zuerst i f ein Eingabeelement, das vom Typ Text ist, und wir erhalten einen Wert, der als mein Name im Browser erkannt wird , ist sichtbar. Dies in Patel Mint, wo wir Texte jetzt schreiben können, ist es Zeit, ein anderes ähnliches Element zu schaffen, das das Alter anstelle des Namens erhält . Ich habe gerade den vorherigen Mantel geschlagen und jetzt im richtigen Alter vor der Eingabe Tech und änderte den Namen Attribut in mein Alter erkannt zu werden. Jetzt mit diesem neuen Namen, desto weniger Änderung zu Mike wird der Typ für ihn neben Nummer geändert, weil jetzt in diesem Feld, Ich möchte ein Alter, das durch eine Zahl dargestellt wird erhalten Jetzt diese Farm wir fühlen, ich habe , um eine beliebige Put-Taste zu setzen. Ich muss den Typ von Text zu senden ändern, weil jetzt muss ich Informationen erforderlich übermitteln Dieses Eingabeelement als Wert nach Route, die Schulden erhält, Tod senden Button zeigt. Ich möchte nur, dass Text in die Schaltfläche einreichen erscheint. Die Browser-Show war jetzt dieser Baum Eingabeelemente erhält zuerst Text, andere Zahlen und für die letzte, um die eingefügten Daten zu bestätigen, können Sie sehen, dass das zweite Feld, das Zahlen als Pfeile erhält, um die Zahl zu erhöhen und zu verringern , die Sie auf dem Feld setzen. Diese Situation ist nur möglich, weil das Feld als Zahl und nicht als Text definiert wurde. Das letzte Detail ist die Adresse, die Sie oben auf der Seite sehen können, wo Sie das verweigerende Attribut sehen, das ich als mein Name und mein Alter definiert habe, die jetzt die Informationen erhalten , die ich in den beiden Feldern schreibe. Mein Name erhielt Informationswunsch und mein Alter. Die Nummer 35. Dies ist eine kluge gewartet in Kampf Informationen, die in der Farm eingereicht wurde. 17. HTML II: nach dem ersten Formular, ist es an der Zeit, eine Farm zu erstellen, die Kennwörter empfängt. Ich möchte jetzt ein neues Formular mit der Protokollierung, die Texttyp und jeden Wert erhält, den ich im Namen der Einstellungen einlogge . Im zweiten Eingabeelement möchte ich das beste Wort erhalten. Also mein setzen Element als Typ-Passwort für den Text, nicht sichtbar sein. Ich definiere jetzt dort durch die Nacht für die Ansiedlung mit dem Wert mein Bestes. Das letzte Element ist der Submit-Button, wie wir in der vorherigen Übung erstellen. Ich kann jetzt im Browser dieses neue Formular sehen, das sehr in Situationen über die Anzeige auf Websites verwendet wird . Jetzt, da ich jemals mit schleppen Best und Submit-Button bilde, werde ich ein Optionsfeld zum zuletzt erstellten Formular haben, um das Geschlecht von der Person zu definieren . Um diese Art von Eingabeelement zu tragen, muss ich den Typ in Radio und definierte Attribute ändern. Neun mit Wert mein Geschlecht zu meinen beiden Eingabeelementen. Wenn Sie eine Liste von Optionsfeldern entwickelt haben, die dem Namen nach gegeben ist, muss sie für jede Option in der Mindesten gleich sein, um sicherzustellen, dass Onley ein Radioeingang in der Gruppe ausgewählt werden kann, wenn die Farm gesendet wird, wird es die content off value Attribut, das ich für jedes ausgewählte Optionsfeld für das erste Eingabeelement definiert habe. Defiant ist männlich und das zweite Weibchen. Ich habe jetzt meine neue Farm mit dem Optionsfeld und es im Browser Arnel sichtbar die Änderungen mit diesen neuen Feldtypen. Die letzte Änderung ist die Hinzufügung aus einer Schaltfläche, die das Zurücksetzen von den Informationen, die Sie in die Farm gesetzt. Das könnte nützlich sein, wenn wir das Formular ausfüllen und es gibt einen Fehler in der Schriftform. Ich brauche nur ein anderes Eingabeelement, in dem ich meine Type-Resets definiere, und ich möchte, dass die Schaltfläche mit der Text-Reset-Taste erscheint, die den Browser öffnet. Sie sehen, dass, wenn Sie diese Schaltfläche auswählen, die Informationen in den verschiedenen Textfeldern wie erwartet scheinen 18. Einführung in die Multimedia-Inhalte: Multimedia-wie Sounds, Musik- und Videodateien können einige interaktive Inhalte hinzufügen, um die Aufmerksamkeit der Zuschauer zu gewinnen . Websites mit diesen Inhalten werden häufig von Marketing-Abteilungen bevorzugt, weil aus ihrer Fähigkeit, vollständig präsentieren Branding mit Mantel, die seit Jahren verfügbar ist. Jetzt können Sie eine beliebige Anzahl von verschiedenen Arten von Multimedia-Dateien leeren und erstaunliche Inhalte auf einer Website erstellen. In den nächsten Videos werde ich Ihnen einen Siri aus HTML-Text zeigen, mit dem Sie Multimedia-Elemente hinzufügen können, mit dem vorgeschlagenen, um den Inhalt einer Webseite zu erreichen. 19. Videos in einer Website hinzufügen: Hallo. Dies ist die erste Lektion, in der ich ein Multimedia-Element-Video verwende, das verwendet wird, um Video in HTML-Dokumenten anzugeben . Um diese Art von Inhalten einzuführen, habe ich Angriffsvideo verwendet, das die Funktion Toe End Video Union Dokument hat. In der Crew-Selbsteinführung in HTML erfahren Sie, dass Elemente Attribute haben können. Debt liefert zusätzliche Informationen über das spezifische Element für diese Art von Element. Es gibt zwei wichtige Attribute, die ich beendet habe, wie die Verwendung in den Bildern, denn wenn ich und mit nicht das Versprechen gesetzt, mein Flimmern wild Video lädt. In diesem Beispiel verwende ich Video-Element mit dem mit aus für 100 Pixel, und ich habe 300 Pixel. Schließlich werden die Steuerelemente Attribute verwendet, um Steuerelemente, die es dem Benutzer ermöglichen, Video-Wiedergabe zu steuern , einschließlich Lautstärke suchen und Summen wieder Blais Vic. Innerhalb des Videos habe ich diesen AR-Stack verwendet, der alternative Videodateien empfängt, aus denen der Browser wählen kann. Der Browder wird einfach die ersten erkannten Formate verwenden, die ich für diese Jungs zu Attributen in diesem Element verwendet habe . CRC zwei gibt die Videoquelle und den Attributtyp an, um uns den Internetmedientyp von der Medienressource für dieses Beispiel mitzuteilen. Die Datei ist Film, dass und vor, und der Typ ist video em, bevor ich einen Namen vor Datei verwenden, aber HTML-Datei unterstützt andere zwei verschiedene Video-Formate. Wo sie und umarmen. Schließlich wird der Text zwischen dem Video Tex nur im Browser Tod angezeigt nicht unterstützen die Video-Elemente in Verkleidung. Ich habe die Nachricht ungültig gemacht, Bruder. Nachdem Sie die Kälte beendet haben, schauen wir uns an, wie es im Bruder de Video aussieht. Wie erwartet, als eine ernsthafte off. Welche Rollen sie Ihnen helfen, die Videoinhalte zu verwalten. Nun, wenn Sie das wollen, das Video automatisch auf Ihrer Seite gestartet. Nur f, um die Attribute Steuerelemente zu ändern, wenn ich glaube, und Sie sehen im Browser nach dem Speichern der Änderungen. Death Review Real von sich selbst beginnen. Es ist alles vorerst, Studenten. Wir sehen uns die nächste Lektion. 20. Audio hinzufügen – HTML5: Hallo, nach David, du. Lass uns über die von dir reden. Das ist ein weiteres wichtiges Multimedia-Element, wenn ich Sounds einfügen möchte. Ich benutzte Werte-Tech und, wie das Video verwendet Steuerelemente Attribut, um Ihre Steuerelemente wie Bligh Bögen n Lautstärke anzuzeigen . Also begann ich meine Audio-Elemente, die beim Tod durch sie steuert neben dem Quellelement , das Sie alternative angeben können. Alle Dateien, die der Bruder aus dem Browser wählen kann, verwenden das erste erkannte Format, wie im Video. Für dieses Element verwende ich gegen das CRC-Attribut, um die Quelldatei zu erhalten. Und für dieses Beispiel möchte ich ein Dateiladedock-Wave-Typ-Attribut blasen, gibt den Dateityp für diese Jungs und jetzt die Datei an und erhält den Wert Al do Frau. Neben der Art und Weise weit Mint Value Element unterstützt zu anderen Typ off Dateien und zwischen und ogg . Schließlich wird der Text zwischen Wertstart und schließendem Tech im Browser angezeigt, der diese Elemente nicht unterstützt. Genau wie ein einzelnes Beispiel, ich gerade jetzt die Nachricht ungültig Bruder. Für diese Elemente im Browser haben Sie nun das Video aus der vorherigen Lektion und audiophile eingefügt. Müssen Sie nur die Play-Taste verwenden, um diese Dateien es zu starten Also für jetzt, sehen Sie die nächste Lektion 21. Objektmarke: hallo. Es ist Zeit, ein neues Element einzuführen. Das Objekt ditched E-Mail Objekt Element repräsentieren eine externe Ressource, die als Bild oder einfach eine Ressource behandelt werden kann und von einem Plug in geführt werden. Sie können dieses Element verwenden, um Multimedia in Ihren Webseiten zu leeren. Wie sehen Sie Flash-Dateien oder einfach eine andere Webseite in Ihre HTML-Dokumente? Für dieses erste Beispiel definiere ich ein Objekt mit dem mit off 300 Pixeln, und ich habe 200 Pixel und empfängt ihn, der den Namen von der Ressource für diesen Fall Attribute . Datei video dot m Vor, nach dem Speichern, können Sie diese Datei in den Bruder laden sehen. Der nächste Block F Mantel Ich Einführung Steph eine Videodatei. Eine HTML-Datei, die ich in einem anderen Ordner Call Tim plight und mit dem Foul. Wir bestreiten, ich bin Index, dass HTML mit dem Weizen von 800 Pixel, und ich dachte, 600 Pixel. Die Ergebnisse im Browser sind eine weitere HTML-Datei, die Sie auf der Seite sehen können und nach dem leichtesten in bestimmten Videos angezeigt wird . Es ist alles vorerst. Studenten sehen uns bald 22. Interaktive Inhalte mit der Tag - HTML5 hinzufügen: hallo und wieder willkommen. Der nächste Schritt, um Ihnen zu zeigen, ist sie Tech tat HTML in Element wird für das Beenden einer externen Anwendung oder interaktiven Inhalt verwendet . Was wir einen Plug in für dieses nächste Beispiel nennen, werde ich einfach ein anderes Video wie die Objekt-Beschwerden beenden , die ich definiert habe mit und ich habe für dieses Beispiel mit einem mit off 600 Pixel und ich dachte, 400 Pixel und die Quelldatei ist jetzt durch CRC Attribut gegeben, dass erhält den Dateifilm ein Punkt mp für diese Stick ist kein Teil von html vier und seine neue in Version fünf. Ein Unterschied zwischen Objekt und dann leeres Element ist, dass die ersten s Start und Tech und sie nur f Öffnung Tech. Wie Sie sehen können, können Sie im Browser das und Video-Objekt sehen, das wir in der Quelleigenschaft definiert haben. Es ist so vorerst. Wir sehen uns die nächste Lektion 23. Youtube-Videos hinzufügen: Wieder willkommen. Der einfachste Weg, Videos mit HTML abzuspielen, ist mit Ihnen zu Der Unterschied zwischen den vorherigen Beispielen ist, dass ich Videos verwendet habe, die in meinem Hauptverzeichnis gespeichert wurden , aber für die Verkleidung, meine Quelle wird die Video-Haustiere im Internet sein, um eine -Video auf Ihrer Webseite verwenden um die I Frame Tech zu verwenden, die in Ihrem Zeilenrahmen angegeben ist. Fang an, meine Kälte zu schreiben Ich öffnete ich Frame und spezifizierte Weizen von 400 Pixel, und ich dachte, 300 Pixel, um das zu ändern. Ich erwähnte den Spieler die SRC-Attribute Geben Sie mir, die l Video sind, die ich spielen möchte und für die Verkleidung. Ich kopiere einen Warrell, den ich in meiner Textdatei habe und am besten zu meinem Manteleditor. Wie bekomme ich diesen Link? Einfach auf YouTube gehen und dann, nach Auswahl eines Videos, nach Auswahl eines Videos, klicken Sie auf Teilen und wählen Sie Option und und erscheint in S. R. C. Attribute den Link, den Sie brauchen, um den Video-Link zu gewinnen, die anders als der ursprüngliche Link aus dem Video. Es ist jetzt sichtbar. Machen Sie Video im Browser nach diesem Schritt? Wenn ich das Video automatisch abspielen möchte, wenn ein Benutzer die Seite besucht, müssen nur einen einfachen Umfang Zehe haben. Dein YouTube, die ich auch mit wirklich einem spielen. Wir werden es automatisch spielen lassen. Der Standardwert ist außer Spiel mit dem Wert Null, der Video macht. Spielen Sie nicht aus. Sie können im Browser sehen, dass mit dieser automatischen Wiedergabe das Video startet, wenn ich die Seite öffne . Eine weitere Möglichkeit besteht darin, das Video in der Schleife abzuspielen, ohne zu stoppen, um diese Änderung vorzunehmen. Ich noch die Perimeter-Schleife und geben dem Tal ein, und jetzt wird das Video Schleife, wie wir wollen. Schleife mit Wert. Null ist der Standardwert außerhalb dieses Umfangs. Ich führe jetzt den Film wieder und setze das Video am Ende, um zu sehen, dass das Video wieder automatisch gestartet wird . Die letzten Jungs, die zeigen, ist die Anzeige aus. Der Spieler steuert, dass standardmäßig sehr eins ist. Was macht Anzeige der Steuerelemente. Wenn Sie die Steuerelemente entfernen möchten, müssen Sie nur die Steuerelemente Perimeter auf den Wert Null ändern und die Steuerelemente werden deaktiviert wie Sie jetzt auf der Seite sehen können. Dinge 24. Gestalte eine an: Hallo und willkommen wieder, Sie wissen schon, jetzt, heraus YouTube-Videos in Ihrer Webseite zu beenden, ändern Sie einige Eigenschaften für die Videos wie aktivieren und deaktivieren Sie die Steuerelemente, Schleifen Video und Ändern der Seiten aus dem Video -Player für diese neue Übung, möchte ich ein Video hinzufügen, aber mit einer Playlist von YouTube anstelle eines einzigen Videos, wie Sie es in der vorherigen Lektion getan haben . Wenn Sie sich immer noch daran erinnern, Wims ein Video von YouTube, Ich benutze die Augenrahmen-Technologie endet die SRC-Attribute. Ich habe ihnen das angekleidete, um diese Adresse zu bekommen. Ich wähle das Video, das ich dann auf Teilen und wählen Option Ende und erscheint in SRC sie das Kleid, das Sie auf Ihren Mantel Editor kopieren müssen jetzt beginnen. Wir hatten nach meiner Wiedergabeliste gerufen. Ich werde die I Frame Tech erschaffen und zuerst habe ich die Größe des Spielers mit einem Weizen von 500 Pixeln definiert und ich habe 400 Pixel beigebracht. Nächste s werden sehen, wo ich die Wiedergabeliste Adresse erhalten werde, um die Wiedergabeliste zu erhalten. Sie können immer diesen Standardmantel verwenden, den ich gemeinsam habe. Der Trick ist die Idee, die am Ende von der Adresse nach dem Fahrzeug-Symbol erscheint, um diese ich d zu haben. Ich gehe zu Ihnen, wo ich jedes tun als nächstes ausgewählt habe. Ich habe den Kanalnamen ausgewählt, um alle Wiedergabelisten außerhalb des Kanals anzuzeigen. Und danach wähle ich die zweite Wiedergabeliste aus, die F 138 Videos. Die Wiedergabeliste ist nun geöffnet und ich muss oben das Kleid I d auswählen. Das ist neben dem Gleichheitssymbol. Dies ist die Idee, die ich zu meiner S r. C Adresse hinzufügen muss, um jetzt die Kopie zu machen. Ich öffnete den Browser und Sie können sehen, dass die wenigsten s 130 18 Jahre wie erwartet am besten auf die nächsten Videos aus der Playlist. Sie müssen nur auf die Steuerelemente gehen Schaltflächen, um zum nächsten Wiedergabeliste Video zu wechseln. Das ist alles für den Moment. Vielen Dank 25. Einführung in die CSS: Hallo. An diesem Punkt haben Sie HTML-Sprache gelernt, die verwendet wird, um Seiteninhalte zu erstellen, die standardmäßig dem normalen Fluss einer Webseite folgt. Aber diese Sprache berücksichtigt nicht die Erstellung von Stilen wie der Typ von vorne. Jugend-Anrufer positionieren verschiedene Elemente, ändern die Bildgröße und andere Details. Es ist hier. Schulden, CSS Platz. Eine wichtige Rolle, die abgestiegen ist. Warum? So Stil Ebene Web-Text mit Fonds Gelehrten, April Links Bereitstellung einer leistungsstarken Kontrolle über die Präsentation oft. HTML-Dokument-CSS. Auch bekannt s Cascading Stylesheets können leicht von HTML getrennt werden. Was dreht sich sehr einfach, das gesamte Aussehen von der Website zu ändern. Es gibt andere große Vorteile, dass CSS leicht zu erlernen und zu verstehen, zunehmende niedrige Geschwindigkeiten in einer Webseite als einfache Wartung, und Sie können den gleichen Stil in mehreren Webseiten wiederverwenden. In den nächsten Lektionen werden Sie sehen, wie Sie Stile für Verschleißseiten erstellen, um all diese Vorteile von Cascading Stylesheets zu profitieren. Vielen Dank 26. CSS-Syntax: Wie ich schon gesagt habe. CSS wird verwendet, um den Stil der Elemente zu ändern, die inv im Alter von ml kalt erstellt wurden. Der erste wichtige Schritt besteht darin, einen Stil zu erstellen, um Stile zu erstellen, die ich verpasst habe F Eine Regelschuld besteht in einem Selektor und einem Deklarationsblock, der in einer Struktur ist, die durch eine No-Ping-Klammer und die schließende begrenzt ist, wobei sich ein Selektor in HTML befindet Technologie wie ein Netz oder ein besseres Ref-Tag, bei dem ein Stil angewendet wird. Der Deklarationsblock als einzelne Eigenschaft oder die Gruppe von Eigenschaften wie Farbe mit IKT-Schulden sind die ausgewählten Eigenschaften, die ich den Stil ändern möchte, wobei die Werte verwendet werden, die der Teil ist, der der Eigenschaft einen bestimmten Wert zuweist, die wir ändern sich im Lebenslauf. Ich möchte eine HTML-Technologie ändern, die von einem Selektor gegeben wird, der heißt, eine Eigenschaft, die ich mit einem entsprechenden Wert signieren möchte. Um im folgenden Beispiel klarer zu sein, möchte ich die Farbe zu grün und Textmittel zu verdana von meinem Absatz ändern. Die Schulden sind in meinem Mantel definiert. Wie Sie im Bild sehen können Tag ist mein Selektor, Farbe und Schriftfamilie sind die Eigenschaften, die ich ändern möchte und grün n verdana unsere Entwickler, die ich auf die Eigenschaften zuweisen möchte. Wenn Sie mehr als eine Eigenschaft für eine bestimmte Technologie wie in diesem Beispiel ändern möchten, müssen Sie eine Semi-Spalte zwischen jeder Paar-Off-Eigenschaft und -Wert verwenden. andere Situation ist, wo Sie mehr als ein HTML-Tag mit dem gleichen Stil beeinflussen möchten. In diesem Fall verwenden Sie eine Spalte, um jede Spalte vom Selektor zu trennen, der geändert werden soll. Ich werde jetzt mit unendend vor Tarif und ich habe auf die Hinzufügung der gleichen Regel angewendet, die ich für den Absatz beantrage. Also muss ich nur diesen neuen Selektor tragen, um die Absatzregel mit Technologie zu teilen. Das ist, was ich jetzt gemacht habe, wo ich die erstellte Regel auf mein habendes Element anwende, wie Sie im Browser sehen . Text wird jetzt mit der gleichen Formatvorlage beeinflusst, die für den Absatz erstellt wurde. Vielen Dank 27. Kurs- und Id-Selektoren: Hallo, schon wieder. Wir haben bereits die HTML-Selektoren gesehen, die verwendet werden, um Texte wie Absätze darzustellen, und alles ist so, wie Sie zuvor gesehen haben. Sie können aber auch Ihre eigenen Selektoren mit Klassen und Id-Selektoren definieren. Die Vorteile der Verwendung von Klassen und I DS besteht darin, dass Sie das gleiche HTML-Element haben können, es aber je nach Klasse oder I D unterschiedlich darstellen können. So kann ich mehr als einen Absatz auf einer Seite haben, die unterschiedliche Stile haben kann, weil sie verschiedene Klassen oder IDs in der CSS. Ein Klassenselektor ist der Name, der von einem Punkt vorangestellt ist und ein I. D Selektor ist ein Name, der von einem Nash Zeichen vorangestellt wird, jetzt genauer und beginnend mit einer Brille, wie ich sagte, kann verwendet werden, wenn Sie verschiedene Stile eines bestimmten Elements wollen . Für dieses Beispiel habe ich zwei Absätze und füge dann hinzu, und ich möchte zwei Absätze mit verschiedenen Text-, Farb- und Schriftgrößen formatieren. Erster Absatz mit Frontgröße 20 Pixel und Farbe blau und zweites Paar Riff furzen Pixel und Farbe braun. Innerhalb unserer HTML-Kälte. Wir weisen eine bestimmte Klasse zu, indem wir die Klassenattribute innerhalb unserer Technologie für die Situation verwenden. Ich muss verschiedene Klassen, weil ich verschiedene Stile will. Definieren des ersten Absatzes mit dem Namen zuerst und dem zweiten mit dem Namen. Zweitens, als ich diese beiden Klassen in CSS definiert habe, immer beginnend mit dem folgenden Fahrrad Nachname verwende ich für Klasse zuerst, Frontgröße mit Wert 20 Pixel und Farbe blau und für meine Klassensekunden die gleichen Eigenschaften Frontgröße, aber jetzt mit Wert 14 Pixel und Farbe mit Wert braun, können Sie jetzt diese verschiedenen Stile im Browser unterscheiden. Wie Sie sehen können. Andere Sache, die ich machen kann, dass ein wenig anders ist, ist Auswirkungen auf alle Elemente, die ich mit dem gleichen Stil möchte . Für dieses Beispiel möchte ich nur den gleichen Stil haben, der für den ersten Absatz in meinem habenden Element verwendet wird, das Hinzufügen mit der Klasse zuerst mit Koma verbinde, um die beiden Texte zu trennen. Und jetzt ähnelt der Stil beiden Elementen. Der große Vorteil der Verwendung von Klassen ist, dass ich die gleichen Stile in mehreren Elementen wiederverwenden kann . nächste Schritt ist I D Selektoren Debt in CSS ermöglichen es Ihnen, Elemente durch ihre I D-Werte zu zielen. Der große Unterschied im Vergleich zu Klassen ist, dass ich die Selektoren, einzigartig sind. So können Sie auf Lee auf den Inhalt von einem Element anwenden. Wenn Sie sich in HTML erinnern, kann ich verwendet werden, um ein Ankerwerkzeug für einen bestimmten Teil außerhalb der Seite zu erstellen. Und wenn Sie Martin einschließen, wenn ich d. Der Browser wird nicht wissen, wohin Sie gehen sollen, wenn Sie auf die i D verweisen , weil ich d in verschiedenen Teilen aus dem HTML-Dokument verwendet wird. Das ist, was Sie in der Datei eigenen Punkt-HTML sehen, die ich zuvor erstelle, wo ich einen Anker definiert habe, der diesen Stopage-Link zu dem Element sprang, das als i d zurück oben ist, das mein Hinzufügen eines Elements ist. Wenn Sie mehr als ein Element mit diesen I d haben. Benennen Sie den Browser, wissen Sie nicht, wohin Sie gehen sollen. Dies ist ein einfaches Beispiel, um zu verstehen, warum ich d nur einmal verwendet wird, wenn wir den gleichen Wert hätten. Mit dem vorherigen Beispiel, das in Gläsern verwendet wird, ändere ich jetzt Klasse zu I D. Und wo ich die Stile definiert habe, anstatt einen Punkt vor der Würfel zu verwenden. Der Name, den ich die Hash-Tech für diese erste Situation verwendet habe. Ich ändere den Stil für mein hinzufügendes Element nicht. Wie erwartet, die endgültige. Ich werde eine ähnliche wie, wenn ich Brille verwendet habe, die verschiedene Stile auf die Absätze angewendet hat. Wenn ich jetzt den Stil für das Ende so ändern möchte, dass es dem ersten Absatz ähnlich ist, können Sie I d Selektor nicht verwenden, da , wie gesagt, Sie, wie gesagt,einen mächtigen in verschiedenen Elementen in Ihren Dokumenten nicht verwenden können. Also der bessere Weg ist, eine Klasse zu verwenden, um Absatz zu bewirken und hinzuzufügen, Wir würden den gleichen Stil wie Ideen vor danke. 28. So fügst du CSS Styles hinzu: , um es zu tragen. CSS-Stile In einer Website können Sie drei verschiedene Möglichkeiten verwenden, CSS kalt einzufügen, die erste interne Stil-Scheiße zweite, externe Stil-Scheiße und letzte Verwendung in Leiden Stil. Der Vorteil für die Verwendung von jedem hängt davon ab, was Sie mit Stil tun. Lassen Sie uns jetzt sehen, um jeden von ihnen zu verwenden und was der Vorteil und diese Vorteile. Erstens, die internen Stil shits, wo Sie schreiben Dieses Jahr hat für die Waffen in toten Abschnitt aus einer bestimmten Datei innerhalb des Stils Öffnung und schließen Tech aufgerufen . Das waren die Methoden, die ich in den vorherigen Kapiteln verwendet habe, wo ich den Stil eines Bären ref ändere. Und dann macht es einfach, Stile anzuwenden, um Deco wieder zu verwenden Do diese Vorteil off mit einem internen Stil shit ist, dass Änderungen an den internen Stil shit auf Lee Effect der Seite, wo die Ursachen eingefügt in. Wenn Sie also Stile auf anderen Seiten anwenden möchten, müssen Sie alle Ihre Stile auf jeder einzelnen Seite Ihrer Website innerhalb des Abschnitts F deklarieren . Für das nächste Beispiel möchte ich einige neue Eigenschaften angeben, Fremdzugabe und den Absatz, den ich im HTML-Colt mit etwas Text definiert habe. Wie ich schon sagte, das Gold ist in diesem Abschnitt geschrieben und innerhalb des Style-Tags habe ich jetzt mit CSS-Regel für meine mit Farbe blau und Größe 24 Pixel definiert . Für den Absatz, Ich möchte die Fondsgröße mit Wert 20 Pixel, Hintergrundfarbe gelb und die lustige Familie zu definieren, die ich verwenden Wert könnte hier. Jetzt, da ich das Hinzufügen in Absatzregeln definieren, sehen Sie die Änderungen im Browser die zweite Möglichkeit, es zu tragen Blätter an Ihre Waffen zu verkaufen, ist mit einem externen Stil shit, die einfach ist. Eine CSS Person eingereicht, die Sie auf Ihre Website verlinken. Der große Vorteil der Verwendung dieser Methode ist, dass alles, was Sie in der CSS-Datei geändert haben, jede Seite in Ihrer Website beeinflussen wird , die mit der CSS-Datei verbunden ist. Deswegen verhindert das, dass Sie medizinische Änderungen auf jeder Seite vornehmen müssen. CSS-Dateien können mit einem beliebigen Texteditor erstellt werden, wie wenn Sie eine HTML-Datei erstellen. Der einzige Unterschied besteht darin, dass Sie die Datei mit der CSS-Erweiterung speichern müssen, um ein externes Stylesheet in einem Ihrer Webseiten aufzunehmen . Du musst eine Link-Tech innerhalb der Erde haben. Nehmen Sie Ihre Seite ab, auf der Sie Attribute verwenden. REHL Debt gibt die Beziehung zwischen dem aktuellen Dokument und verknüpften Dokumenten und Typattribut an, um die Medien zu informieren. Geben Sie die Längendokumente ein. Hat ein Entwurf einfach gesagt? Ist der Speicherort außerhalb der CSS-Datei? Sie können jetzt alle diese Attribute definiert in unserem Dokument mit Stylesheets namens Style dot CSS sehen. Also möchte ich jemals sehen, bewerten Dateityp mit Namen Stil. Und das weiß ich, dass ich in meinem Hauptverzeichnis erstellen kann. Die Datei mit dem Namen, Stil-Punkt-CSS, die meine externen Stylesheets sein wird. Im ersten Beispiel für interne Stil-Shits erstelle ich den Stil zum Hinzufügen von Absatzelementen, aber jetzt möchte ich dasselbe tun. Aber mit der externen CSS-Datei muss ich nur die Regel, die nach dem Speichern der sichtbaren Schulden in meine CSS-Datei erstellt wurde, verschieben. Meine Webseite immer noch f die Stile angewendet zuvor mit Textfarbe blau und Größe 24 Pixel und die Zellen für den Absatz mit Frontgröße definiert, 20 Pixel, Hintergrundfarbe gelb und Fonds Familie Könnte ea, wenn ich einfach ändern, Ersatz-Referenz-Hintergrundfarbe in CSS. Sie sehen, dass HTML-Dokumente, die mit externen CSS-Datei verbunden ist, Hintergrundfarbe von Absatz ändern . Wie erwartet können Sie beim Fortsetzen externer Stylesheets alle Styling-Informationen in eine komplett separate CSS-Datei einfügen. Sie können dann einfach von innen aus auf CSS-Datei verweisen. Jeder Webseiten- und Seiteninhalt wird dann entsprechend der Datei gestylt. Der offensichtliche große Vorteil dieser Methode besteht darin, dass Sie nur den Stil in Ihrer Stylesheet-Datei ändern müssen , und die Änderungen werden durch den Rest Ihrer Website kaskadiert, die die besten Methoden zu verwenden , was eine große Flexibilität und einfache Wartung. Nun, schließlich, Dean Line Stil, die spezifisch für das Tag selbst ist, verwendet die HTML-Stilattribute, um den Elementstil zu ändern . Diese Methode wird nicht empfohlen, da jede Änderung, die Sie in der CSS kalt, um in jedem Tag vorgenommen werden , das Sie den Stil anwenden möchten. Wenn Sie also drei Absätze auf einer Seite haben, müssen Sie die Stile dreimal in jedem Deck anwenden. Dies ist eine gute Angelegenheit, um für einzelne CSS-Änderungen gelten, die nicht wiederholt in einer Website für dieses Beispiel verwendet werden sollen. Ich muss Absätze gleichen, wo ich den ersten, den Aufrufer auf Blau und Schriftgröße auf 30 Pixel geändert habe . Diese Änderung unserer nur auf den bestimmten Absatz angewendet, den Sie im Browser sehen. Diese Situation, in der der zweite Absatz keine Änderungen hat. Diese Angelegenheit ist bei weitem nicht ideal. Wie ich schon sagte, denn wenn Sie die Stileigenschaften ändern möchten, müssten Sie es jede Instanz aus dem Stil auf jeder einzelnen Seite Ihrer Website haben , Danke. 29. Boxmodell – Rahmen, Rand und Fülleigenschaften: Ich Lassen Sie uns lernen, was ist das CSS-Box-Modell? Das CSS-Box-Modell ist die Grundlage für die Layout-Kontrolle für die Webseiten. Es ist sehr einfach zu verstehen und zu verwenden. Ermöglicht uns zu positionieren und Raum sind HTML-Elemente genau so, wie wir wollen. Es gibt vier wichtige Elemente im Box-Modell. Der erste ist unser Inhalt. Das kann einfach ein Bild sein, sind einige Texte und das wird in diesem Bild in der Mitte dargestellt . Zweites Element, das um den Inhalt herum ist Wetten Tod, trotzt dem Raum zwischen unserem Inhalt und der Kante aus dem Element. Als nächstes haben wir das Grenzelement, dem wir eine Linie um unseren Inhalt zeichnen und beenden können. Wir haben Marge, die den Abstand zwischen der Kante aus dem Element und jedem anderen Element von der Seite definiert . Schauen wir uns also die Straßeneigenschaften an, die in diesem Modell eingefügt wurden, und sehen Sie einige von ihnen, die mit CSS-Grenze beginnen . Das ist die Eigenschaft, mit der Sie den Stil mit und Aufrufer angeben können. Oft Elemente Rahmen, und er ist eine kurze und Eigenschaft für die folgenden einzelnen Rahmeneigenschaften, die Grenze Weizen Eigenschaft, die angibt, tun es ist außerhalb der vier Grenzen tun Grenze Stil-Eigenschaft , die angibt, welche Art von Rahmen -Anzeige und die Rahmenfarbe, die verwendet wird, um die Farbe von den vier Rändern zu setzen. Wenn Sie Onley verwenden, versperrte ihre Eigenschaft, Sie wirkliche Wirkung alle vier Seiten oft Element wie dieses Beispiel, wo ich jemals Stil für meine bereft Grenze alle Seiten mit einem Rand Weizen von 10 Pixel bar ihren Stil zu bewirken. Wir sahen seinen Wert und Blau als meinen Grenzanrufer. Also, was passiert? Sie sehen diese Werte im Absatz angewendet, wie Sie im Browser in den geringsten Off-CSS-Eigenschaften sehen können Sie sehen, dass U F einzelne Eigenschaften für jede Seite links, rechts, rechts, Stopp und unten, die verwendet werden können, um Onley eine Seite zu ändern die Grenze, wenn Sie wollen. Wenn ich also anstelle des Rahmens den Rand oben auf Lee verwende, ist die obere Seite des Absatzes von dieser Eigenschaft betroffen. Das ist, was ich jetzt tun werde Bewerben auf Lee diese Eigenschaft zu Grenze Ducked. Wir würden sagen, Werte, die Onley Tauschstil zu gestrichelt ändern. Sie sehen also, dass dieser Stil nur auf den oberen Rand unseres Absatzes angewendet wird. Lassen Sie uns nun auf die CSS-Margeneigenschaft schauen, die verwendet wird, um Raum um Elemente hinzuzufügen. Zuerst habe ich Rahmenwerte durch Evel für Grenzen ersetzt. Wir hätten den gleichen Stil. Jetzt bin ich Marge Eigenschaft zu unserer Paragraph Regel. Und wenn ich einfach einen Rand mit 100 Pixeln erstelle, ergibt dies 100 Pixel an allen Rändern außerhalb des Absatzes. Ich hatte jetzt ein anderes Paar, wenn ich die Ränder zwischen diesen beiden Elementen besser sehen sollte, wenn ich einfach zu einem niedrigeren Margenwert wechselte. Der Abstand zwischen den beiden Elementen nimmt wie erwartet ab, Margin-Eigenschaft ist nur eine einfache, verkürzte Eigenschaft für die einzelnen Rand-Eigenschaften Rand oben rechts unten und links eine ähnliche Situation, die mit Grenze -Eigenschaft. Nun, wenn ich nur ändern will, stoppen Marge aus zweitem Paar, wenn ich verschwenden muss, um es zu tun, bevor ich C Assessment schreiben Und da ich Änderungen alle im zweiten Tarif anwenden möchte, kann ich eine Klasse für meinen zweiten Absatz erstellen, die ich Geben Sie jetzt Namentext in CSS-Code, mache ich die Regel für diese Klasse mit Marg-Top-Eigenschaft. Wir würden einen Wert von je einem Pixel legen und die vorherige Regel löschen, die für Absatzelemente eingefügt wurde. In diesem Moment habe ich nur eine Margin Top im zweiten Absatz unter Verwendung des entsprechenden Klassennamens angewendet . andere Möglichkeit, die ich verwenden kann, ist mit Marge-Eigenschaft, die das Tal für alle vier Seiten 100 Pixel für die obersten Null für Rechte gibt , aber, um, und links mit Margin-Eigenschaft mit Wert 100 000 Der erste Wert stellt Marge dar. Oberer Sekundenwert mit Null-Marge, rechter bestimmter Rand unten und letzter Rand links, der in der Praxis der gleiche ist in der Praxis wie Benutzungsmarge. Top mit Wert 100 Pixel Jetzt, um die Ränder zu beenden, wenn Sie möchten. Nur Rand links und rechts mit 50 Pixeln und die anderen mit Null, Sie müssen nur Null 50 Pixel Null und 50 Pixel schreiben, um die Box-Modellelemente zu beenden. Die padding Eigenschaft, die verwendet wird, um Gewürz zwischen Inhalt und Rand zu erzeugen und verwendet sehr ähnlich mit margin Eigenschaft. Es gibt CSS-Eigenschaften für die Einstellung der Bettwäsche für jede Seite. Oft Element Top-Rechte kauften sie und verließen. Aber wie Marge können Sie die verkürzte Eigenschaftenauffüllung verwenden, die für einzelne Eigenschaften für jede von den anderen Seiten verwendet wird . Ich habe jetzt meinen zweiten Absatzstil geändert, und es gibt eine Streichelung von 20 Pixeln und Sie sehen, dass Gewürz zwischen Text und Rand aus zweiten Absatz zunimmt. Wenn Sie nur den unteren Wert ändern möchten, können Sie einfach die Ausgaben unten mit 10 Pixel verwenden, sind Sie Bett-Eigenschaft mit Null Null verwenden, dann Pixel und Null verlassen. Tal Korrespondent Streicheluntergrundeigentum. Es ist so für den Moment, Dinge. 30. CSS Schrifteigenschaften: I. Wir haben gesehen, auch, auch, trotz gesendeter Entschuldigung, CSS Gold sowie einige der Kinder Konzepte mit Cascading Stylesheets verbunden zu erstellen . Nun, da Sie bereits einige der Haupteigenschaften erkundet haben, ist es an der Zeit, andere Eigenschaften zu sehen. ID mit Textfonds verknüpfen. Die CSS Fonds-Eigenschaften sind das Richtige für die Änderung grundlegender Front-Einstellungen wie die Frontfamilie , unterschiedliche Größe und die Frontwelle. Mit einigen Eigenschaften können Sie Kühnheit, Größe und Stil aus dem Text definieren , beginnend mit der vorderen Familieneigenschaft, die die Vorderseite definiert, die auf das ausgewählte Element in CSS angewendet wird . Es gibt zwei Haupttypen von Fondsfamilie, den Familiennamen, wo Sie eine bestimmte Fondsfamilie wie Zeiten New Roman Ariel oder Verdana definieren, die Sie von einigen Microsoft-Anwendungen wie Power Point kennen . Der andere Typ ist generische Familie, die Sie verwenden können, um eine Gruppe von Spaß Familien mit einem ähnlichen Aussehen wie Saref San Serif oder Mono Gewürz definieren . In der Praxis, jede Generika Familie als Siri aus der Familie Namen assoziativ. Aber wenn Sie in dem Telefontyp genauer sein möchten, den Sie verwenden möchten, ist es immer besser, Familiennamen zu verwenden Um die Vorderseite anzugeben, können Sie die lustige Familie einen Text mit dem Fonds Familieneigentum mit diesen beiden Typen festlegen, Diese Eigenschaft sollte alle mehrere Vordernamen als Fallback-Systeme. Wenn der Browser den ersten Fonds nicht unterstützt, versucht er den nächsten Fonds und so einen. In diesem nächsten Codebeispiel habe ich für meinen ersten Absatz den Fonds Family property First mit Wert definiert. Verdana, das ist meine erste Wahl. Zweitens möglichen Wert Ariel und weniger Option. Ich benutzte den generischen Familien-Mono-Raum. Das ist meine oberste Priorität. Also, wenn Sie in Ihrem Computer, Sie nie als es oder in der Luft würde die Seite verwenden, was Mono-Gewürzmittel es finden könnte. Für den zweiten Absatz, Ich benutze andere Telefonkombination, beginnend mit Wert mal New Roman für die erste Priorität und für die zweite Option und letzte Spaß Familie könnte hier. Für dieses Beispiel habe ich keine generische Familie verwendet. Jetzt die zweite Eigenschaft für Texte verwendet. Der Telefonstil, der hauptsächlich zum Festlegen von kursivem Text verwendet wird. Diese Eigenschaft hat drei Werte normal, das ist Standardwert, bei dem der Text normal angezeigt wird, wie Sie jetzt sehen, wo ich diesen Wert in CSS-Code anwende , der sich kursiv ändert. Sie sehen, dass der Text kursiv dargestellt wird, wie wenn Sie diesen Stil in Textanwendungen wie Microsoft Wörtern verwenden und schließlich schräg, die kursiv ist, aber letzte Unterstützung. Die nächste Eigenschaft ist Spaß Größe, die ich in einigen vorherigen Beispielen verwendet und gibt die Größe der Vorderseite an, die ich angewendet. An dieser Stelle habe ich diese Eigenschaft immer mit Pixeleinheiten verwendet, aber in anderen Videos werden Sie sehen, dass es andere Einheiten gibt, die Sie mit mehr Vorteilen verwenden können . Die Syntax, die für diese Eigenschaft verwendet wird, ist Spaß Größe und korrespondent Wert. Für den ersten Absatz, Ich wende jetzt Telefongröße von 14 Pixel an, und im zweiten Absatz, ich m einen Wert von 20 Pixel. Endlich anders weiß. Das heißt, salzig Warenkorb in Zeichen im Text würde angezeigt werden. Diese Eigenschaft akzeptiert entweder ausgehärteten Wert oder pred, wenn ich numerischen Wert ng. De verfügbaren Schlüsselwörter sind normal, die verwendet wird, um normale Zeichen zu definieren, und dies der Standardwert Bull-Wert, , wie Sie sehen, Stick-Zeichen fett und leichter definieren, der, wie Sie sehen, Stick-Zeichen fett und leichter definieren,sind mit der berechneten Vorderseite weiß aus der Eltern Elemente, die ein mehr erfindet Konzept, das mit dem Eric E. Off baj Elemente, die ich sprechen eine andere Lektionen. An diesem Punkt müssen Sie nur wissen, dass in den meisten Off-Situationen Wert Boulder ist ähnlich mit Wert Bolzen und leichter mit dem Wert Normal. Eine andere Option für diese Eigenschaft ist die Verwendung von numerischen Werten, wobei die Q-Wort-Wert-Normalkarten in America Valley 4/100 gemacht haben und der Wert Bolzen sieben Hunderten zugeordnet , die ich jetzt im zweiten Absatz verwendet habe und dies ähnlich mit gültig, dass ich f in ersten Tarif diese Eigenschaft kann und Werte, wenn Hunderte bis neun Hunderte, wo Schritte sind mehr Vielfaches aus, wenn Hunderte, das ist alles für jetzt. 31. Texteigenschaften: Lassen Sie uns jetzt nach einigen Texteigenschaften suchen, die zusammen mit Fondsimmobilien verwendet werden können zuvor ersten Text verfolgt wurden. Die Zeile ermöglichte es uns, Text innerhalb eines Elements auszurichten, das Sie aus links wählen können, rechts, zentriert oder ausrichten beachten Sie, dass diese Eigenschaft Allianz Text innerhalb seiner enthaltenen Elemente, nicht auf der gesamten Seite. Für das nächste Beispiel habe ich einen längeren Text für die beiden Absätze, in denen der zweite keinen Wert von Text ausrichtet , während der erste Absatz ich es mit dem Wert links sagte. Nachdem Sie den Wert links angenommen haben, die Ausrichtung nicht geändert und ist gleich dem zweiten Absatz, da links der Standardausrichtungswert ist , den der zweite Absatz oder ein Absatz annimmt, wenn die Eigenschaft nicht definiert ist . Dann änderte ich den Wert vom ersten Absatz nach rechts. Und hier sehen wir Unterschiede in der Ausrichtung von den beiden Texten, einer nach rechts und der andere nach links. Der nächste Wert ist zentriert, zentriert den Text, und schließlich haben wir den Wert. Begründen Sie jetzt, die CSS Caller Eigenschaft Schuld trotzt die Vordergrundfarbe aus dem Textinhalt, Fremdelement, Empfang der Farbe Namen oder gräbt einen Dezimalcode entsprechend der Farbe, die ich am Anfang verwendet . Einige Beispiele für diese Eigenschaft. Und jetzt werde ich diese Eigenschaft zu den Absätzen tragen und den Texten des ersten Absatzes Farbe grau geben. Wenn ich einfach Eier einen Dezimalaufruf für die gleiche Farbe möchte, muss ich nur etwas Kuchen verwenden. Nur Schulden jeden Tag verlassen Dezimalwerte für verschiedene Farben. Achten Sie auf die Farbe Grau. Ich sehe, dass Exit-Dezimal für Grau aufgerufen 808080 Dies ist eine Erkältung, die ich in CSS setzen muss und Sie sehen, dass es keine Änderungen in der Absatztextfarbe wie erwartet gibt, weil in zwei Absätzen, definiere ich die gleiche Farbe. Nächste Eigenschaft ist Buchstaben-Würzen. Der Tod steuert die Menge aus Gewürz zwischen jedem Buchstaben in einem bestimmten Element. Veli normal ist der Standardwert, und Sie können einen Landwert verwenden, indem Sie verschiedene Einheiten verwenden, wie Sie in verformter Größe verwenden. Ich definiere in diesem Beispiel für meinen zweiten Absatz einen Buchstabenabstand mit dem Wert zwei Pixel und wechselt nun zu vier Pixel. Du siehst, dass Gewürz zunimmt, um normal zu werden. Das Gewürz nimmt das Standardgewürz zwischen Buchstaben Situation ähnlich dem ersten Absatz in dem ich diese Eigenschaft nicht verwende. Angenommen, das Standardgewürz, um Texteigenschaften zu beenden, habe ich die Zeile. Ich würde CSS-Eigenschaft, die die Menge an Gewürz festlegt, die für Zeilen wie in Text verwendet wird, um Elemente der Ebene zu entsperren . Es gibt das Minimum an, das ich von den Zeilenfeldern innerhalb der Entgleisung auf nicht ersetzt in Zeilenelementen würde. Es gibt das I, das verwendet wird, um Zeilenfeld zu berechnen. Lassen Sie uns in der nächsten Lektion sehen, tun Konzepte aus Block und in Linienelementen. Ich benutze jetzt diese Eigenschaft im ersten Absatz und gebe einen Wert von furzenden Pixeln und Sie sehen , dass wir je anders Gewürz zwischen den Linien wie erwartet, Erhöhung des Wertes Raum wird wachsen und abnehmende Gewürze reduzieren, das ist alles für jetzt, Danke. 32. Block- und Inline-Elemente (Div und Span: jetzt, Zeit, Block und in Zeile Elemente zu verstehen, mit denen ich im vorherigen Video gesprochen. In einem HTML-Dokument können wir diese beiden Arten von Elementen blockieren und in Zeile haben. Es ist sehr wichtig, das Konzept an den Unterschieden zwischen diesen beiden Arten von Elementen zu verstehen , die weit verbreitet sind, wo Seiten verschiedene Abschnitte zu erstellen, beginnend mit Blockelementen ein Blockelement standardmäßig immer auf einer neuen Zeile beginnen und besetzen alle mit, wie einige Elemente, die Sie bereits kennen, wie Tarife. Tabellen sind Formulare und Blockelemente stapeln sich übereinander. Ich erstelle jetzt ein Beispiel mit den vorhandenen Absätzen, wo ich für die erste eine neue Eigenschaft Namen, Hintergrundfarbe, Tod trotzenden Gelehrten Elemente Hintergründe definieren Eigenschaft Namen, Hintergrundfarbe, Hintergrundfarbe, . Für dieses Beispiel wende ich eine Hintergrundfarbe mit blauem Wert an, die uns helfen, das Gewürz durch den Absatz besetzt zu sehen . Sie sehen, dass nach der Verwendung der Eigenschaft der Absatz das gesamte mit außerhalb der Seite belegt. Wie ich schon sagte, passiert das mit Blockelementen. Wenn ich einfach den Absatz mit ein paar Worten überlasse, sehen Sie, dass Absatz weiterhin voll besetzt mit. Wenn ich die Hintergrundfarbe zum zweiten Absatz definieren Sie sehen, der zweite Absatz ist unter dem ersten, besetzt wieder, alle mit habe ich jetzt ein neues wichtiges Blockelement eingeführt. Wenn das DIF Tech Network als Container mit einer Start- und Endtechnologie dargestellt wird und am häufigsten verwendet wird , um verschiedene Abschnitte in einer Webseite zu erstellen, so dass der Inhalt von der Seite entfernt und getrennt werden kann, funktioniert die Siedlung wie Tarif und andere Blockelemente, die alle Hydrate besetzen. Ich definiere jetzt einen Abschnitt in meinem Code, mit def, der die beiden Absätze enthält, die ich auf der Seite bin und diesem neuen Element in meinem CSS-Mantel Glasnamen Container gebe , den ich für diese Klasse einen grünen Kragen Hintergründe und die Polsterung aus 10 Pixel. Nach diesen Änderungen können Sie sehen, dass sich unsere Absätze innerhalb dieser Elemente befinden, die den gesamten Seitenkranz einnimmt . Jetzt ist es Zeit für die In-Line-Elemente und In-Line-Element beginnt nicht auf der neuen Zeile und nimmt nur so viel mit wie nötig. Was nicht mit Blockelementen passiert. Beispiele wie Bilder sind April Inc-Elemente in Linie Elemente darstellen. Ich schaffe jetzt meinen Mantel einen Text mit April ing zu sehen, dass diese Krankheit nicht wie ein durch den vollen Weizen. Für diese verwende ich eine Tech für April-Tinte und einige Texte in CSS kalt. Ich setze mich jetzt für die Siedlungen, eine rote Farbe Hintergründe und Blick auf die Seite. Sie sehen, dass dieses Element nur das Gewürz von seinem Inhalt einnimmt. Was passiert nicht mit den Absätzen? Nachdem ein neues Blockelement verwendet zu haben, Deve, Ich verwende jetzt ein neues in Line-Element, das Element Spanne, die mit dieser Pantech Schulden als Start eine Endtechnologie dargestellt wird. Ich benutze jetzt den ersten Tarif und setzt involvierten Text in dieses neue Element. Wenn ich dieses Element zu einem grauen Farbhintergrund sagte, sehen Sie, dass nur der Inhalt, der sich im Stapel befindet, von der Hintergrundfarbe beeinflusst wird, die wie ein In-Line-Element arbeitet. Okay, im Lebenslauf können wir zwei Arten von Elementen blockieren Tante in der Reihe haben. Die Blockelemente besetzen das gesamte mit aus der Seite wie tiefe Schulden wir mit Hintergrundfarbe grün erstellt und die Absätze mit blauer Hintergrundfarbe Deadline Elemente nehmen kein erbärmliches Weizen Wesen. Das Beispiel in der Sprache und Nipper Link mit rev Hintergrundfarbe und die neuen span Elemente mit Hintergrundfarbe grau Dank 33. Breite und Height: Ich haben wir vorher Tod standardmäßig überprüft. Die Blockelemente belegen das gesamte mit aus der Seite. Es gibt jedoch mehrere Eigenschaften, die es Ihnen ermöglichen, die mit den Siedlungen zu ändern, so dass der besetzte Raum sich an die Größe anpassen, die wir mit definieren möchten. Wir haben die Eigenschaft mit, die auf ein Element angewendet werden kann, diese Eigenschaft aus dem Element enthält keine Bettwäsche, Rahmen oder Ränder. In diesem nächsten Beispiel muss ich tun gibt eine mit grüner Farbe und ein anderes Blau, die das gesamte mit aus der Seite besetzen , da ich Browser vermindert habe. Die Verpfändungsgröße verringert den Inhalt, und das DIV passt sich mit an die Bildschirmgröße an und erhöht mich, wenn nötig. Wenn ich jetzt die Weizeneigenschaft mit 900 Pixeln für den ersten Vorabend verwende, was passiert dann? Hat es würde Onley Nacht 100 Pizzen statt voll mit zu besetzen? Das Problem ist, dass die Diva, indem sie die Größe der Seite verringert, die gleiche Größe erinnert das dif nicht an die Größe des Fensters anpasst. Es ist hier, dass wir die Property Mac-Suite eingeführt, die die 900 Pixel und Minimalwert und nicht einen festen Wert macht Also habe ich niedriger mit Werten, wenn das Fenster zu Werten unter 900 Pixel rezitiert wird , wie wir jetzt im Bruder sehen können. Ein weiteres mögliches Szenario ist die gleichzeitige Nutzung der beiden Eigenschaften im ersten Live. Wenn Sie Max mit 800 Pixeln Wert verwenden, was passiert, wird er diesen neuen Wert annehmen, aber als festen Wert, nicht an Inhalt auf Werte unter 800 Pixel anpassen. Nun, fügen Sie den Geist mit Eigenschaft in der zweiten Div. Lassen Sie uns einen Mindestwert für die mit off 600 Pixel erstellen. Was passiert in dieser Situation ist, dass sie das Maximum mit aus dem Fenster folgen, aber Onley bis zum Wert von mir mit für Werte gesenkt, dann 600 Pixel zu D erinnert mit dem süßen Verlassen des Inhalts toe eine Überlaufsituation. Ich gehe jetzt hin. Sprechen Sie über die ID-Eigenschaft, die das Element Ich habe oft definiert. Wenn ich in den ersten trotzten 300 Pixel setze, wird das Verhalten ähnlich wie die weiße Eigenschaft sein, bei der Entwickler aus Weiß und ich behoben sind und es keine Änderungen im Deve mit der Größenänderung aus dem Fenster auf die gleiche Weise gibt, wie ich erstellt habe Minimal- und Maximalwert für die mit kann ich für den ersten Tag erstellen, wenn ich Mindestwerte mit off 200 Pixel und ich habe 150 Pixel. Was passiert in dieser Situation ist, dass, wenn ich den Browser mit dem Weizen abnehme, der und Inhalt wird sich an die Größe anpassen. Ja, für die Ich habe sehen wir, dass, da wir ein Minimum von 150 Pixel haben, haben wir einige freie Gewürze ohne Inhalt. Und während ich das Fenster verkleinere, passt die IKT vom grünen Blatt ihre Seite an den Inhalt an. Jetzt für die letzte Situation, wenn bei 50 Pixel für das Max eingegeben habe ich für Verkleidung, wir haben nicht Minimum definiert. Ich habe Wert, also macht die erste Hauptjustizseite den Inhalt. Wenn ich die Größe vom Fenster verkleinere, bekomme ich eine Situation, in der die grüne Tiefe 150 Pixel außerhalb der Lebensdauer erreicht und je länger die IIF erhöht , was zu einer übervollen Situation führt. Wie Sie jetzt sehen können, 34. Eigenschaft positionieren: die Position Eigenschaft gibt unsere Krankheit ist positionieren Sie es in einem Dokument mit der oberen rechten Taste und linken Eigenschaften, um das Element an die endgültige Position zu verschieben. Diese Eigenschaft kann fünf verschiedene Werte statisch annehmen, das heißt, der Standardwert bezogen absolut fest und klebrig, beginnend mit verwandter Position, die es uns ermöglichen, unsere Elemente in Bezug auf wo sie Bean gesegnet haben Standardmäßig. Verwenden Sie die zugehörige Position, müssen Sie den Betrag angeben, den Sie verschieben möchten. Das Leiden mit vier Eigenschaften oben links unten und den Rechten gefolgt von einem Wert tot entspricht der Entfernung, die für das nächste Beispiel verschoben werden soll. Ich möchte diese Situationen auf die beiden Tiefen anwenden, die ich in HTML für die erste definiert habe 1 Ich definiere eine Woche von 300 Pixel. ICT off 100 Pixel endete unsere große Hintergrundfarbe in den zweiten Tag, wenn ich jemals. Mit off 400 Pixel, Ich habe off 100 Pixel und grün als Hintergrundfarbe in den Bruder. Wir sehen, dass die erwartete Position außerhalb der Tiefen eine auf Stopp off der anderen ist. Wenn wir nun auf die erste verwandte Position gesetzt, geben einen Wert von 20 Pixel auf die obere Eigenschaft und 40 Pixel nach links. Es stellt sich heraus, dass die erste dif Position 20 Pixel von oben und 40 Pixel von der linken Seite ändert seine endgültige Position und das zweite dif ohne Änderungen. Wenn ich auf den zweiten Tag der gleichen Werte angewendet, die ich für die 1. 1 erstellt habe, wird erwartet, dass es tot gesehen werden kann. Zweitens ist Dief in der gleichen Position bezogen auf die zweite, wenn, wie es passiert ist, es anfänglich, da die gleichen Offsetwerte auf die beiden Chefs angewendet wurden, ich werde nun ein letztes Beispiel für die zugehörige Position in Verkleidung. Wenn Sie den zweiten Vorabend auf der rechten Seite von der 1. 1 für die Situation setzen möchten, muss ich die zweite verschieben, wenn bis zu 100 Pixel, was einem Wert von minus 100 Pixel entspricht, um die obere Eigenschaft Ende nach rechts, entsprechend einem linken Seitenversatz, der gleich sein muss, um mit dem Wert aus dem ersten def in Verkleidung zu tun, 300 Pixel können wir jetzt sehen, dass die Diebe nebeneinander wie erwartet sind. Jetzt ist die absolute Position, die die Platzierung jedes Patch-Element genau dort ermöglicht, wo Sie wieder Eigenschaften oben links, unten und rechts verwenden , um die Position festzulegen. Ein wichtiges Detail ist, dass die Position außerhalb des Elements auf seiner nächstgelegenen Position Assessorposition für die Situation basiert Body ist der nächste Vorgänger. Was diesen Wandel ausmacht, den ich der Verteidigung gebe, basiert auf meiner ganzen Seite. Zuerst änderte ich zuerst dif mit auf 400 Pixel und zweitens auf 300 Völker. Und wenn ich sagte, die erste und zweite Niederlage auf die absolute Position und und links und Top-Eigenschaften mit Nullwert, der macht, dass zwei Diebe oben links von der Charge platziert werden , würden wir zweiten dif oben zuerst. Wenn ich nun links ändere, bis Werte aus dem zweiten Eve auf 100 Pixel, sehen Sie, dass sich dieses div in andere Teile des Patches bewegt, die der Verschiebung entsprechen, die ich jetzt anwende, um die Fußposition zu beenden. Ich stelle eine andere Situation vor, Schaffung durchsetzungsfähig innerhalb der zweiten. Mit dieser Struktur aus gibt der zweite Dief ist der Vorfahre aus der Suche. Also, wenn ich für 30 erstelle, wenn mit absoluter Position und linker Wert von 50 Pixeln, wird sich dieses Dif von links nach rechts bewegen, 50 Pixel bezogen auf die Position aus der zweiten, wenn und nicht in Relation von oben links der Seite. Es gibt auch eine zweite Art von absoluter CSS-Positionierung namens feste Positionierung, die Sie verwenden können, um ein HTML-Element an einer exakten Stelle in Beziehungen zum Bildschirm des Benutzers in Schritt off Bruder zu lokalisieren . Wir wissen, dass der Unterschied zum absoluten hier ist, dass die Krankheit in genau der gleichen Position bleibt , auch wenn der Benutzer die Seite nach unten scrollt, ist das, was Sie jetzt sehen, wo ich das erste div mit dem festen Wert für die Positionseigenschaft sagte und ich legte die zweite, je weiter unten die Seite und wir die ICT off 1000 Pixel in der Lage sein, das Badge zu scrollen und sehen den jeweiligen Effekt. So wie es ist, sind wir jetzt fünf auf der Seite. Das erste def bleibt an der gleichen Stelle, selbst wenn Sie die Seite schlendern. Schließlich ist dieser klebrige Wert, wo die Elemente positionieren es basierend auf der Scroll-Position des Benutzers. Ein krankes Element ändert sich zwischen verwandten und festen, wird zunächst als verwandte Position behandelt, bis es einen bestimmten Schwellenwert überschreitet, an dem Punkt, wird es als feste Positionen behandelt. Lassen Sie uns ein Beispiel sehen, um einen besseren Dispositionswert zu verstehen. Ich habe jetzt auf dem Batch einen Absatz und zwei Chefs gesetzt, der erste dif, den ich mit klebrigem Wert gesetzt habe. Und für die zweite füge ich die Verschmelzung Top-Eigenschaft mit Valley ab 200 Pixel hinzu. Trotz der beiden dif und ich aus 2000 Pixel. Um die Schriftrolle verwenden zu können, um den Effekt zu sehen, ist es nun notwendig, den ersten Deve di Tresh Halt zu definieren, der sagt, an welchem Punkt Eva fixiert wurde. In diesem Beispiel habe ich die top Eigenschaft mit dem Wert 10 Pixel definiert, was dazu führt, dass, wenn der Deve sich in dieser definierten Entfernung befindet, eine Situation behoben wird, die Sie jetzt in den Browser sehen können. Wenn Sie die Position ändern möchten, in der es nach oben oder unten fixiert ist, ändern Sie einfach den Wert von der top Eigenschaft. Ich habe jetzt Null geändert und Sie sehen Unterschiede im Vergleich zum vorherigen Beispiel, wir tendieren Pixel für den Spitzenwert, denkt 35. Schatten und klaren Eigenschaften: Ich begrüße zu einem anderen Video, das ich zuvor über Steves gesprochen habe, die als visionärer Container Tod arbeiten , der den verschiedenen Abschnitten unserer Webseite widersetzt, werden Geschenke verwendet, um Inhalte zu gruppieren , so dass es einfach sein kann, Stil mit der Klasse oder I D. Attribute, die Sie gelernt haben. Vergessen Sie nicht, dass dies Blockelemente sind, die ich 100% von den Seitenlesungen kaufen könnte, indem Sie Standardverhalten ausgeschaltet haben, übereinander stapeln. Lassen Sie uns jetzt eine sehr wichtige Eigenschaft sehen, die verwendet wird, um Ihre Layouts zu definieren. Die Fußeigenschaft, die für die Positionierung und Kontrolle auf Webseiten verantwortlich ist. Mit dieser Eigenschaft können Sie Blockelemente nebeneinander setzen, anstatt auf die andere, die Kontrolle über die horizontale Position oft HTML-Elemente geben, um alle diese Eigenschaft Wörter besser zu verstehen . Lassen Sie uns ein Beispiel mit drei D EFS, anderen Neff und Mine Elementen machen , die ich in meinem Mantel erstelle. Zuerst habe ich einfach Stil für meinen ersten Deve definiert, wobei 100 Pixel-Wert für rechts und die Hintergrundfarbe hellgrün für meine Never Deve mit 200 Pixeln von I und Hintergrund Kohler Koro verwendet werden. Und schließlich, für meine Hauptdif. Ich definiere die IKT mit dem Wert von 500 Pixeln und Hintergrundfarbe. Richtig? Sie sehen im Browser, dass Diebe alle vertikal auf der Oberseite angezeigt werden und den ganzen Patch mit besetzen, wie erwartet, beginnend jetzt den Mantel zu ändern, wenn ich einfach Float-Eigenschaft mit Wert für den anderen verwendet habe . Und wenn ich weiß, mit off 33% Ich änderte die Position von diesem dif nach links, erzählte der Diva Nev, die um unsere anstelle von Anfang unten fließen können. Wenn ich jetzt einen Text zu diesem zweiten dif hatte, sehen Sie, dass der Text um den anderen schwebt. Wenn der Text nicht Schüler ive ernährt, passiert es Überlaufsituation, wo ein Teil der Todesfälle außerhalb des dif ist. Ein anderes mögliches Szenario ist, wenn ich die Verteidigung Seite an Seite sein möchte, ohne dass irgendein Element um das andere wickelt. Für diesen Fall muss ich die Float-Eigenschaft wieder zu meinem zweiten dif hinzufügen, wobei der Wert für die Verkleidung übrig bleibt. Wir sehen, dass der DIF unter dem anderen bleibt, weil dieser Steve ein Blockelement ist, das 100% vom Unkraut durch die Falte einnimmt. Ich kann Onley Position auf der rechten Seite von zusammen, wenn ich ein definiere, das gleich oder kleiner ist als der Raum links auf der rechten Seite vom ersten dif ist, wie Sie jetzt in dem Bild sehen wo ich ein mit dem Wert aus 33% andere Details sichtbar ist, dass die Klasse ive schwebt jetzt um die anderen beiden. Deifs Schulden. Jede Eigenschaft Float mit dem Wert links. Wenn ich das zweite div auf der rechten Seite positionieren möchte, muss ich nur den Float-Wert von links nach rechts ändern und sicherlich sind Sie immer noch um die beiden ersten. Das, was ich jetzt will, ist, dass weniger Diff nicht um die 1. 2 Tiffs fließen, die darunter bleiben. Das ist das Szenario, in dem ich die Clear Eigenschaft verwendet habe. Wenn diese Eigenschaft das Value Boat erhält, sind auf der linken oder der rechten Seite keine schwebenden Elemente zulässig. Also bewegte sich dieses dif unter das schwebende Element nach unten. Die clear Eigenschaft kann immer noch linke und rechte Werte haben, in denen, wenn wir nicht wollen, dass Elemente auf der linken Seite schweben. Wir haben den Wert links angewendet, und für den Fall, dass wir nicht wollen, dass er auf der rechten Seite schwebt. Wir haben die Wertrechte genutzt. Das ist die nächste Situation. Zehenuhr I f in diesem Moment eine Diva auf der linken Seite und eine andere auf der rechten Seite. Wenn ich den Wert klar links in meinem Sergeev anwende, überprüfe ich, dass Stop herumschwimmt zuerst, wenn Onley sich um die zweite dif zweite Situation herum passiert, wenn ich den Wert von links nach rechts ändere, um das d um das linke Rindfleisch schwebt zu sehen . Ich muss nur die IKT vom ersten dif toe einen Wert ändern, der größer ist als der zweite Vorabend. Okay, Sie sehen jetzt die drei schweben um zuerst live und zum Schluss möchte ich drei d in der gleichen Zeile angezeigt wird , sehr einfach anzuwenden. Ich muss nur den Schwimmer zu meinem letzten def mit kaum links tragen und ein mit off 33% geben, um alle von ihnen nebeneinander angeordnet sind. Das ist alles für den Moment. Danke. 36. Relative und absolute Einheiten: Cascading Stylesheets verwendet verschiedene Einheiten zum Ausdruck der Länge. Viele CSS-Eigenschaften, wie zum Beispiel mit Bettzeug Rand und Spaß Größe, nehmen Landwerte. Wo Lent ist eine Zahl gefolgt Gewalt Einheit, wie Pixel Einheit. Wie ich in vielen früheren Beispielen verwendet habe, können wir zwei Arten von Längeneinheiten in CSS bezogen und absolut beginnend mit verwandten Längen Einheiten verwenden , sie angeben. Eine Fussel, die mit einem anderen Linz verwandt ist. Ein großer Vorteil in Stylesheets, die verwandte Einheiten verwenden, ist, dass Sie leicht skalieren können von einem wird die Umgebung zu einem anderen setzen, wie von einem gekleidet bis zu einem Smartphone, Schaffung von reaktionsfähigen Inhalten. Lassen Sie uns jetzt sehen, dass die wichtigsten verwandten Einheiten, beginnend mit E M Einheit in CSS und der Endeinheit, gleich der berechneten Frontgröße für das Element, auf das das M angewendet wird. Wenn ich es bin, werden Einheiten für untergeordnete Elemente deklariert, die keine lustige Größe definieren. Sie werden ihre Telefongröße von ihren Eltern oder von anderen Vorfahren Elemente erben möglicherweise den ganzen Weg zurück zum Wurzelelement unter Dokumenten gehen. Lassen Sie uns das folgende Beispiel sehen, um besser zu verstehen I f. Zwei Absätze erste und Sekunden in einem Deve mit Glasnamen Inhalt eingefügt. Ich setze jetzt meine Klasse an erster Stelle. Wir die Schriftgröße von 15 Pixel. Und wie gesagt, ist eine AM-Einheit gleich dem Schriftgrößenwert, der für das Element erstellt wurde. Also, wenn ich die Linie kreiere, würde ich in der gleichen Krankheit wie das Tal. Eins e m. Entspricht einem Wert von 15 Pixeln zur Eigenschaftslinie. Ich habe Wenn ich einen Wert von zwei PM-Abschlepplinie gebe, erhält er den Wert zweimal 15 Pixel, der 30 Pixel entspricht. Ich setze jetzt einen Wert von 12 Pixeln auf die Schriftgröße aus dem Klasseninhalt. Wie Sie den Text sehen, erbt den Wert in ihrem Elternteil festgelegt, eine Situation, die nur auf der zweiten Klasse passiert, weil diese Klasse keine definierte Spaßgröße hat. Wenn ich jetzt eine Telefongröße von 14 Pixeln in Klassensekunden definiere, überprüfen Sie, ob der zweite Absatz eine andere Größe annimmt, die in Klassensekunden erstellt wurde. Und als ich die Linie mit dem Wert von 1 Uhr morgens hatte. Dieses Mal für Klasse Second berechnet diese Eigenschaft das Tal für die Licht-ICT bezogen auf die furzenden Pixel, die ich innerhalb des Glases selbst definiere. Alle Änderungen, die ich in unterschiedlicher Größe vornehme. Aus dem Klasseninhalt wirkt sich nicht auf die Eigenschaften aus, die in den Absätzen erstellt wurden, aus, da sie selbst die Schriftgrößeneigenschaft definiert haben. Wenn Sie gut verstehen, funktioniert die gesamte M-Einheit, dann ist es einfach, die neue R E M-Einheit zu verstehen. Diese Einheit ist zwei verschiedene Größe von Routenelement HTML bezogen, dass mein Standard 16 Pixel ist , aber dieser Wert kann vom Benutzer geändert werden. Ich weiß es. Machen Sie ein einfaches Beispiel, um die beiden Einheiten in meinem Root-HTML-Element zu unterscheiden. Ich habe mich auf die Größe von 14 Pixel gesetzt, während Indien def Inhalt Telefongröße mit Wert auf R E M definiert Für die Absätze habe ich die Werte eine R E M für die erste und eine PM für die Sekunden. Was passiert jetzt? Der erste Absatz, der als Durchfall Munitz den Wert im Zusammenhang mit den furzenden Pixeln berechnet, definiert im Wurzelelement. Nun, dann ist immer Spaß Größe von 14 Pixel, während das zweite Element die Berechnung in Bezug auf den übergeordneten Inhalt macht, da der übergeordnete Inhalt zweimal größer ist als der Wert, der in der Routengröße definiert ist, die Größe in Inhalt ist 28 Pixel, was auch der Wert für den zweiten Absatz sein wird, wenn ich die HTML-Telefongröße ändere. Wirkliche Wirkung, wie erwartet, Die beiden Absätze. Schließlich änderte ich mich von der Größe für def Inhalt, wobei der Wert 12 Pixel die Zehe änderte. Eine absolute Einheit für diese Situation. Wenn ich die HTML-Schriftgröße ändere, sehen Sie nur Änderungen im ersten Absatz, da jetzt der zweite Absatz über die Größe mit den 12 Pixeln zusammenhängt , die ich im Klasseninhalt definiere. Jetzt die Ansicht Teil Prozentsatz Lanze bezogen sich auf die Größe aus dem Fenster Bruder. Wenn sich die ICT oder mit off the BHs Widder ändern, werden sie entsprechend skaliert. Die Verwendung dieser Einheiten im Zusammenhang mit dem View-Teil sind wichtig, weil sie die Größe aus dem Inhalt an die Größe von den Geräten anpassen , die wir je für mögliche verschiedene Einheiten im Zusammenhang mit View-Teil können . Die 1. 2 sind die Einheit Alter, die auf 1% Rabatt auf die IKT bezogen ist. Aus der Ansicht Teil anfänglich Block enthält, der unser Bruder Fenster und die Visa Lou ist, die auf 1% auf den Witz aus dem View Teil bezogen ist. In diesem Beispiel sehen wir zwei Schöpfer von Geschenken, die erste wird von der anderen Klasse und die zweite durch die Content-Klasse identifiziert. Ich erstelle jetzt Stile für diese beiden Klassen, indem ich die erste 1 mit einer hellgrünen Hintergrundfarbe und die zweite mit hellblauer Farbe definiere. Wenn ich will, dass das erste Geschenk zu besetzen aus der mit und ich habe ich muss nur tun mit auf einen Wert von 50 V W und die IDs auf 50 V h setzen . Wir können sehen, dass, wie ich die Größe des Fensters verkleinern, es wird immer aus der mit besetzen, und ich 'd space Jetzt weit getan, wenn Inhalt, ich möchte, dass dieses Element 1/4 von der Größe aus dem Fenster belegt. Um dieses Verhalten zu erhalten. Ich muss nur den Wert festlegen, um 25 Ende des Alters auf den gleichen Wert zu entwickeln. In diesem Beispiel belegen Daves 75% vom Viewport. Ich habe, wenn ich will, dass sie alle ihre Augen besetzen, müssen nur jedem von ihnen einen Wert von 50 oder eine andere Kombination von Werten, in denen das gleiche aus den beiden Osten 1/100. Die letzten beiden Einheiten, die Sie Teil RV Männer und V Max Einheiten verwenden erlaubt Ihnen, die Größe aus der kleineren oder größeren Größe aus dem Aussichtshafen zugreifen , wenn er die Männer verwendet. Sie berechnen ein Land, das 1% aus dem View-Port bezogen ist. Kleinere Bemaßungen und die Verwendung von Remix beziehen sich auf 1% auf den Ansichtsport. Größte Dimension. Sie werden jetzt ein Beispiel sehen, in dem ich Elemente blockieren muss, die von der anderen Klasse an der Spitze und Content-Klasse unter der anderen definiert sind, sagte ich. Jetzt ist die IKT von diesen beiden Dieben für den anderen. Ich definiere eine Abschreibung 20 Mittelwert und für das Glas contento rechts 250 Pixel. Wie Sie für die Unzufriedenheit Klasse erwarten können, ändert es sich nicht, weil wir einen absoluten Wert für den anderen verwenden . Richtig? Ich habe TV Men Einheit mit Wert 20 verwendet, wodurch es 20% der im Zusammenhang mit der kleineren Größe aus dem View-Teil im Browser belegt , können Sie das erwartete Verhalten mit diesem Gerät sehen. An diesem Punkt habe ich den View-Port, wo die kleinere Größe die ICT ist. Also die ID für die andere ist mit dem ICT aus dem Ansichtsteil verbunden, dass als die kleine Größe, wie ich das Fenster verkleinere, die andere ich nicht ändere, weil das Ansichtsteil rechts unsere Dekrete nicht erhöht. Wenn ich zu einem Punkt komme, an dem das mit aus dem Ansichtsport kleiner wird als das Auge, beginne ich Änderungen in der ID des anderen zu haben, wie es jetzt geschieht, weil sich die kleinere Größe des Ansichtsteils jetzt ändert. Wenn ich zu der Situation zurückkehre, in der die ID der Ansicht Parteien die kleinere Größe, wenn ich das Auge des View-Port ändere, vermutet es, jemals in den Augen von der anderen wieder zu ändern. Schließlich, wenn Sie für dieses Beispiel die V Max verwenden, habe ich eine Änderung in der essen aus der anderen dieses Mal im Zusammenhang mit der größeren Größe aus der Ansicht . Teile in diesem Moment tun mit aus der Ansicht Teil als die größte Größe, so ändern tun, mit dem ich jemals das Eis aus dem Element andere ändern. Sehen wir uns jetzt die Einheiten in Prozent an. Dieser Typ von Einheit ist sehr ähnlich zu den Einheiten, die sich auf die Größe des Ansichtsteils beziehen, aber anstatt das Ansichtsteil als Referenz zu verwenden, verwendet es die Krankheit Eltern in diesem nächsten Beispiel wird klar sein. Dieses Verhalten, bei dem ich ein anderes Element f, das innerhalb des Inhalts enthalten wird. Dif und ich werden diesen gleichen Inhalt dif außerhalb des anderen für einen aus definieren. Der Fall ist das übergeordnete Element aus dem Inhalt ist das dif immer und für den anderen Inhalt dif außerhalb. Der andere Elementkörper sind die Eltern. Ich werde nun eine mit off 800 Pixel zu den anderen Elementen und die Eid aus 300 Pixel geben. In der Content-Klasse definiere ich eine mit dem Prozentsatz von 50%. Was passieren wird, ist, dass für den Fall der def-Inhalt innerhalb des anderen tun. Es wird 50% Rabatt auf die mit aus der anderen, die ein fester Wert ist. So wird es 400 Pixel für den Klasseninhalt sein, der unter dem anderen definiert ist. Die Breite wird in Bezug auf den Körper definiert, der den Tod verursacht. Rece izing das Fenster tun mit aus der Krankheit wird nicht fixiert werden, um die absoluten verliehenen Einheiten zu beenden , die fest und sehr leicht zu verstehen sind. Sie haben immer die gleiche Größe, unabhängig von anderen ausstehenden Einstellungen. Sie sind stark abhängig von der Ausgabe Grund, warum sie nicht für die Verwendung auf dem Bildschirm empfohlen werden, da Bildschirmgrößen sehr viel. Eines der am häufigsten verwendeten Pixel sind Pixel, die ich in vielen Beispielen verwendet habe, eine Einheit, die mit dem Anzeigegerät verwandt ist. Andere absolute Einheiten, die verfügbar sind wie Zoll, Zentimeter oder Millimeter. In den vorherigen Kapiteln habe ich Pixel als Einheiten verwendet, also werde ich diese Einheit jetzt zwei Zentimeter im Bruder ändern. Wir gehen weiter zu F-Elementen mit festen Größen, da ich eine absolute Einheit verwende. 37. Projekt Nr1 – Erstelle eine Webgalerie mit HTML und CSS: Lassen Sie uns jetzt eine erste Webseite erstellen, eine sehr einfache Webgalerie, in der Sie das, was Sie über verschiedene Seitenelemente und Stile mit CSS lernen können. Das endgültige Layout von den Seiten jetzt angezeigt, wo Sie jemals Getränke kaufen, sechs verschiedene Bilder und entsprechende Ebenen öffnen eine individuelle baj für das Bild, das Sie klicken. Lassen Sie uns also diese Seitenstruktur mit HTML erstellen und Stile auf die verschiedenen Elemente anwenden. Schritt für Schritt. Wie Sie im Patch sehen, ist diese Gruppe von Bildern horizontal zentral. Dies ist der erste wichtige Trick, den man anwenden kann. Erstellen Sie das erste Blockelement, dass, wenn Container, den ich zentrieren werde CSS Cove und wo die sechs Bilder aus der Galerie eingefügt werden. Nun, da ich den Container habe, ich ja, der zweite Tag mit Klassennamen Galerie, die jede von den sechs Bildern erhält. Also wiederhole ich sechs Mal dieses dif in meinem Ordner, wo ich HTML-Dokument habe ich F sechs Bilddateien Hündin, Stadtlandschaft, Nachtsilhouette und Unterwasser, dass ich das letzte später im Quellattribut innerhalb der Bildtechnologie. Aber bevor ich diese Bilder hinzufüge, fange ich an, den Stil für einige Seitenelemente zu erstellen. Zuerst die Hintergrundfarbe, um diese Eigenschaft im Patch zu ändern. Das Verfahren ist sehr einfach. Ich muss nur diesem Eigenschaftswert zuweisen, den ich als dunkles Schiefergrau definiere. Aber natürlich können Sie einen anderen Anrufer auswählen, den Sie mögen. Der nächste Schritt ist mein Container definiert, das wird sehr nützlich sein, um den Seiteninhalt in Verkleidung zu zentrieren. Die Bilder, die ich jetzt mit off 60% für diesen Container mit Boesch Hintergrund definiert habe, färben das Auge mit dem automatischen Wert, so dass ich den Inhalt nicht anpassen und den Steve zentrieren habe ich die Marscheigenschaft mit dem Wert Null auto verwendet und um zu beenden, um etwas Abstand zwischen oben auf der Seite und im Container. Ich verwende die Eigenschaft Rand oben mit dem Wert 60 Pixel. In diesem Moment kann ich das Abzeichen, meinen Container, nicht scheinen , da ich sagte, ich würde mit Auto-Wert Eigenschaft, ich weiß, dass ich einen festen Wert von 500 Pixel für diese Eigenschaft setzen, nur um zu sehen, dass Unzufriedenheit existiert und Osten Zentristen auf der Seite. Ich werde jetzt den Stil für hat Eve Gallery erstellen, wo auf jeder Zeile möchte ich diese einfügen die Bilder erhalten. Also tun mit off jeden Tag von muss weniger als 50% Rabatt auf den Container, da ich immer noch Margen erstellen möchte, um etwas Gewürz zwischen Dieben zu bekommen. Ich setze dann den Wert von 47% und für I Wert von 250 Pixel, um das Bild nebeneinander zu setzen . Ich verwende jetzt die Float-Eigenschaft mit dem linken Wert für das Würzen zwischen den Bildern. Ich habe einen Rand mit einem Wert von 1% erstellt und für eine größere vertikale Würze füge ich einen unteren Rand mit 30 Pixeln zum Abschluss ein. Ich habe die Rahmeneigenschaft der Deve Gallery mit dem Wert von einem Pixel, einer durchgehenden Linie und der besten Farbe zugewiesen . Ich habe jetzt meine sechs Hauptblöcke, die die sechs Bilder erhalten haben. Also lassen Sie uns auf Bilddateien in Jill Reid Eaves mit Bild-Stick, wo ich den Bildnamen mit Sauce definiert . Das Attribut. Ich kopierte die Schädel zu den anderen fünf gibt, und dann habe ich noch Dateinamen, beginnend mit Bild Hündin für die zweite Bildtechnologie. Ich habe die Bildlandschaft serviert Stadt für Bild kommt aus dem Dateisiegel mit, und die letzten beiden habe ich die Bilder, Nacht und Unterwasser Bildstile ist jetzt mein nächster Schritt, wo ich mit Eigenschaften mit Wert 100% auf das Bild zu tun belegen die gesamte Deve Gallery und die ICT auf 150 Pixel. auf das Auge des Deve reagiere, sind meine sechziger Jahre jetzt. Wir sollten uns besser darum kümmern, die richtigen Stile anzuwenden. Und jetzt, da ich meinen Hauptcontainer und Bilder habe, füge ich einen neuen Fernseher in der Div Gallery hinzu, zu dem ich den Klassennamen Beschreibung gebe, die ich verwendet habe, um eine Verleumdung für jeden von den Peters an diesem Tag zu erstellen , wird nach jedem der Bilder hinzugefügt Besetzung Ziel mit unten. Da es sich um einen Blockhelm, ich jetzt Coop, es ist dif zu den anderen fünf Bildern und rechten Befragten Texte Bitch Landschaft, Stadt Silhouette Nacht und schließlich, und das Wasser. Ich erstelle jetzt Stil für die Beschreibung. Def. Verwenden Sie die Eigenschaft, texten Sie die Zeile mit dem Mittelwert, um Texte in die Mitte zu landen und meinem Text ein anderes Format zu geben . Ich habe drei verschiedene Eigenschaften, die Telefonfamilie, wo ich den Text mit dem Fonds Karriere Frontgewicht mit dem wertvollen definieren und schließlich den Anrufer weiß auf den Text anwenden, mit der Farbe Eigenschaft mehr geben kontrastiert zwischen der Hintergrundfarbe und dem Text. Der letzte Schritt in dieser Webgalerie besteht darin, einen Link in jedem der Fotos zu erstellen, um eine neue einzelne Seite zu öffnen , die das entsprechende Bild enthält. Um dieses April Inc. zu erstellen , muss ich den anklickbaren Inhalt in jede Perle innerhalb der ATEC setzen, die das Bild statisch und die Beschreibung Deve S Attribute aus der Technik enthalten wird . Ich benutzte das Ziel mit dem leeren Wert, der das Längendokument im neuen Fenster oder Tab öffnet , und die Attribute, einen Entwurf, der das u. R L aus dem baj angibt . Dieser Link verbirgt sich, eine Bilddatei, die ich öffnen möchte und kein HTML-Dokument. Ich werde nun dieselben Codes auf die verbleibenden Bilder kopieren immer zu Dateikalken von den Bildern wechseln, um die richtigen Dateien zu öffnen. Wenn ich auf den Link klicke. Jetzt, da ich die ganze Seite habe, lüfte ich einfach den Titel oben erstelle eine Straße ive mit Klassennamen Titel, der außerhalb des Containers ist, wo ich den Text Web Gallery Text schreibe , der auf der linken Seite der Seite erscheint, und jetzt erstelle ich den Stil für diese Klasse, indem ich den Text mit der Eigenschaft, Text, ausrichten, Spaß Familie, Verdana und Farbe durch den Ausgang Dezimalkalte definiert, die ich jetzt für die Telefongröße verwende einen Wert von 20 Personen und etwas Gewürz zwischen dem Text und dem oberen Rand der Seite zu haben. Ich habe die Marge Toe-Eigenschaft mit dem Wert 40 Pixel verwendet. Nun einige letzte Gedanken über CSS-Code, der in dieser Webseite verwendet wurde. Zunächst wird die marginale Eigenschaft mit dem Wert Null definiert, um die oberen und unteren Ränder mit dem Wert Null und Wert Auto Details Browser Um automatisch den linken und rechten Rand selbst zu berechnen , was es durch sie gleichermaßen festlegen. Was macht, dass der Container zentral oder ärgerlich bleibt? Ein weiteres wichtiges Detail ist die Verwendung off float Eigenschaft mit dem Wert links, der Fotos nebeneinander sein kann, und schließlich die Verwendung von Einheiten in Prozent. Das gibt eine große Flexibilität, um die Größe von den verschiedenen Elementen außerhalb der Seite zu verwalten. Für den Fall des Containers setze ich zunächst einen Wert von 60% ein, so dass dieses Element 60% von dem Unkraut einnimmt, das mit seinem Elternteil, dem Körper,verbunden Elternteil, dem Körper, ist. Wenn ich das Tal auf 80% umwandle. Wir sehen, dass der Weizen aus dem Behälter wird zunehmen, auch die Woche aus den Taten, die jeweils von den Bildern erhalten, da diese gut besetzen 47% aus dem Weizen definiert für den Behälter. Diese Art von Einheiten ermöglicht es auch, die Anzahl der Bilder zu verwalten, die in jeder Zeile angezeigt wird, die im Moment definiert wird, weil ich einen 47% Wert verwende, was Schulden verursacht. Zwei Bilder, zusammen mit den definierten Rändern und Rändern, besetzen etwa 100% aus dem Container Weizen, was zu diesem behaupteten Bild führt. Gehen Sie zur zweiten Zeile. Wenn ich drei Bilder pro Zeile möchte, muss ich die Woche von der Div Gallery toe absetzen, ein Wert etwas weniger als 33% für jeden ausgeschaltet. Die zu besetzenden Bilder kühlt auf ein Cert vom Behälter ab. Ich werde dann einen Wert von 31% geben, da wir Margen und Grenzen nicht ignorieren können und wir sehen, dass jede Zeile wird dann nach drei Bildern, das ist alles. Für jetzt. Danke fürs Anschauen 38. Projekt Nr2 – Webpage: I Der Vorschlag Diese Waffen wird erstellt Benutzerregistrierungsformular ähnlich dem, das jetzt präsentiert Eingabefelder enthält, nämlich der Name, E Meile, Geschlecht und schließlich, Benutzername und Passwort. Da diese Informationen durch eine Registrierungsschaltfläche am unteren Rand der Seite eingereicht werden, werde ich mit der Erstellung der verschiedenen Elemente der Seite mit dem HTML-Code beginnen, alle Elemente der Farm werden innerhalb der Deve mit Klassennamen Container platziert , um dif und alle Formularelemente auf der Seite zentrieren zu können. Also, bevor ich das Formular erstelle, m diff Container, der oben das Textregister enthielt, das in einem hinzufügenden Tag eingefügt wurde. Als nächstes habe ich eine H R Tech, die in bestimmten horizontalen Linien verwendet, um die verschiedenen Arten von Inhalten zu trennen , nämlich meine Berechtigung und Form mit entsprechenden Elementen. Jetzt starte ich mein Formular mit der Formulartechnologie, die die Farm definiert, die verwendet wird, um Benutzereingaben zu erhalten. Dieses Element empfängt Aktionsattribute, die uns mitteilen, wo Formulardaten gesendet werden sollen, wenn Daten für diese Seite übermittelt werden. Dieses Attribut ist nicht sehr wichtig, weil die Übungen auf Lee beabsichtigt, eine formell aus und nicht aus, um die Daten aus dem Formular zu erhalten. Ich werde dann nur einen Demi-Dateinamen in die Aktion bei Root einfügen. Das erste, was Put-Feld wird nun hinzugefügt, um den Namen zu platzieren. Also habe ich das Level-Tag für das erste Eingabeelement verwendet, um mit dem I D übereinzustimmen. Aus der Eingabe, die sie für die Verkleidung Namenswert in vier am Stamm- und Textnamen zwischen offener und schließender Technologie mit Fettformat verwenden , um zusammen mit Eingabefeld zu erscheinen, das den Namen. Der nächste Schritt besteht darin, das Eingabeelement mithilfe von Typtexten zu definieren. Schulden erhält den Platz. Ältere Attribute. Wir würden Namenstext schätzen, der innerhalb des Eingabefeldes erscheint als Shar Tönung arbeitet, die den erwarteten Wert beschreibt. Und schließlich die Attribute I d. Mit Namenswert gleich dem Wert, der in vier Attribute aus dem Label verwendet wird. Tech zwei verwandte Label mit dem jeweiligen Eingabeelement. Wie ich bereits sagte, so wird erwartet, dass, wenn ich in mein Label klicke, es springt auf das jeweilige Eingabefeld. Wie Sie jetzt individuell sehen können. Um dieses erste Eingabeelement zu beenden, das ich bei der verwendeten Route benötigt habe, entscheide das Element Best Byfield aus, bevor du die Farm für diesen Kerl einreichst. Eine Warnmeldung wird angezeigt, wenn das Element jetzt nicht Feld ist, das zweite Eingabeelement, das Informationen von der Mail empfängt, eine Erkältung hat, die dem zuvor erstellten sehr ähnlich ist. Ich habe den gleichen Kult nicht kopiert, der sich im Level-Tack ändert der Wert aus den Fort-Attributen auch für E-Mail. Die entsprechenden Texte in der Elementeingabe, die ich nun im Typ erhalte , geben den männlichen Wert zu, um diesen Eingabewert als E-Mail-Adressformat zu gewährleisten. Ältere, Ich schreibe E-Mail, Adresse, Text und schließlich die de E-Mail und das erforderliche Attribut, wie im vorherigen Feld. Wenn Sie auf die Ebene klicken, wird das weibliche Feld aktiv und Eingabe von Text ohne das at Symbol im Mail-Feld. Es wird vermutet, eine Warnung zu bekommen, dass Todes-E-Mail-Adresse diese Single braucht, aber wir werden die Situation am Ende sehen. Bevor ich zum nächsten Schritt überging, musste ich Zeilenumbruch-Tags, um Gewürze zwischen den verschiedenen Elementen der Farm zu geben. Für die nächsten Eingabefelder habe ich Benutzergeschlecht mit männlichem oder weiblichem Wert definiert, wobei das Typradio für dieses Eingabefeld verwendet wird, das ein Optionsfeld definiert, um eins aus den beiden Optionen auszuwählen . Zuerst habe ich mein Label mit den Geschlechtertexten erstellt, um die Art der Informationen zu identifizieren, die ich vom Benutzer möchte . Nun, für die erste Option, habe ich den Radiotyp mit dem Namen Geschlecht I D. Male verwendet und schließlich erforderliche Attribute wie in den vorherigen Eingängen für die Level-Tech für bei Your Roots, mit dem gleichen Namen gegeben, um die I. D. Tooling diese beiden Elemente Beschriftung und Optionsfeld für, wenn ich auf Ebene klicke, wird das Optionsfeld für das zweite Optionsfeld aktiv. Ich sagte es wieder mit dem Geschlechtsnamen, so dass die beiden Optionsfelder mit dem gleichen Namen, so dass wir die beiden Optionsfelder zusammen kombinieren und den gewählten Wert erhalten können . Aber das ist ein Teil außerhalb der serverseitigen Programmierung. Schließlich haben wir die weibliche I D. Und für das Etikett erstellen wir vor Attribut mit dem Wert gleich dem I D. So setzen diese Werte klicken. Einer der Ebenen wird das Gefühl, dass die jeweilige Wahl Meile weiblich sind. In den letzten Straßeneingabefeldern erhielt ich den Benutzernamen und die Passwortdefinition, die im linken Feld bestätigt werden muss . Ich habe keine Kopie von der Kälte gemacht, die bereits verwendet wurde, um zu den ersten Jungs wechseln zu müssen. Das Attribut. Weit entfernt von der Verleumdung Tech auf den Wert Benutzer und Schreiben von Text. Benutzername, der auf Ebene verwendet werden soll. Indianer setzen Steak. Ich habe den Typtext mit den Benutzernamentexten an der Stelle, die älter i d. Wir würden den Benutzer und schließlich das erforderliche Attribut schätzen, um dieses Feld benötigt zu machen. Jetzt die besten Wörter für das erste Eingabefeld, in dem das Passwort gesetzt wird. Ich verwende den besten Wert zu weit Attribute und Text beste Wörter, um als Label in der Farm im Eingabetag zu erscheinen . Ich verwende das Passwort eingeben, damit die Zeichen nicht sichtbar sind. Der Platz älter an Wurzeln diesmal f die Eingabe Passworttexte Wert, während die I D als der beste Wert ähnlich wie für eine Hommage, um das beste Wort zu beenden. Wiederholen Sie Felder, die der Wert am besten in der Ferne nach der Route wiederholt und die Beschriftungstexte besten Wörter wiederholen. Geben Sie Attitude erinnert Passwörter, während der Ort älter den Text wiederholt Passwort enthält, um die I D als der Wert am besten wiederholen Sie jetzt Formular am unteren Ende zu beenden, Ich setze eine Senden-Schaltfläche mit Knopf-Tag mit Typ, Senden Sie Endklassenausschläge, die verwendet, um Stil für dieses Element zu definieren. Ich weiß, ob alle Formelemente und es ist auf Lee notwendig, den Stil für jeden zu definieren. Beginnend mit Körper, das ist ich mit Ariel Fonds Familie definieren und eine stolze würde Hintergrundfarbe jetzt Container anwenden , der innerhalb Formularelemente hat. Ich definierte Witz mit dem Wert off 50% bezogen auf die Breite aus dem Körper und Centre de Steve , wobei die marschierende Eigenschaft mit Werten Null und äußeren, die gleiche Werte am linken und rechten Rand geben . Zwei F etwas Abstand zwischen den Elementen und jeder Seite des Behälters. Ich habe die Streicheleigenschaft mit einem Wert von 20 Pixeln verwendet und schließlich Weiß als Container definiert . Hintergrundfarbfinanzierung setzen Elemente, nämlich mit Typ, Text, beste Wort und E-Mail. Ich erstelle die spezifischen Formate, die nicht auf die Optionsfelder angewendet werden, weshalb ich den Typ von Eingabeelementen deklarieren muss, die geändert werden. In dieser Situation definiere ich Eingaben mit Typ-Dext-Eingaben, Passwörter und Eingabetyp-E-Mail in meinem CSS-Selektor ein, getrennt durch Kommas, um eine großartige Methode zu wählen. Ali spezifische Attributwerte. Ich kann jetzt den Stil für diese Elemente mit dem Weizen von 95% Bettzeug 15% und Stop- und Unterrand mit 15 Pixeln und 25 Pixeln s Hintergrundfarbe für das Eingabeelement definieren . Ich benutzte die Farbe hellgrau und für die Tauscheigenschaft verwende ich über ihren Weizen von einem Pixel. Wir würden durchgezogene Linie und Anrufer durch die Ausfahrt Dezimalzahl BBB dargestellt zu beenden. Ich benutze die Eigenschaft Tauschfunkgeräte, die eine abgerundete Ecken machen können. Indian Put-Element mit einem Wert von drei Pixeln, die Eiger Devalue Doumar, eine gerundete Eingabefelder wird als nächstes sein. Ich habe Stil für die Klassenschaltfläche definiert, um das Layout vom Submit-Button zu ändern, was den Schulden einen Witz von 20% große runde Farbe grüne weiße Farbe verleiht, endet 15 Pixel, um das horizontale Regelelement zu beenden, das verwendet wird, um das Titel und Form, die ich mit dem unteren Rand mit 20 Pixeln definiert habe, um etwas Gewürz zwischen dieser Zeile und dem ersten Farmelement hinzuzufügen , ich weiß, dass wir die endgültigen Layouts nur notwendig sind, um einige Tests zu machen, um einige Details zu erinnern , die ich zuvor gesprochen, beginnend mit einem Klick auf die Ebenen der einzelnen Eingabefelder, so dass der Benutzer Zugriff auf das entsprechende Textfeld, Onley muss den entsprechenden Text im Falle von Daten zu Feld schreiben. Wir sehen die Warnmeldung, die uns sagt, dass Felder militärisch sind. Eine Nachrichtenschuld war nur möglich, weil wir das erforderliche Attribut verwendet haben. Ein weiteres Detail, das ich bereits erwähnt habe, ist die Verwendung des männlichen Typs im zweiten Eingabefeld, das ihm in den Feuertexten mit den Mailformaten sehr nützlich sein wird, nämlich die bei Zeichensituation sichtbar enthalten zu müssen. Jetzt, wo ich eine E-Mail-Adresse schreibe, ohne dass dieses Zeichen eine Fehlerwarnung erhält, um das Passwort aufzuwickeln . Informationen, die nicht auf die Verwendung von Typkennwörtern zurückzuführen sind, die im Eingabeelement verwendet wird . Danke fürs Zuschauen. 39. Congratulations: Hallo schon wieder. Und herzlichen Glückwunsch. Sie Durchschnitt bis zum Ende der Diskussion. Und jetzt sind Sie in der Lage, HTML zu verwenden, um einige der wichtigsten Inhalte in einer Website verwendet , die Sie Gento höher machen. Ich hoffe, es gefällt dir. Sehen Sie? Ging die nächste Klasse.