Korzystanie ze szkieletu HTML

Szkielet jest szkieletem podtrzymującym organizm.

Zazwyczaj jest zrobiony z czegoś twardego, aby chronić bardziej wrażliwe ciało.

Encyklopedia

Każdy programista WWW powinien mieć szkielet HTML.

Powinien być trzymany w kieszeni i używany do każdej pracy:

Przykład

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="">
<style>
</style>
<script src=""></script>
<body>

<img src="img_la.jpg" alt="LA" style="width:100%">

<div class="">
 <h1>This is a Heading</h1>
 <p>This is a paragraph.</p>
 <p>This is another paragraph.</p>
</div>

</body>
</html>

Kliknij przycisk „Wypróbuj sam”, aby zobaczyć, jak to działa!

Spróbuj zmienić tekst „To jest nagłówek” na „To jest mój ślub”.

Zrobiłeś to?

Gratulacje! Teraz wiesz, jak edytować HTML.


Objaśnienie szkieletu HTML

DOCTYPE musi być obecny. Informuje przeglądarkę, że jest to dokument HTML:

<!DOCTYPE html>

Znacznik początkowy html i znacznik końcowy html definiują początek i koniec dokumentu HTML.

Językiem jest angielski:

<html lang="en">

</html>

Meta tag charset definiuje zestaw znaków (UTF-8):

Na stronie HTML brakuje tagów head. Tagi Head nie są potrzebne w HTML.

W HTML wszystko przed tagiem body jest uważane za część głowy.

<meta charset="UTF-8">

Standard HTML wymaga odpowiedniego tytułu strony:

<title>Page Title</title>

Metatag widocznego obszaru sprawia, że ​​strona wygląda dobrze na wszystkich rozmiarach ekranu (laptop, telefon komórkowy):

<meta name="viewport" content="width=device-width,initial-scale=1">

Znacznik linku prowadzi do arkusza stylów:

<link rel="stylesheet" href="name">

Tag początkowy i końcowy otaczają przyszłe style CSS:

<style>
</style>

Tag skryptu prowadzi do skryptu:

<script src="name"></script>

Znacznik początkowy i znacznik końcowy otaczają widoczną treść dokumentu HTML:

<body>
</body>

Tagi obrazu definiują obrazy HTML:

<img src="img_la.jpg" alt="LA" style="width:100%">

Przyzwyczajaj się do „pakowania” sekcji HTML w elementy div.

Przygotuj się na nadanie każdej sekcji nazwy klasy:

<div class="class name">
</div>

Tagi nagłówków definiują nagłówki HTML:

<h1>This is a Heading</h1>

Tagi akapitu definiują akapity HTML:

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>