KURS PHP – Odcinek 2 – Czym jest HTML ?
KURS PHP – Odcinek 1 Wstęp
20 września 2019KURS PHP – Odcinek 3 – znaczniki
18 października 2019
Czym jest html ?
HTML najprościej rzecz ujmując to język który przedstawia nam wszystko to co widzimy po stronie przeglądarki, teksty, multimedia etc.
Zobaczmy więc budowe najprostszej strony www.
Utwórzmy plik index.html w Visual Studio Code. Wpiszmy znak „!”. I kliknijmy klawisz „Tab”. W tym momencie pojawia na się nam struktura html.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>Document</title>
</head>
<body>
</body>
</html>
Stało się tak ponieważ edytor ma wbudowane rozszerzenie Emmet, którego zadaniem jest przekształcanie danego tekstu na kod html. Postaramy się używać tych skrutów jak najczęściej podczas kursu.
Zaczniemy analizę kodu.
<!DOCTYPE html> – nie jest to tag html, jest to informacja dla przeglądarki w jakiej wersji html jest kod napisany. W naszym kodzie jest to najnowsza wersja, czyli html 5.
Właściwy kod powinien zaczynać się od znaczników <html></html> jak powyżaj. Mamy w nim deklarację języka angielskiego lang=”en”, którego powinniśmy używać w treści strony. Możemy oczywiście go zmienić na język polski wpisując pl.
Następny znacznik to head, który zawiera metadane (dane dotyczące strony). W tym przykładzie mamy następujące:
– kodowanie strony za które odpowiada <meta charset=”UTF-8″>
– sposób wyświetlania strony za który odpowiada znacznik o nazwie (name) „viewport”, z zawartością (content) „width=device-width”, co oznacza, że ustawienie strony będą domyślnie na 100% szerokości ekranu, initial-scale=1.0 oznacza, że strona się domyślnie nie będzie skalowalna, ale będzie można ją przybliżać i oddalać.
– <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> wymusza na IE, żeby użyła najnowszej wersji silnika
– znacznik title zawiera tytuł strony, który wyświetlany jest jako nazwa zakładki w przeglarce
Znacznik body powinien zawierać właściwą treść strony, którym zajmiemy się dokładniej w następny odcinku. Dziękuje i zapraszam.
