>> DOUG LLOYD: Tak spędziliśmy about-- czy moja matematyka jest w porządku,
i myślę, że patrząc back-- myślę spędziliśmy około 35 filmów rozmowy
o różnych aspektach C, może trochę więcej, może trochę mniej.
I nie obejmuje wszystko w C, ale
pokryte duży kawał język, ogromna większość z nich,
Z pewnością dla wspólnych celów.
Teraz będziemy rozmawiać o inny język HTML.
I jedziemy na pokrycie to tylko w jednym filmie.
>> Ale, że będzie OK.
To będzie rzeczywiście stać coś, co masz zamiar się przyzwyczaić.
Teraz, że masz Podstawy jednego języka,
to faktycznie całkiem proste aby rozpocząć naukę innych.
Tak więc mamy zamiar zacząć do kroku trochę powrotem
i połysk przez podstawowy Różnice między tymi językami
i rodzaju zostawiają cię do niego.
Jest wiele naprawdę świetnie zasobów w Internecie, które
mamy zamiar rozpocząć kierowanie kierunku, ponieważ internet jest
ogromna repozytorium informacji.
A więc to nie jest ci jak będziesz być tracąc koniecznie
nie mając informacje pokryte w wideo.
Nadal będziesz w stanie uzyskać wszystko czego potrzebujesz i wykorzystanie
wiedza już mam zbudowany przez zrozumienie C
do krzywej uczenia się dla nich inne języki rzeczywiście dużo bardziej płaskie.
Obiecuję.
>> Ale pomówmy o jednym języku to naprawdę podstawowe dla każdej sieci
Strona, która jest HTML.
HTML jest Hyper Text Markup Language.
HTML jest językiem, ale jest nie język programowania.
>> HTML nie mają zmienne.
To nie ma logiki lub funkcje lub coś w tym stylu.
Nie możemy tego zrobić jakakolwiek programowania per se w HTML.
Czasami można usłyszeć ludzie opisują siebie
jako programistów HTML, które nie jest do końca prawdziwe.
Nie możemy pisać programy w formacie HTML.
>> HTML jest tylko używany do zaznaczania tekstu.
To się nazywa język znaczników.
A co to does-- ten markup-- możemy używać znaczników w HTML i tych tags--
to markup-- semantycznie definiuje strukturę strony
i powoduje, że zwykły tekst, który istnieje między znaczniki należy interpretować
przez przeglądarki w różny sposób.
A może najlepiej wyjaśnić to w drodze ilustracji.
>> Oto bardzo prosta strona HTML, nie program HTML, znowu, strona HTML.
I wiemy, że jest to Strona HTML, ponieważ mamy
ograniczony wszystko z tagów HTML.
Więc to jest to, co znacznik HTML wygląda.
To w nawiasach kątowych.
I zauważyć, na górze mamy HTML i na samym dole,
po zrobiliśmy to, co jest podobno wiele innych HTML,
mamy kąt wspornika slash HTML.
Więc tego rodzaju jest granica pomiędzy tym, co to jest HTML, a co nie.
I oczywiście, tradycyjnie, po prostu jak napisał wszystkie swoje programy w C
z rozszerzeniami kropka C, wszystkie pliki HTML
zakończy dot rozszerzeniach HTML.
Ale to nie wszystko tu dzieje.
Nie tylko mają tych tagów HTML.
Mamy najwyraźniej mają to coś o nazwie tag głowy.
No, OK, co to jest?
>> No cóż, może najlepiej odróżnić drodze ciele
Ciało jest treść strony internetowej.
Więc może tag głowy określa rzeczy nie jest w okna przeglądarki właściwego,
ale jest w jakiś sposób ważne dla naszych strona internetowa są wyświetlane poprawnie.
Na przykład, wewnątrz z tag głowy mamy title.
>> Tak więc tytuł jest hello world, że rzeczywiście będzie co
pojawia się na karcie w Chrome lub safari lub Firefox--
niezależnie od używanej przeglądarki prefer-- to co się dzieje, aby pokazać się w tytule.
I zanim kart to pokazać w oknie przeglądarki
i można mieć tylko jedną stronę otworzyć w oknie przeglądarki na raz.
Tak, że zamierza być Tytuł mojego stronę w górę w zakładce
lub paska okno przeglądarki, hello world.
A następnie treść mojego Strona internetowa będzie świat, witam.
Warto więc spojrzeć na to, co niektórzy rzecz, jak to może wyglądać.
Jest to dość proste strony HTML.
Więc jestem tutaj, w moim CS50 IDE i Mam powiększony trochę.
A ja po prostu się otworzyć cześć dot HTML
i pokazać, że jest to dość dużo zawartość strony, które widzieliśmy wcześniej.
Moje proste tagi HTML, głowa, title, ciała, i tak dalej.
Mam wcięty być czyste.
>> A potem, co mogę zrobić w moim IDE jest tylko podgląd strony.
A tam idziemy.
Zawartość mojej stronie jest świat, witam, a ja nic nie widzę
z tagami tam głowy.
To tylko treść ciała.
Świat, cześć.
I znowu organizm po prostu powiedział, świat, witam.
Druga część brakuje.
>> Więc tak naprawdę wszystko jest.
Jest to bardzo proste, podstawowe strona HTML.
Teraz już wcięty mój HTML być naprawdę ładne i zorganizowane,
ale w rzeczywistości nie muszą.
Mógłbym zrobić to wyglądać dość brzydki.
A to wciąż działa.
To będzie dokładnie to samo strona.
Właśnie pozbyć wszystkie z białej przestrzeni.
>> Jak się okazuje, biała przestrzeń dane.
I tak, gdy mamy do przesyłania danych z nadawcy do odbiorcy, z serwera
do klienta, danych kosztuje.
A więc pozbycie się białych znaków jest rzeczywiście dobry pomysł
jeśli masz kogoś, kto służy się wiele stron internetowych.
To zły pomysł, jeśli jesteś Ktoś, kto jest nauka tych rzeczy
i chcesz mieć to dobrze zorganizowane.
Jest to o wiele łatwiejsze do analizowania niż to.
Ale to jest funkcjonalnie identyczne.
>> Wcięcie i takie tam w rzeczywistości nie ma znaczenia w HTML.
Liczy się otwarcia tagi i zamykania znaczników w odpowiedniej kolejności.
Zauważ, co tu się stało, choć.
Znaczniki daje nam drogę do komunikowania dodatkowych informacji
o tym, co napisałeś.
Część Hello, World było interpretować jako tytuł.
A świat, witam część była interpretowane jako treść
lub co powinno być widoczne na mojej stronie internetowej.
>> Istnieje ponad 100 z nich różni się tagi i wiele wspaniałych zasobów
online, aby je znaleźć.
Mamy zamiar mówić o kilka z nich, w tym wideo, niektórzy
z bardzo podstawowej rzeczy.
Ale nie będziemy mówić o tym wszystkim dlatego, że
będzie wyczerpująca, aby to zrobić.
>> Inną rzeczą, jaką możesz zrobić, chociaż, jest otwarcie narzędzia programistyczne.
A jeśli pamiętacie z nasz film na HTTP,
I wyjaśnił, jak otworzyć do narzędzi programistycznych.
W Chrome to zwykle klawisz F12 aby otworzyć pasek narzędzi dla programistów.
Wtedy zamiast wybierać Sieci kartę, możesz wybrać kartę Elements.
A jeśli włożysz do sieci Strona, będziesz naprawdę
zobacz HTML, który tworzy tę stronę internetową.
I tak można dowiedzieć się wiele o HTML patrząc na swoje ulubione strony internetowe
i zobaczyć, w jaki sposób zbudować różne kawałki nich, które lubisz.
Więc może jest to fajne wzór czy coś takiego.
Jak oni to robią, z HTML?
Cóż można po prostu otworzyć swój dewelopera narzędzia i unoszą się nad tym elementem
i zobaczyć dokładnie to, co sprawia, że ​​HTML.
Więc to jest naprawdę Dobrym sposobem, aby nauczyć się języka HTML,
i gorąco polecam, że robisz to zarówno do nauki HTML
a także dowiedzieć się nieco nieco o niektórych opcji
dostępne w narzędzia programistyczne, które
na pewno się przyda, jak zaczniesz robić bardziej intensywne internecie
programowania.
>> Warto więc spojrzeć na Kilka wspólnych znaczników HTML.
I będziemy skakać i spojrzeć na co te znaczniki będą również renderowanie
a patrząc na niektórych plików w moim IDE.
Więc tutaj są trzy bardzo podstawowe znaczniki dla dostosowując wygląd tekstu.
Jest tagi B, I oraz tagi tagi U.
I odpowiednio, co robią jest renderowania tekstu między nimi pogrubiony,
kursywa i podkreślenie.
Zobaczmy więc, co to będzie wyglądać jak na rzeczywistej stronie internetowej w moim IDE.
>> Więc w moim IDE Mam plik o nazwie BIU dot HTML.
BIU dot HTML po prostu pogrubienie, kursywa, podkreślenie.
Będę go otworzyć.
>> I zobaczymy, że ja tu mają ten tekst jest tagów B pogrubione.
Ten tekst jest tagów I kursywa.
A ten tekst jest podkreślony U tagi.
Co jest tego będzie wyglądać?
Cóż znowu, wszystko co mam zrobić, to udać się tutaj
do mojej przeglądarce, moja przeglądarka plików, kliknij Podgląd, a to co z tego wyjdzie.
>> Tekst pomiędzy B tagi rzeczywiście jest teraz pogrubiony.
Tekst pomiędzy I tagi rzeczywiście jest teraz kursywa.
A tekst pomiędzy U tagi rzeczywiście teraz podkreślone.
Więc to jest całkiem dobry.
Teraz wiemy, jak zrobić tekst wyglądają trochę więcej fantazji
lub remis nacisk na pewne rzeczy.
Inna para wspólnych tagów tutaj znaczniki akapitu, znaczniki P i nagłówka,
które tutaj mam renderowane jako HX.
>> Te znaczniki P, te znaczniki akapitu, złamać tekst aż do ust.
Nie wystarczy po prostu naciśnij Enter i pozostawić przestrzeń,
ponieważ komputer będzie się tylko do tego, co można powiedzieć to zrobić
i ignoruje białe Przestrzeń dla większości.
Więc nie możemy po prostu wciskamy Enter i oczekiwać nasz komputer
do interpretacji, że chcemy aby rozpocząć nowy akapit.
Musimy bardzo wyraźnie powiedzieć, że to jest jednym paragraph-- to another--
załączając każdy w zestaw znaczników P.
>> I mamy także te opcje znaczniki H, tych tagów nagłówka.
Mamy sześć różnych poziomów nagłówków, jeden, dwa, trzy,
cztery, pięć, sześć, które są coraz większe i większe
nagłówki.
I coraz mniejsze i mniejsze i mniejsze.
Mamy więc nagłówek najwyższego poziomu, drugi nagłówek poziom, i tak dalej, i tak dalej.
>> Rzućmy okiem na być może niektóre Tagi P i niektóre znaczniki nagłówka
w akcji na stronie internetowej.
Więc w moim IDE Mam plik o nazwie PH dot HTML, PH są paragrafy
i tagi nagłówka.
Otwórz, że się.
Jest dużo się tu dzieje bo już umieścić kilka Lorem
ipsum, niektórzy po prostu losowo tekst tutaj.
Więc będę pomniejszyć trochę ponieważ jest tak wiele się dzieje.
Ale zauważ, że mam na samym top tutaj mam H1, jeden poziom,
tag nagłówka.
Wtedy mam paragraf, który jest po prostu kilka losowych text-- Lorem ipsum--
tylko domyślne standardowe wypełnienie w tekście.
Więc mam dwa akapity wewnątrz, że Poziom jeden nagłówek, a następnie na dole I
mają poziom nagłówka tu na dwóch linii 24, nagłówek poziom drugi, a dwie
ust.
Cóż, co to wygląda gdybym go zobaczyć w moim podglądu?
Zobaczmy.
>> Tak więc zauważyć, że nagłówek pierwszego poziomu tutaj
jest całkiem nieco większy niż w nagłówku drugiego poziomu.
Więc użyliśmy znaczniki H1.
I zauważyć, że tagi P pozwala nam złamać rzeczy w ust.
Gdybyśmy pozbyć tych znaczników P i faktycznie wystarczy umieścić wejście i Zwroty
w między tym, co mieliśmy nadzieję, że być różne ustępy,
wszyscy oni po prostu zatrzasnąć ze sobą i nie miałoby to piękny punkt
oddzielenie przestrzeni powyżej i poniżej.
A więc to, co pkt tagi i tagi nagłówka
są powszechnie używane do zrobić, aby zwrócić dbałość o części naszej strony internetowej
w taki sposób.
>> Następna w kolejce jest kilka znaczników, których używamy budowanie list na naszej stronie internetowej.
Mamy więc nieuporządkowane lists-- ULs-- które są po prostu
listy punktowane, zamówione Lista które są numbered--
OLs-- i wewnątrz albo jeden z tych, musimy mieć
zestawy jak wskazują elementy listy, li.
I tak mamy otwarte tag UL i umieścić elementy wewnątrz niego.
A potem, kiedy skończymy z że możemy zamknąć znacznik ul.
>> Podobnie możemy mieć lista ma charakter zamówić lub numerowane
i umieścić wewnątrz elementów listy, które.
Warto więc spojrzeć na kilka list
i co będzie czyni tak na CS50 IDE.
Więc mam w moim IDE a plik o nazwie list dot HTML.
Spójrzmy.
>> I tu mam zawiadomienie nieuporządkowana listy z pięciu rzeczy w nim.
A potem mam listę uporządkowaną i Zmieniłem tagu trochę,
dobrze?
Powiedziałem początek równa się sześć.
Okazuje się, z uporządkowanym wykazie I Można ustawić punkt początkowy w miarę
I want-- domyślnie będzie to jedno- wystarczy dodać ten tzw atrybut
do mojego tagu OL.
I tak lista ta będzie rozpocznie odliczanie od sześciu.
Więc elementy tej numerowanej listy Należy mieć sześć, siedem, osiem, dziewięć, dziesięć,
ponieważ istnieje pięć elementów liście, a nie jednego,
dwa, trzy, cztery, pięć, które Byłoby tak, gdybym powiedział OL
bez określania atrybutu start.
>> Więc po prostu obejrzeć to tak można zorientować się, o co tu chodzi.
A tam idziemy.
Jest moja lista.
Pierwsze pięć elementów nieuporządkowane lub listy punktowane.
I kolejne pięć elementów są oddzielne listy zamawiać
począwszy od szóstej.
Tak to jest jak się da budowanie list za pomocą HTML.
Inną rzeczą, którą może chce zrobić z HTML
jest zbudować tabelę dane z wierszy i kolumn
przedstawienie informacji w sposób szczególnie zorganizowany sposób.
Aby to zrobić z HTML możemy mieć definicji tabeli począwszy otwarty nawias kwadratowy
stół.
I wtedy wewnątrz tej tabeli możemy Może mieć zestaw wierszy, tagi TR
wskazać każdym wierszu.
A potem tagi TD go wewnątrz tagów TR określać kolumnę w rzędzie.
>> Dlaczego nazywa TD i nie TC?
Cóż, TD oznacza danych tabeli.
Zazwyczaj jesteś wprowadzenie Twoje informacje nie.
To dlatego, że to TD i nie TC.
To trochę mylące.
>> Więc trzeba tagów tabeli i wewnątrz tagów tabeli
masz liczbę wierszy, TR.
I wewnątrz każdego wiersza trzeba TDS dla wielu kolumn
że chcesz mieć w danym rzędzie.
Rzućmy okiem na bardzo prosta tabela powyżej w CS50 IDE.
>> Więc mam tutaj plik nazywa tabela dot HTML.
Rzućmy okiem na co to wygląda.
Jest dużo się tu dzieje, ale jeśli zauważysz, mam stół otwarty.
Zaczynam definicję z tabeli.
A potem w moim pierwszym rzędzie I najwidoczniej ma cztery kolumny, jeden, dwa, trzy,
cztery.
A potem skończę z tym wierszu.
>> Potem rozpocząć kolejny wiersz i nie dwa, cztery, sześć, osiem.
Zakończ ten wiersz.
Czy kolejny wiersz, trzy, sześć, dziewięć, 12.
I wtedy ostatni wiersz, cztery, osiem, 12, i choć jest to
trochę odcięty tutaj, 16.
>> Skończyłem ten wiersz.
Skończyłem tabeli.
A potem skończę z moim HTML.
Co to wygląda?
Cóż, to naprawdę nie jest wiele do zobaczenia.
Mam jasno zorganizowane moje dane w nieco bardziej zorganizowany sposób.
Ale to nie jest tutaj bardzo ładna.
I będziemy do czynienia z że kiedy mówimy o CSS.
Będziemy ponownie ten pomysł co zrobić, aby się table--
może sformatować go trochę lepiej?
Ale mam jeszcze cztery rzędy, z których każdy ma cztery kolumny
i naprawdę, co stanowi to jest bardzo prosty cztery czterech mnożenia
stół.
>> Jeszcze tylko kilka tagi będziemy rozmawiać.
Porozmawiajmy o Koncepcja formularza HTML.
Więc może widzieliście to w kontekst, logując się na stronie internetowej.
Zazwyczaj należy wpisać swoją nazwę użytkownika.
Wpisać hasło, i jesteś dobry, aby przejść.
To byłby początek formularza.
>> Przeskakiwanie dział sekundę.
Mamy też wejść, które rodzaj zmieścić form.
Są to elementy, które jesteś rzeczywiście wpisując się,
lub przyciski radiowe jesteś tyka, lub kontrola
Skrzynki, że jesteś tyka.
Więc to go wewnątrz formy.
I obejmują one w zasadzie każdy wiersz formularza
Jeśli formularz jest sformatowany dobrze.
Potem jest ta koncepcja div, które naprawdę nie ma
zmieścić się w określonej kategorii tagów, takich jak te, które mam
robili wcześniej.
To po prostu rodzaj rozgranicza początek jakiejś arbitralnej division--
div-- strony.
Nie ma wizualne przerwy.
Nie ma linii.
To nie wyruszył jako oddzielny fragment automatycznie.
Trzeba by go tytułować w ten sposób, aby to zrobić.
>> To po prostu rodzaj mówi chcę kawałek miejsca na mojej stronie internetowej,
i jestem po prostu zadzwonić że ten podział mojej stronie.
Możemy umieścić rzeczy w środku div, w rzeczywistości
kiedy udać się do IDE w sekundę, będziemy
zobaczyć, że Kładę moje tworząc wewnątrz div.
>> Więc mam w moim IDE a plik o nazwie div formularz dot HTML.
Otwórzmy go.
Zauważ, że jak powiedziałem, div jest trochę arbitralne.
Dobrze?
To naprawdę nie ma znaczenia.
Więc mam dowolna Pierwszy podział mojej stronie.
A potem, zamiast kolejny div Później, począwszy od linii ósmym
Mam ten formularz.
I wewnątrz formularza Mam liczba wejść, pola formularza.
Więc mam pole, którego nazwa jest A-- które tak naprawdę nie znaczy nic
prawo now-- które najwyraźniej ma jeszcze jeden tekst, który
ma hasło, inny, że to radio przycisk, inny, że to pole wyboru,
a drugi to przycisk Prześlij.
Cóż, co to wszystko rzeczywiście wygląda?
Cóż, rzućmy okiem.
Będziemy go otworzyć w naszym oknie podglądu.
Zauważ, że to arbitralna Pierwszy division-- istnieje
nie wizualne oddzielenie tutaj.
To naprawdę nie robić nic, prawda?
>> A potem mam formularz.
A ja nie zrobiłem żadnego specjalnego formatowania.
Tak więc forma jest tylko jeden Duży rząd informacji.
Gdybym sformatowania formularza inaczej, Może mam to linia po linii po linii.
Ale nie zrobiłem żadnej stylizacji.
Ponownie, nie mówimy o CSS tutaj.
My tylko mówimy o HTML.
>> Cóż, w mojej formie tekstowej mogę type-- należy pamiętać, że formy typu text
więc mogę umieścić moje nazwisko.
I w moim hasłem I Można wpisać hasło.
A ponieważ tego pola jest typu hasła,
nie wiem, co moje hasło.
To wszystkie kropki.
>> Mogę również wybrać zaznaczyć off przycisk radiowy lub pole wyboru odhaczyć.
Albo mogę przedstawić moją formę.
A ja nic nie zrobiłem, więc kiedy mam złożyć formularz,
strona po prostu odświeża.
Ale mogę być może skonfigurować moje Przycisk Wyślij, aby zrobić coś innego.
I zobaczymy, co możemy zrobić z że w przyszłym wideo na PHP.
Ale to buduje bardzo Prosta forma, że
można używać mieć interakcji użytkowników i przedstawienia informacji na naszej stronie internetowej.
>> I ostatnia uwaga, zanim przejść do innych znaczników
to spójrz na to Wejście tag jeszcze raz.
Uwaga, mam podświetlone krańce tag w czerwonym.
Każdy inny tag widzieliśmy do tej pory ma miał początek i koniec, otwór
znacznik i znacznik zamykający.
>> Ale znacznik wejściowy nie.
Nie ma tekstu, który idzie pomiędzy znacznikami wejściowych.
Wszystkich informacji jesteśmy zamierza przekazać
związana jest jako część cechy tego wkładu.
Zauważ, mamy input name równa x.
Rodzaj równe y.
To naprawdę wszystko Informacje potrzebujemy.
>> To się nazywa tag SAMOZAMYKACZ.
Nie wymaga rozcięcia i blisko, ponieważ wszystkie informacje
znajdującego się wewnątrz tag i jego atrybuty.
Więc czasem zobaczysz, to też.
Więc po prostu mieć świadomość, że jeśli masz tag, który jest całkowicie samowystarczalny,
otwiera się i zamyka się z wspornik otwarty kąt na lewo
a kąt ukośnik uchwyt po prawej stronie.
Zobaczymy, jedna z tych teraz z metkami obrazu, jak również.
>> Przed mówimy o obrazach, my trzeba mówić o hiperłączy.
Jeśli chcemy, aby nasza strona internetowa będzie interaktywne i przenieść nas wokół,
byłoby miło być w stanie kliknij na jednym z tych,
co działo zazwyczaj był link.
To jest rzeczywiście, jak budujemy hiperłącze do naszej strony internetowej.
I co ciekawe Jest jeszcze jeden znacznik HTML
zwany związek, który nie jest hiperłącze.
A oznacza tu na kotwicy, a to w jaki sposób wskazują hiperłącza.
>> A href równa x sposobem przejść do internetowa strona X. A wszystko
między otwartym Znacznik i blisko Znacznik
jest to, co będzie, który podkreślił, niebieski tekst, który wygląda jak link
że jesteśmy zaznajomieni.
Poniżej że mamy znacznika obrazu, który to samo zamknięcie znacznik do wyświetlania
obraz znajduje się na X. I może być w stanie zmienić
że obraz, określając szerokość i wysokość
i inne atrybuty które dot dot dot tam.
>> Na samym dole tutaj mamy bardzo ciekawy
patrząc znacznik, który nie posiada znacznika zamykającego.
To wykrzyknik DOCTYPE html.
Więc HTML jest już od początku lat 1990 do budowy stron internetowych,
i to już poddane, kilka rewizje od tego czasu.
Ostatnio w 2014 roku przeszedł przegląd
HTML5, które nazywane jest obecny rodzaj de facto standardem HTML.
>> Aby wskazać, że nasza internetowa strony są napisane przy użyciu HTML5,
to jest jak zaczynamy.
Może ona zostać pominięta, ale co to w zasadzie
oznacza to, że nie można używać żadnych tagów które są tagi HTML5, te nowe tagi.
Więc zawsze zacząć jeśli używamy HTML5.
I wszystkie tagi rozmawialiśmy o wcześniej nie są znaczniki HTML5.
Ale czy to oznacza, że Tagi HTML5 będzie obecny.
I tak mamy okrzyk DOCTYPE HTML, które
jest na samym początku naszej Plik HTML, a następnie po tym punktem
mamy naprawdę nasza HTML otwarta oznakować i stamtąd kontynuować.
>> Ostatnia jest tag komentarz, która wygląda nieco inaczej, też.
Zaczyna się z kąta Uchwyt wykrzyknik kreska
kreska ale bez nawiasu zamykającego.
W między tymi dwoma tam elementów Tutaj możesz napisać swoje komentarze.
I rzućmy okiem na zdjęcia oraz komentarze i linki w CS50 IDE.
>> Więc mam tu plik o nazwie Link obrazu Kropka HTML, który mam zamiar otworzyć.
I zauważyć, mam kilka komentarze w moich komentarzy HTML.
Więc tak jak w C i inne języki programowania,
HTML tylko będąc język znaczników ma zdolność do komentarze.
A więc jestem podobno zamiar umieścić obraz Rick Astley
gdzieś pomiędzy tym div Znacznik ten arbitralny podział.
Wydaje się, że plik jest znajduje się Rick dot JPEG, które
jeśli kierujemy się z powrotem na moje drzewo plików na sekundę,
Jest to plik, który istnieje w katalog bieżący.
Więc to jest OK.
Mogę go odwołać.
>> Wtedy mogę mieć linki wewnętrzne.
Więc zauważyć na linii 11 tutaj witam moja href jest kropka HTML.
Tak, że po prostu odnosi się do komentarzy dot HTML która istnieje w bieżącym katalogu.
A może ja też mam zewnętrzne linki by po prostu określając HTTPS
aby wskazać, że nie mówię o pliku w moim bieżącym katalogu.
Mówię o pliku, który istnieje gdzieś w internecie, co mam
zażądać za pomocą protokołu HTTP.
>> Warto więc spojrzeć na to, co Ta strona może wyglądać
i przygotuj się na obraz Rick Astley, aby pokazać się na ekranie.
Więc będę podgląd tego.
Jest Rick Astley u bardzo szczyt w tym arbitralne
Dział I umieścić go na górze.
A następnie na dole I mają moje linki, prawda?
>> Mam link do powitania dot HTML.
A jeśli kliknę, że mam podszedł do tej strony
że jesteśmy bardzo znane z samego początku naszego programu.
Gdybym pop tę stronę otwarty ponownie, gdybym pop image link otworzyć jeszcze raz,
Mogę też pójść na zewnątrz na stronie CS50 jest.
I tam see-- będę pomniejszyć trochę here--
zobaczymy stronę CS50 w rodzaju osadzone w środku na stronie.
Więc byłem w stanie zrobić wewnętrzny odwołuje się również jako połączenia zewnętrznego.
>> Ostatnia reguła z HTML, który będziemy mówić o tutaj
HTML jest, że należy dobrze uformowane.
W C rozmawialiśmy dużo o Składnia różne rzeczy.
W HTML składnia naprawdę obraca się wokół tagów.
Każdy tag otwarciu musi być zamknięty.
A w rzeczywistości, każdy tag otwarciu powinna być zamknięta w odwrotnej kolejności.
>> Więc jeśli otworzyć śmiały znacznik, kursywa znacznik, a następnie znacznik podkreślenie
zrobić wszystkie trzy w pozycji a szczególności zestaw tekstu,
należy zamknąć je w odwrotnej kolejności.
Więc jeśli otwarte pogrubiony, kursywa, podkreślenie, można
chcą zamknąć podkreślenie, kursywa, pogrubienie.
Ten rodzaj enkapsulacji jest co utrzymuje HTML ładne i zorganizowane.
>> W przeciwieństwie do C, choć błędy składni nie będzie faktycznie może sparaliżować kod HTML.
Twój HTML może nie być dobrze utworzona, ale nadal działa.
I tak te błędy można sortować z slajdów.
To do Ciebie, aby naprawdę być czujnym.
Czasami nie udaje, ale czasami można uciec z nim.
>> To może być naprawdę trudne zadanie, chociaż
śledzić, kiedy otworzył tag, kiedy go zamknięto,
szczególnie jako HTML Pliki uzyskać większe i większe.
Będziesz chciał pomocy.
I są w Internecie narzędzia Validator, że
Można użyć do spojrzeć na swojej sieci Strona i sprawdzić, czy jest dobrze uformowane HTML.
I powinno się spójrz na tych,
i zacząć z nich korzystać, jak ty rozpocznie jakiejś pracy z HTML,
pisanie kodu HTML, tak więc masz dobre nawyki dotyczące organizowania
Twój HTML w dobry sposób i dobry styl i upewniając się,
że nie robią nic, że może stworzyć błąd składni, które
spowoduje ci trochę problem w dół drogi.
>> Jestem Doug Lloyd.
To CS50.