HTML5 - Създаване на документи и атрибути

HTML5 - Създаване на документи и атрибути

Това е най -малко интересната част, но без съмнение е една от най -критичните. Всеки документ HTML използва поне част от тези елементи, а понякога и всички, така че не боли, че знаем как да ги използваме по подходящ начин за създаване на документи HTML5 правилно и общо.
Елементи от тип документ
Нека започнем с елементите на типа документ. Това са блоковете, които оформят нашия документ HTML и задава начален контекст за браузъра.
Елементът doctype
Елементът doctype той е уникален в своята категория. Добра практика е да стартирате всеки документ HTML който създаваме с елемент от тип doctype. Това е елементът, който казва на браузъра, с който ще се занимава HTML.
Повечето браузъри ще продължат да показват правилно съдържанието ни, ако пропуснем doctype, но е лоша практика да се доверите на браузъра да се държи по този начин.
Правилният синтаксис за прилагане на елемент от тип doctype е следното:
Елементът html
Този елемент се нарича най -вече root елемент и показва началото на HTML в нашия документ.
Синтаксисът е следният:


Съдържание и елементи тук

Елементът на главата
Елементът глава Той съдържа всички метаданни за документа. В HTML, метаданните предоставят на браузъра информация за съдържанието и маркирането в документа, но допълнително можем да включим скриптове и препратки към външни ресурси, като стилови таблици CSS.
Синтаксисът е следният в документа:



Здравейте


Елементът на тялото
Този елемент инкапсулира съдържанието на документ HTML, е обратното на елемента head, който капсулира метаданните и информацията на документа. Елементът тяло той винаги следва елемента head, което означава, че той е второто дете в структурата на основния html елемент.
Нека да видим синтаксиса му:

Пример

харесвам ябълки и портокали.

Елементи от тип метаданни
Елементите от типа метаданни ни позволяват да предоставяме информация за документа HTML. Те не се съдържат сами по себе си, но предоставят информация за съдържанието, което ще ги последва. Към елемента head се добавят елементи от метаданни от тип.
Задаване на заглавие на нашия документ
Елементът заглавие задайте заглавие или име на нашия документ. Браузърите обикновено показват съдържанието на този елемент в горната част на прозореца или раздела.
Нека да видим как да го добавим към нашата структура:

Пример

харесвам ябълки и портокали.

Задаване на основа за относителни URL адреси
Основният елемент фиксира a URL адрес база, в която какви относителни връзки, съдържащи се в документа HTML ще бъде разрешен. Относителната връзка е тази, която пропуска протокола, хоста и порта на URL адреса и се оценява спрямо друг URL. Базовият елемент също така указва как се отварят връзките, когато потребител кликне върху тях и как действа браузърът след въвеждане на формуляр.
След като видяхме основните елементи за документа, можем да допълним само останалите елементи, които работят за метаданните и по този начин да изградим документ HTML правилно и това може да се тълкува от всеки браузър по най -добрия начин.
Атрибути

• реж

Атрибут реж посочва посоката на текста, съдържащ се в елемент. Поддържаните стойности за него са:

• ltr (текст отляво надясно)
• rtl (текст отдясно наляво)

Нека да видим прост пример за неговото приложение:

Пример

dir = "rtl"> Това е отдясно наляво

dir = "ltr">Това е отляво надясно

• contextmenu

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

• плъзгащ се

Атрибут плъзгащ се е част от поддръжката на HTML5 за плъзгане и пускане и се използва, за да покаже кога даден елемент може да бъде плъзнат.

• dropzone

Атрибут dropzone е част от поддръжката на HTML5 за плъзгане и пускане y е двойникът на плъзгащия се атрибут, който беше обяснен по -горе.

• скрит

Атрибут скрит Това е булев атрибут, който показва, че даден елемент не е релевантен, следователно няма да присъства визуално в документа. Браузърите тълкуват този атрибут по начин, който скрива елемента от изгледа на потребителя. Нека да видим пример за това:

Пример
Превключване



скрит>

Ям	Град
Адам Фрийман	Лондон
Джо Смит	Ню Йорк
Ан Джонс	Париж

В този пример дефинираме таблица, която съдържа tr елемент, който представлява ред, в който е скрит атрибутът. Освен това дефинираме бутон, който при натискане извиква функцията Javascript toggleHidden което премахва скрития атрибут.

• отивам

Един от най -известните атрибути е отивам, което ви позволява да присвоите уникален идентификатор на елемент. Тези идентификатори обикновено се използват за оформяне на елемент или избор на елемент с Javascript. Нека разгледаме пример за това как използваме атрибута id за оформяне на елемент.

Пример

id = "w3clink"href =" http://w3c.org "> Уеб сайт на W3C

• проверка на правописа

Атрибут проверка на правописа се използва за определяне дали браузърът трябва да провери синтаксиса на някакво съдържание. Използването на този атрибут има смисъл само когато се прилага към елемент, който потребителят може да редактира.
Нека видим пример:

Пример
spellcheck = "true"> Това е някакъв грешен текст

• стил

Атрибут стил ни позволява да дефинираме CSS стил директно в елемент, виждаме:

Пример
style = "background: grey; color: white; padding: 10px">
Посетете сайта на Apress

• tabindex

Този атрибут ни позволява да контролираме реда на фокусите на елементите, когато имаме достъп до тях чрез табличния ключ.
Пример
Ям: tabindex = "1"/>

Град: tabindex = "- 1"/>

Държава: tabindex = "2"/>

tabindex = "3"/>

Успяхме да научим всичко за атрибутите и как те могат да бъдат приложени към елементи в нашия HTML документ. Това с цел разширяване на функционалността му по начин, който се адаптира към нуждите на нашия уебсайт.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка