Уроци по програмиране на HTML: 2016

петък, 29 април 2016 г.

HTML елементи

./HTML елементи
HTML елементите се записват със стартиращ таг,с затварящ таг и съдържание между таговете.

<tagname>Съдържание</tagname>

HTML елемент е всичко намиращо се между отварящият таг и затварящият таг.

Има някой елементи които нямат затварящ таг като елемента <br>

./Наслагване на елементи

Елементите в html документа могат да бъдат наслагвани т.е. между отварящият таг на елемент и затварящият може да се вкара друг елемент.Всеки html документ има насложени елементи.
*Пример

В елемента body са насложени елементите за Заглавие и параграф.

./Празни елементи

Елемента <br> е празен елемент защото той няма затварящ таг и съответно съдържание.Тези елементи все пак могат да бъдат затваряни(макар и ненужно) като се ползва следният таг <br />

./Елементите не са чувствително от към ползването на главни или малки букви

<P> е същият таг като <p>.HTML5 стандартът няма изискване от към ползването на главни и малки бувки но все пак е препоръчително да се ползват малки бувки.

четвъртък, 28 април 2016 г.

Елементи в HTML

Прости HTML примери

./HTML Документи
-Всички HTML документи започват с декларацията <!DOCTYPE html>
-Самият html документ започва с <html> и завършва с </html>
-Часта която потребителя вижда се намира м/у таговете <body> и </body>

*Пример

./Заглавия

Заглавията в HTML документите могат да бъдат 6 различни размера като се ползват таговете от <h1> до <h6>

*Пример

./Параграфи

За създаване на параграф се използва тагът <p>

*Пример

HTML линкове

За създаване на хиперлинк се ползва тагът <a>

*Пример

Крайната дестинация на линка се поставя след атрибута "href".Атрибутите се ползват за да предоставят допълнителна информация относно елементите.

./Изображения

За вмъкване на изображения в html документ се ползва елемента <img>
Атрибутите на елемента са следните :

- src - входящ файл
- alt - алтернативен текст(появява се на мястото на изображението при грешка)
- width,height - Размер на изображението

*Пример

HTML едитори

HTML Едитори

./Програмирай на HTML като използваш текстов едитор като Notepad++

Може да програмираме на HTML като използваме професионалните едитори като Microsoft WebMatrix и Sublime Text.За да научим обаче елементите и тяхното място в документа е добре да се
използва текстови едитор като Notepad++.Само в няколко стъпки ние можем да създадем уеб страница използвайки Notepad++.

1.Стартирайте Notepad++
2.Можем сами да напишем HTML код или да копираме директно от интернет източник

- Примерен код

<!DOCTYPE html>
<html>
<body>

<h1>Моето първо заглавие</h1>

<p>Моят първи параграф.</p>

</body>
</html>

3.Запазете документа

За да запазим документа влизаме в менюто файл и от там цъкаме в/у Save as.За име на файла ще ползваме "index.html".За кодировка избираме UTF-8.Файловете може да са с разширение
htm или html,но няма никаква разлика между файловите разширения.

4.Отваряме документа в браузера

Отворете документа с предпочитаният от вас браузер.Страницата трябва да изглежда така:

Въведение в HTML

Въведение в HTML

./Какво е HTML?

HTML е основкният език за маркиране на хипертекст който се използва за създаване на уеб страници.

*HTML е съкращение от термина на английски " HyperText Markup Language"
*HTML е маркиращ език който използва маркиращи тагове за да описва уеб страници
*HTML документите се описват от HTML тагове
*Всеки HTML таг описва различно съдържание в документа

./Пример за HTML

./Примерни тагове

*Декларацията "DOCTYPE" определеля типа на документа като HTML
*текста м/у елементите "<html>" и "</html>" описва началото и края на html документа
*текста м/у елементите "<head>" и "</head>" предоставя информация относно документа
*текстът м/у елементите "<title>" и "</title>" предоставя заглавието на документа
*текстът м/у елементите "<body>" и "</body>" описва всичката информация която е видима за потребителя
*текстът м/у елементите "<h1>" и "</h1>" се използва за заглавието
*текстът м/у елементеи "<p>" и "</p>" създава параграф

Чрез използването на тези документи,уеб браузерът може да изложи на дисплея една обикновена уеб страница съдържаща заглавие и параграф.

./HTML тагове

Таговете са ключови думи заобиколени от скоби

*HTML таговете се използват по двойки
*Първият таг се счита за начален таг,а вторият,като затварящ
*Затварящият таг се раличава с това че преди името на тага има наклонена черта

./Уеб браузери

Целта на уеб браъзера е да чете html документи и да ги извежда на дисплеят.Браузерът не показва таговете(елементите) на дисплеят,но използва таговете за да определи как да
визуализира документа.

./Структура на HTML документа

<html> - задава началото на документа
<head> - заглавна част на документа.Тук се съдържа често важна информация,като езикът на документа и други.
<title> - заглавие на документа
</title> - този таг затваря мястото където се пише заглавието
</head> - край на заглавната част на документа
<body> - само информацията която е написана след този таг се визуализира от браузера.
<h1> - Заглавие в документа
</h1> - Край на заглавието в документа
<p> - Начало на параграф
</p> - Край на параграф
</body> - Всичката информация след този таг не се визуализира от браузера.
</html> - Край на html документа

./Декларацията DOCTYPE!

Този елемент помага на браузера да визуализира правилно документа.Има различни видове документи в интернет.За да бъде визуализиран правилно,браузера трябва да знае какъв е типа
и версията на документа.Този елемент не е чувствителен от към използването на малки и главни букви

- Различни DOCTYPE декларации

*HTML 5

*HTML 4.01

*XHTML 1.0

./Версии на HTML

Версия Година
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014

петък, 29 април 2016 г.