Willkommen zurück.
Lassen Sie uns mit dem Aufbau der Homepage fortfahren.
Und wie Sie sehen können, bin ich wieder auf das traditionelle Hintergrundbild gewechselt
.
Aber wie gesagt, wenn du das Video benutzen willst
, ist das in Ordnung.
Der nächste Abschnitt, den wir erstellen werden
der Abschnitt mit zwei Spalten, der links einige
Texte enthält, ein Bild auf der rechten Seite.
Und dann ist der dritte Abschnitt hier sehr, sehr ähnlich.
Es sind nur die Spalten umgekehrt.
Im dritten Abschnitt haben wir das Bild auf der linken Seite
und dann den Text rechts.
Wie genau werden wir das erreichen?
Das ist sehr, sehr, sehr einfach.
Wir gehen auf eine Homepage.
Lasst uns bearbeiten.
Und Sie können jetzt sehen, dass es
im Grunde zwei Spalten sind, 5050.
So einfach werden wir hierher kommen
einen neuen Abschnitt mit zwei Spalten erstellen, 5050.
Ich bearbeite den Abschnitt und stelle sicher,
dass er in voller Breite ist.
Und dann werden die Spalten GAAP keine Lücke sagen.
Alles klar, also der erste Abschnitt hier drin
wird ein paar Texte enthalten.
Lassen Sie mich den Texteditor hier einzeichnen.
Lambda kopiert den Lorem Ipsum Dummy-Text
den ich hier habe.
Lass mich einfach weitermachen und das einfügen.
Und dann haben wir auch den Header.
Lassen Sie mich das fallen, indem ich mich traue. Es ist ein H2.
Hier.
Ich habe eigentlich keinen tatsächlichen Header erstellt
, keinen echten Titel.
Also lass mich einfach eintippen.
Wir würden gerne reisen.
Einfach irgendwas. Das war's.
Und dann fügen wir für die zweite Spalte hier
das Bild hinzu und ich füge dieses Bild hinzu,
das ich in Istanbul aufgenommen habe.
Dies war eine Gruppe unserer College-Studenten.
Ich bin herumgelaufen und sagte: Hey,
möchtest du, dass ich ein Foto von dieser Idee mache?
Also habe ich das Foto gemacht.
Stellen Sie also sicher, dass Sie dieses Bild zum Narren setzen.
Denn auch hier möchten wir, dass das Bild die volle Breite und Höhe seiner Spalte belegt
.
Aber dann müssen wir auch den Button Mehr erfahren hinzufügen.
Was ich natürlich machen werde, ist,
hier wieder rein zu gehen, den Button zu ziehen,
ihn hier reinzulegen.
Und dann sage ich lerne, lerne mehr.
Dann kann dieser Link vielleicht zur About-Seite gehen.
Also sage ich einfach Vorwärtsschrägstrich über.
Und da ist es.
Ich werde mich an der Mitte ausrichten.
Nehmen wir ein paar Änderungen vor.
Typografie im Stil.
Ich sage „ Transformation in Großbuchstaben“.
Die Erklärung über nicht innerhalb was für eine Integration.
Und dann die Textfarbe.
Ich schalte das auf Schwarz um.
Nun, für den eigentlichen Button selbst wird
eine Hintergrundfarbe von Weiß verwendet.
Hintergrundeingabe wird hier Farbe Weiß sein.
Aber dann setzen wir einen festen Rand
, damit wir den Knopf tatsächlich sehen können.
Und wenn du willst, könntest du
auch ein paar Grenzvideos hinzufügen.
Aber das werde ich nicht machen.
Eine letzte Sache, die zu tun ist , wäre
, unseren Inhalt in der Mitte auszurichten.
Also klicke ich auf die Schaltfläche Spalte bearbeiten, Kommentare,
Vertikal ausrichten, setzt Mitte.
Und dann ist noch eine Sache, die wir
tun, um links und rechts etwas Platz zu haben
, dagegen ist der Text nicht
genau am Rand der Spalte,
also müssen wir etwas Abstand hinzufügen.
Also gehe ich wieder hier rein.
Was wir tun werden, ist sehr, sehr einfach,
dass wir für dieselbe Kolumne weiterentwickelt
werden. Genau hier.
Wir werden die Verknüpfung der Werte für das Muster aufheben.
Und dann gebe ich links 50 Pixel
mal 50 Pixel.
Und da ist es.
Wir haben unseren zweiten Abschnitt sehr einfach aufgebaut,
da der dritte Abschnitt im Design sehr, sehr ähnlich ist
im Design sehr, sehr ähnlich
Wir können einfach mit der rechten Maustaste auf
das Editierabschnitt-Protein klicken und dann duplizieren.
Und jetzt ziehe ich diese
erste Spalte hier rein, ziehe sie ganz hierher,
ziehe sie ganz hierher, wechsle die Spalten.
Und jetzt ganz einfach,
lasst uns dieses Bild bearbeiten.
Ich werde mich für dieses entscheiden , das ich in Argentinien aufgenommen habe.
Halterung passt in L, Farbe fettig.
Und dann habe ich natürlich für die Texte hier drin alles hinzugefügt,
was an die besten Orte als Header gereist
ist ist, okay, also lass mich einfach den
Header hier wechseln und sagen ,
zu den besten Orten zu reisen.
Da gehst du. Alles klar, lass uns jetzt Updates machen.
Sagen wir, wie die Seite aussieht.
Komm schon, lass uns gehen.
Ertrage es mit mir. Leider sind dies
die beruflichen Gefahren eines Lehrers, eines Lehrers.
Manchmal fängt Ihr Vorfall
an zu vermasseln und schließlich wird er aktualisiert.
Okay, danke. Jetzt sehen wir uns die Seite an.
Scrollen wir nach unten und da ist es.
Okay, eine Sache noch.
Genau als Bonus
könnten wir einige Animationen hinzufügen
, damit die Bilder diese Folie von links und rechts mögen
.
Was wir also tun können, ist einfach zurückzugehen
und diese Allegorie für das erste Bild zu überprüfen,
das mit den Schülern hier drin,
ich werde das Bild bearbeiten.
Gehe zu Advanced Lighter,
du hast Bewegungseffekte.
Ich sage „ Eintrittsanimation“.
Lasst uns von den Lichtern reinrutschen.
Okay, also leicht von rechts rein,
also von rechts schneiden.
Und dann war für dieses Bild einfach das
entgegengesetzte Einschieben von links.
Bewegungseffekte.
Verlangsamt, informiert oder geliebt.
Okay, das war irgendwie komisch.
Ich bin mir nicht sicher, was genau sie gemacht haben.
Lass mich das einfach nochmal machen.
Okay.
Aus irgendeinem Grund wird das Bildfenster
zur zweiten Spalte übergehen.
Ich weiß nicht warum das passiert ist,
aber in Ordnung, ich werde einfach weitermachen und updaten.
Da sind wir los.
Sehen wir uns die Seite an. Scrollen wir nach unten.
Es macht Gleiten von links,
irregeführt und erfreut, und da ist es.
Und einfach so beginnt unsere Homepage
in Kraft zu treten.
Begleiten Sie mich also im nächsten Video, in dem wir uns jetzt
ansehen werden, wie wir den
nächsten Abschnitt aufbauen werden,
der das einzigartige Reise-Design wäre.