Co oznacza HTML i jak utworzyć plik HTML? HTML co to jest i z czym się je spożywa.
Cześć przyjaciele. Tym artykułem chcę rozpocząć cykl lekcji i materiałów poświęconych językowi programowania hipertekstowemu językowi znaczników HTML.
Ta seria artykułów będzie aktualizowana o 1 lekcję co tydzień. W nich opiszę szczegółowo konkretne punkty techniczne dotyczące samego języka i jego interakcji z innymi technologiami, ponieważ w naszej większej i potężniejszej sieci wszystko istnieje i współpracuje. Cóż, zacznijmy pierwszą lekcję, dobrze?
Zacznijmy więc zgodnie z oczekiwaniami od definicji, aby wyjaśnić, nad czym musimy pracować i nad czym się uczyć.
Co to jest HTML?
HTML(" Hipertekstowy język znaczników") - Jest to hipertekstowy język znaczników. OK, definicja jest fajna, ale co to za znacznik i jaki rodzaj hipertekstu? No cóż, zróbmy porządek. Przede wszystkim w w tym przypadku Zaznaczamy tekst, który najpierw odpowiednio drukujemy, nieważne gdzie, najważniejsze, że mamy ten tekst na swoim komputerze. Co oznacza znacznik tekstowy? No cóż, to proste, to jest jego banalne formatowanie, jak na przykład tutaj:
Hmmm... dlaczego jestem na krawędzi? Dlaczego mnie tam umieścili, co?
Oooh, jestem taka ważna, tylko trochę gruba.
Nie życie, ale jedna czarna smuga
- I tak dalej.
To tylko przykład tego samego znacznika, wymyśliliśmy to. Co jest takiego hipertekstowego w tym tekście i HTML? Cóż, prawdopodobnie musimy zacząć od historii samego języka:
Daleko, daleko w 1986 roku...
Myślałeś, że ci to wszystko powiem? Heh... Lepiej na końcu podam link do materiału, żebyście, jeśli macie ochotę, mogli bliżej zapoznać się z jego historią. Artykuł nie jest banalny, ale zwięzłość jest siostrą talentu… tak, tak.
Dlaczego nazywa się go językiem hipertekstowym? Ponieważ pozwala na połączenie się pojedyncza sieć wiele dokumentów w Internecie za pośrednictwem hiperłączy. Chyba nie będę Ci wyjaśniał czym są hiperłącza, jakimś cudem trafiłeś na mojego bloga klikając w podobny napis.
Kontynuujmy...
Co to są tagi w HTML
Tagi to znaczniki w kodzie strony używane do informowania przeglądarki, w jaki sposób powinna wyświetlać Twoją witrynę.
Wszystkie tagi mają ten sam format: zaczynają się od „<» и заканчиваются знаком ">".
Z reguły wszystkie tagi mają 2 formaty zapisu - otwierający znacznik: i zamykanie: . Różnica polega na tym, że na końcu znajduje się ukośnik „/”.
Cała treść umieszczona pomiędzy tagiem otwierającym i zamykającym jest treścią tagu.
HTML zawiera również znaczniki, które są zarówno znacznikami otwierającymi, jak i zamykającymi. Tagi te nie zawierają tekstu, ale są znakami, na przykład podział wiersza wygląda następująco:
.
Dlatego pokrótce omówiliśmy, czym jest HTML. Jak więc zacząć się tego uczyć? Aby to zrobić, musisz się uczyć i pisać
HTML to tagi i nic innego jak tagi. Dla nauka HTML-a musisz przestudiować różne tagi i spróbować stworzyć strony internetowe przy ich użyciu.
W przyszłości moje artykuły na ten temat pomogą Ci w tym. Ach, prawie zapomniałem... oto obiecana historia.
strona internetowa Prawa do treści zastrzeżone.Słyszałeś o HTMLu? A może słyszałeś o stronach html w Internecie? Właściwie to proste. HTML jest, mówiąc najprościej, jednym z języków programowania, i to wcale nie najbardziej skomplikowanym.
HTML to skrót od HyperText Markup Language, który można przetłumaczyć jako hipertekstowy język znaczników.
Treść:
HTML służy do tego, aby strony w Internecie wyglądały dokładnie tak, jak je znasz:
- pięknie zaprojektowane teksty,
- pogrubioną czcionką lub kursywą,
- tylko czarny lub wielokolorowy,
- z aktywnymi linkami do innych stron serwisu lub bloga,
- z wideo, audio i wieloma innymi interesującymi funkcjami.
Zasadniczo HTML stanowi tylną część stron wielu witryn. Często ich piękny projekt jest tworzony przy użyciu języka znaczników HTML. W przeciwnym razie nazywa się to również tworzeniem stron przy użyciu układu HTML.
Strony internetowe można tworzyć także w innych językach programowania, np. PHP.
Brytyjski naukowiec Tim Berners Lee opracował język HTML w latach 1986-1991 w Szwajcarii. Zasadniczo HTML umożliwia tworzenie prostych, ale pięknych dokumentów. Później do HTML dodano możliwości multimedialne (wideo itp.) i obsługę hipertekstu (do tworzenia hiperłączy).
Stworzono znane programy przeglądarkowe do pracy z HTML, takie jak:
- Mozilla Firefox(Mozilla Firefox)
- Internet Explorera(Internet Explorer),
- GoogleChrome(GoogleChrome),
- Opera (Opera),
- przeglądarka Yandex,
- Safari i
- Inny.
Początkowo główną funkcją przeglądarki była właśnie interpretacja kodu HTML i wyświetlanie wyniku wizualnego na ekranie monitora użytkownika.
Co to jest strona HTML?
Dokumenty, pliki, strony utworzone w języku html mają rozszerzenie .html lub .htm. Na przykład strona HTML (lub plik HTML lub dokument HTML) może mieć nazwę taką jak:
- test.html,
- HTML,
- html lub
- tytuł.html.
Ściśle mówiąc, test.html to nazwa pliku (lub nazwa strony), gdzie
- test to nazwa pliku, a
- .html to rozszerzenie nazwy pliku (lub rozszerzenie nazwy strony), które zwykle nazywane jest po prostu „rozszerzeniem”.
Obecnie słowo „format” stało się bardziej powszechną opcją zamiast słowa „rozszerzenie”. Zatem wyrażenie „format html” oznacza, że plik (lub strona) jest napisany w języku html i nazwa takiego pliku to rozszerzenie HTML. Oznacza,
plik o nazwie test.html jest w formacie HTML.
System operacyjny Windows domyślnie ukrywa rozszerzenia plików (czyli formaty plików). Programiści zrobili to „nie ze złośliwości”, ale w celu ochrony użytkownika przed bezmyślną zmianą rozszerzeń plików. Możesz domyślnie otwierać rozszerzenia plików. Aby to zrobić w systemie Windows 7:
- kliknij przycisk Start,
- otwórz Panel sterowania,
- znajdź Opcje folderów,
- otwórz zakładkę Widok, przewiń na sam dół i
- odznacz pole obok opcji „Ukryj rozszerzenia znanych typów plików”,
- Kliknij OK".
Ryż. 1. Otwórz wszystkie rozszerzenia plików Jeśli teraz spojrzysz w górę i spojrzysz na pasek adresu swojej przeglądarki, zobaczysz tam nazwę strony, którą aktualnie czytasz, a na końcu nazwy znajduje się .html. To jest przykład strony bloga w formacie HTML opublikowanej w Internecie. Zwykle blog (witryna) ma wiele stron HTML. Na przykład każdy artykuł na tym blogu jest osobną stroną HTML.
W Internecie istnieją również witryny jednostronicowe, składające się tylko z jednej strony HTML. Na przykład mogłoby tak być
- Internetowa wizytówka osoby lub firmy, lub
- strona sprzedająca produkt lub usługę za pośrednictwem Internetu.
Język HTML stale się rozwija i dziś istnieje kilka jego wersji, począwszy od HTML 2.0 z 22 września 1995 r., a skończywszy na najnowszej wersji Język HTML 5 z dnia 28 października 2014 r. Wydanie HTML 5.1 planowane jest na wrzesień 2016 r.
Co to są tagi HTML?
HTML to język służący do oznaczania dokumentów za pomocą znaczników. Tagi są ujęte w nawiasy trójkątne „< >" Tagi mogą być sparowane lub niesparowane.
- Na przykład znacznik „b” ujęty w nawiasy trójkątne powoduje pogrubienie tekstu
tekst pogrubiony
Wynik będzie wyglądał następująco: tekst pogrubiony
- Znacznik „i” powoduje, że tekst jest kursywą.
tekst kursywą
W rezultacie otrzymujemy: tekst kursywą
- Istnieje również znacznik umożliwiający przerwanie ciągu „br”.
- Za pomocą znacznika „a href” podświetlane jest hiperłącze.
- Znacznik tytułu dokumentu – . To jest tag otwierający dokument. Jest sparowany w tym sensie, że wymaga znacznika zamykającego z ukośnikiem.
- Po tytule następuje część główna, która znajduje się pomiędzy tagiem otwierającym i znacznik zamykający. Tag ten, podobnie jak tag head, jest parą: należy go otworzyć i pamiętać o zamknięciu.
W tagach sparowanych konieczny jest tag zamykający z ukośnikiem, gdyż anuluje on (dokładniej poprawnie dopełnia) działanie tagu otwierającego.
Istnieje wiele znaczników HTML, a samouczki HTML można łatwo znaleźć w Internecie.
Jak utworzyć plik HTML
Utworzenie strony HTML (lub pliku HTML) na komputerze i uruchomienie jej w przeglądarce jest bardzo łatwe.
1) Otwórz Notatnik (prosty edytor tekstu dostarczany z systemem Windows). Znajdziesz go na swoim komputerze wpisując zapytanie: Notatnik w pasku wyszukiwania.
2) Skopiuj i wklej następujący tekst do Notatnika:
Cześć! To jest moja pierwsza strona HTML.
Druga linia, hura!
3) Ważny punkt, bez którego plik html nie będzie działał: w Notatniku zapisujemy plik ściśle(!) w formacie HTML, jak pokazano na zrzucie ekranu. Dla uproszczenia możesz zapisać plik na pulpicie swojego komputera.
Ryż. 2. Zwróć uwagę na typ pliku i zapisz plik w formacie HTML 1 na ryc. 2 – Kliknij „Pulpit”, aby zapisać tam plik HTML.
2 na ryc. 3 – Otwórz menu rozwijane obok „Typ pliku”.
3 – W tym menu wybierz „Wszystkie pliki”.
4 – wpisz dowolną nazwę (mam 001) i po kropce pamiętaj (!) wpisz html.
5 na ryc. 2 – kliknij „Zapisz”.
4) Na Pulpicie znajdujemy plik 001.html:
Ryż. 3. plik HTML na pulpicieMoją domyślną przeglądarką jest Google Chrome, więc ikona pliku wygląda jak ikona tej przeglądarki. Jeśli istnieje inna domyślna przeglądarka, plik 001.html będzie miał inną ikonę.
Klikamy 2 razy myszką na plik (ryc. 3) i w efekcie widzimy w przeglądarce naszą pierwszą stronę w formacie HTML:
Ryż. 4. Sprawdzenie jak wygląda strona html w przeglądarce Zatem mamy lokalną stronę HTML w tym sensie, że jest ona dostępna tylko z Twojego, komputer lokalny. Aby strona była dostępna dla innych, należy ją wgrać do Internetu. A dokładniej miejsce, które jest zawsze dostępne: 24/7/365 (24 godziny na dobę, 7 dni w tygodniu, przez cały rok). Wtedy każdy użytkownik Internetu będzie mógł zobaczyć taką stronę.
HTML jest więc dość ciekawym językiem i jeśli w przyszłości myślisz o stworzeniu i prowadzeniu własnej strony internetowej lub bloga, to warto poznać przynajmniej minimalny zestaw tagi używane w języku HTML.
Podróżowanie po rozległych przestrzeniach Sieć WWW, byłeś w stanie zauważyć, jak różne projektowanie i możliwości stron internetowych. Ale nie każdy z Was wie, że cała ta różnorodność realizowana jest w oparciu o język HTML.
Wszystko, co widzisz na stronie – tekst, obrazy, tabele i inne elementy tworzące treść semantyczną strony internetowej, zwane treścią, tworzone są przy użyciu języka znaczników HTML. Kliknij kliknij prawym przyciskiem myszy najedź kursorem na dowolną stronę internetową i wybierz element z menu rozwijanego „wyświetl kod HTML” Lub « Źródło» – pojawi się edytor tekstu z symbolami i ikonami, których nie rozumiesz – o to właśnie chodzi HTML-kod strony.
Każdy dokument WWW może zawierać stylizowany i sformatowany tekst, grafikę oraz hiperłącza do różnych zasobów Internetu. Aby zrealizować wszystkie te możliwości, został on opracowany specjalny język opisy dokumentów WWW tzw Język znaczników hipertekstowych (HTML), to jest, Hipertekstowy język znaczników.
Opis HTML strony internetowej to zestaw instrukcji interpretowanych przez program przeglądarki.
Dokument napisany w HTML to plik tekstowy, zawierający rzeczywisty tekst, który przenosi informacje do czytelnika, oraz znaczniki. Tagi są zdefiniowane przez normę HTML, ciągi znaków będące instrukcjami dla przeglądarki.
Zgodnie z tą instrukcją program umieszcza tekst na ekranie i dołącza obrazy zapisane w osobnych plikach pliki graficzne i tworzy hiperłącza z innymi dokumentami lub zasobami internetowymi. Zatem plik HTML nabiera wyglądu dokumentu internetowego tylko wtedy, gdy jest interpretowany przez przeglądarkę.
Jednak w standardowym HTML jest jeden istotna wada. Przykładowo, aby opisać układ akapitów w treści i ich wygląd, konieczne jest opisanie tych właściwości dla każdego akapitu, nawet jeśli na jednej stronie jest 10 czy 20 akapitów. I wyobraź sobie, że witryna może mieć 100 stron. W rezultacie trzeba wstawić ten sam fragment kodu HTML na stronę dwadzieścia lub dwieście razy, zwiększając rozmiar pliku.
Cóż za ból głowy dla programistów! Aby ułatwić życie biednym webmasterom, wymyślono je Kaskadowe arkusze stylów (CSS)- Kaskadowe arkusze stylów.
CSS działa w inny, wygodniejszy i ekonomiczny sposób. Aby zaprojektować akapity w treści witryny, kod lub styl projektu są pisane jednorazowo. Ten kod lub opis stylu jest zapisany w osobny plik. Dalej jest to konieczne tylko wtedy, gdy Pomoc HTML podziel tekst na akapity, a CSS zajmie się ich projektem. Kod jest zmniejszany dziesiątki i setki razy.
Umieszczenie opisów stylów w osobnym pliku jest bardzo wygodne, szczególnie jeśli witryna posiada więcej niż jedną stronę. Na przykład zmienić dekoracje wszystkie akapity na stronie, wystarczy zmienić kod w arkuszu stylów.
CSS wraz z HTML potrafią zdziałać cuda, a wszystko dzięki podziałowi pracy przy tworzeniu stron internetowych. Elementy strony są zaznaczone Oparty na HTMLu, a projekt wizualny elementów podano za pomocą tabel CSS
Stoły Style CSS - próba oddzielenia szczegółów projektu strony od jej struktury i treści.
Na razie jest to dla ciebie chiński list. Ale nie będę udawać guru i pisać kolejnego poradnika „Co to jest HTML i CSS”. W Internecie znajdziesz mnóstwo podobnych informacji oraz wiele opublikowanych podręczników. Jeśli chcesz zgłębić temat, flaga jest w Twoich rękach. Nie bój się, HTML I CSS są bardzo proste i każdy czajniczek może je opanować. Ale nie ma jeszcze potrzeby się z tym spieszyć.
Przez własne doświadczenie Wiem, że lepiej nie przeciążać mózgu czajnika niepotrzebnymi informacjami, bo inaczej to, tj. mózg zagotuje się przed czasem. Nie wierz mądrym facetom na różnych stronach, którzy twierdzą, że tworzenie strony internetowej należy rozpocząć od nauki HTML i CSS. Mam dla Ciebie dobrą wiadomość – nie musisz samodzielnie pisać kodu HTML, bo mądrzy ludzie wymyślił CMS-a .
| < Как работает браузер |
|---|
Co to jest HTML i do czego służy? - 3,7 na 5 na podstawie 3 głosów
Przed rozpoczęciem nauki proponuję zastanowić się, czym jest HTML i do czego jest przeznaczony.
HTML oznacza Hyper Text Markup Language, który można przetłumaczyć jako hipertekstowy język znaczników. Strony internetowe tworzone są w tym języku.
HTML nie jest językiem programowania. Przeznaczony jest do znakowania dokumenty tekstowe. Oznacza to, że w zasadzie używamy go do formatowania tekstu.
Jak więc możemy edytować tekst za pomocą HTML? Faktem jest, że język HTML składa się ze znaczników. Każdy tag określa, jak będzie wyglądał tekst na Twojej stronie.
Inaczej mówiąc, każdy tag przekazuje Twojej przeglądarce (programowi, za pomocą którego przeglądasz strony internetowe) określone polecenie, przeglądarka rozumie to polecenie i wyświetla na Twoim ekranie gotowy, sformatowany w określony sposób tekst.
Dlatego nie widzisz samego kodu, przeglądarka wyświetla na ekranie monitora gotowy, sformatowany tekst i grafikę. Jeśli chcesz zobaczyć na własne oczy Kod HTML i znaczniki, za pomocą których sformatowany jest tekst, który czytasz, a następnie przejdź przez plik przeglądarka internetowa Explorer do pozycji menu > Widok i z rozwijanej listy wybierz pozycję > Źródło. Zobacz zdjęcie.
W rezultacie otworzy się okno zawierające kod. Podobny do tego, który widać na drugim zdjęciu. Możesz przewijać i przeglądać ten kod, składa się on głównie z tagów, które w większości przypadków zawierają tekst. Zatem bez wchodzenia w szczegóły można powiedzieć, że każdy tag określa gdzie, jak, jaką czcionką i kolorem będzie wyglądał Twój tekst.
Ale tak naprawdę tagi HTML potrafią więcej niż tylko formatowanie tekstu; za ich pomocą możesz wstawić obraz na stronę, tworzyć tabele, tworzyć łącza i wiele więcej.
Każdy tag robi swoje pewne funkcje aby nauczyć się tworzyć strony internetowe, musisz wiedzieć, do czego służy ten lub inny tag. Myślę, że teraz już trochę rozumiesz, czym jest HTML.
Najpierw przyjrzyjmy się, czym jest tag. Mówiąc najprościej, tagi składają się ze zwykłych Angielskie znaki lub słowa, tylko te litery i słowa są zaprojektowane w określony sposób.
Każdy znacznik składa się z nawiasów ostrych,< >wewnątrz których umieszczone są określone symbole. Większość z nich polega na otwieraniu i zamykaniu.
Na przykład tag - otwarcie i- zamknięcie. Jak widać różnią się obecnością ukośnika / w symbolu zamykającym. Jeśli umieścisz pomiędzy nimi jakieś słowo, np. Cześć wtedy zostanie wyświetlony pogrubione. Wszystko, co ujęte jest w nawiasach ostrych w tym przypadku, nie jest wyświetlane na ekranie, lecz jest swego rodzaju poleceniem dla przeglądarki, aby słowo zawarte pomiędzy tymi znacznikami zostało pogrubione.
Tagów jest oczywiście wiele i każdy z nich spełnia swoje specyficzne funkcje. Wszystkie pozostałe tagi i cały kod HTML działają mniej więcej na tej samej zasadzie. Kiedy żądasz dowolnego dokumentu z Internetu, Twoja przeglądarka pobiera kod HTML, odpowiednio go interpretuje i wyświetla na ekranie gotowy sformatowany tekst, grafikę, tabele itp.
Celem tej lekcji było dać ci wyobrażenie o tym, czym jest HTML; w następnych lekcjach zaczniemy uczyć się tego języka znaczników. Aby ułatwić Ci przyswojenie materiału, polecam zacząć naukę od najprostszych, płynnie przechodząc do bardziej skomplikowanych, np. w następującej kolejności: na początku przestudiuj, w jaki sposób dokument służy do ustawiania i produkować, uczyć się ustawiać itp. na bardziej złożone.
Do tworzenia Strony HTML możesz używać specjalnych programów, np. lub możesz tworzyć strony za pomocą prostego Edytor tekstu, który jest dostępny w dowolnej wersji systemu Windows.
Tworząc witrynę internetową, pierwszą rzeczą, którą musisz sobie wyobrazić, jest sposób jej tworzenia. Jest to swego rodzaju „fundament” w budowaniu stron internetowych. Dlatego zanim zagłębisz się w dalsze studiowanie złożone technologie Podczas tworzenia stron internetowych zaleca się posiadanie przynajmniej podstawowej wiedzy z zakresu HTML. W ta lekcja spotkamy się HTML, uporządkujmy to Struktura dokumentu HTML i dalej praktyczne przykłady Utrwalajmy zdobytą wiedzę.
Co to jest HTML?
HTML oznacza HyperText Markup Language. Język ten odpowiada za to, jak dokładnie hipertekst będzie wyświetlany na stronach serwisu. Teraz zastanówmy się, czym jest hipertekst? Nie jest tajemnicą, że pojedyncza strona internetowa może zawierać wiele różnych rodzajów informacji, czy to tekst, niektóre tabele, wykresy, filmy, pliki audio itp. Tak więc wszystkie te informacje można nazwać jednym słowem – hipertekstem.
Należy pamiętać, że HTML jest językiem znaczników, a nie językiem programowania. W dany język nie ma funkcje logiczne i nie da się na nim dokonać żadnych obliczeń matematycznych. Strony HTML mieć rozszerzenie .html Lub .htm i przetwarzane przez przeglądarki - IE, Mozilla Firefox, Google Chrome, Yandex Chrome, Opery itp.
Zastanówmy się teraz, jak przeglądarka rozumie, co i jak wyświetlać na stronie internetowej? To jest bardzo proste. Hipertekstowy język znaczników HTML ma wbudowane polecenia zwane znacznikami. To na nich zorientowana jest przeglądarka.
Struktura dokumentu HTML
Każdy Dokument HTML(strona internetowa) musi mieć określoną strukturę. To pozwoli uniknąć możliwe problemy podczas otwierania stron w przeglądarkach. Jako przykład przyjrzyjmy się stronie zawierającej następujący kod HTML:
Struktura dokumentu HTML ...