Преглед на нови елементи HTML5
От 1999 г., когато HTML 4.01 се превърна в стандарт, мрежата и използването на мрежата променят съществена мярка. W3C реши да промени основния синтаксис на HTML от Standard Generalized Markup Language (SGML) в XML, а също и изцяло различни езици за маркиране като Scalable Vector Graphics (SVG), XForms и MathML. В момента някои HTML 4.01 компоненти са остарели, никога не се използват или не се използват според очакванията. Всяка част от компонентите в HTML5 е изместена или прекомпилирана. HTML5 включва нови елементи за илюстриране на представяне, показване на цифрово съдържание, подобрено оформление на страниците и цялостна функционалност и няколко нови интерфейса за правилно справяне с днешните изисквания към интернет.
Има няколко нови елемента, въведени в HTML5, които предлагат някои допълнителни функции за разработване на желан и интерактивен сайт. Ние можем да създадем вашия код бързо и ефективно с помощта на такива компоненти. Поради липсата на структура много добре оформени HTML документи са по-трудни за работа, отколкото трябва да бъдат. Чрез оценка на мащабите на заглавките, трябва да разберем къде се насочва разкъсването на сегмента. Елементът div идентифицира страничните ленти, колонтитулите, заглавките, навигационните менюта и основните части на съдържанието.
Топ 10 нови HTML5 елемента
HTML5 предоставя нови елементи за подобряване на оформлението на документа.
1.
Елементът определя част от страницата, която включва отделна структура в документ, раздел или уебсайт и която се препоръчва да бъде широко разпространена или използваема. Това може да бъде групово публикуване на дневник или ежедневен доклад на хартиен носител, изпращане на онлайн бюлетин, забележка, изпратена от клиент, или друг обект без вещества.
Пример:
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
изход:
- Запишете горния код във файл с разширение .html.
- Пуснете html файла в браузър и ще получите изхода, както е показано на изображението по-долу.
2.
Елементът показва индивидуално съдържание в много голяма степен като категоризации, карти, изображения, статии с кодове и много други.
Пример:
Figure Element
EDUCBA е водещ световен доставчик на обучение, основано на умения, отговарящо на нуждите 500 000+ членове в 40+ страни.
изход:
Горният код ще доведе до резултата, както е показано на изображението по-долу,
3.
Елементът се използва за добавяне на описание на изображението.
Пример:
Figure Caption Element
EDUCBA е водещ световен доставчик на обучение, основано на умения, отговарящо на нуждите 500 000+ членове в 40+ страни.
EDUCBA (Corporate Bridge Consultancy Pvt Ltd)
изход:
Горният код показва резултата, както е показано на изображението по-долу,
4.
Елементът се използва за определяне на заглавката на документ или раздел на страницата. Можете да дефинирате повече от една заглавка в един документ.
Пример:
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Съдържанието на документа отива тук …
изход:
Горният код показва резултата, както е показано на изображението по-долу,
5.
Елементът се използва за уточняване на информация като информация за автора, информация за авторското право, контакт, връзки към свързани документи, карта на сайта и много други.
Пример:
Footer Element
Copyright © 2019 www.educba.com
Контакт:
изход:
Горният код показва резултата, както е показано на изображението по-долу,
6.
Елементът се използва за показване на основната, т.е. важна информация на документ.
Пример:
Main Element
Информация за заглавката
Основна информация
EDUCBA
EDUCBA е водещ световен доставчик на обучение, основано на умения …
Информация за долния колонтитул
изход:
Горният код ще доведе до резултата, както е показано на изображението по-долу,
7.
Елементът се използва за подчертаване или маркиране на текста с цвета на фона, който привлича потребителя за определен текст в документа.
Пример:
Mark Element
EDUCBA е водещ световен доставчик на обучение, основано на умения, отговарящо на нуждите 500 000+ членове в 40+ страни.
изход:
Горният код показва резултата, както е показано на изображението по-долу,
8.
Елементът се използва за определяне на навигационните връзки на страницата. Тези връзки предоставят връзки към други страници в документ.
Пример:
Nav Element
HTML |
CSS |
JAVA |
PHP |
PYTHON
изход:
Горният код ще доведе до резултата, както е показано на изображението по-долу,
9.
Елементът се използва за определяне на самостоятелния раздел или конкретен регион в документа.
Пример:
Section Element
Main Article
Section Element
Main Article
Section Element
Main Article
Тук ще бъде показано съдържанието на главния заглавие …
Раздел първи
Съдържанието на първия раздел ще бъде показано …
Раздел втори
Ще се покаже съдържанието на втория раздел …
изход:
Горният код показва резултата, както е показано на изображението по-долу,
10.
Маркерът е подчаст на маркера, който предоставя текста, който може да бъде показан или скрит, когато потребителят кликне върху заглавието.
Пример:
Summary Element
EDUCBA - Corporate Bridge Consultancy Pvt Ltd
Това е водещ световен доставчик на обучение, основано на умения, отговарящо на нуждите 500 000+ членове в 40+ страни.
изход:
Когато стартирате горния код, той ще покаже резултата, както е показано по-долу,
Както е показано на изображението, щракнете върху заглавието, то ще покаже скрития текст, както е показано на изображението по-долу,
заключение
Досега видяхме как нови елементи HTML5 са полезни за различни задачи при създаването на уебсайта. Тези нови елементи четат документа по-точно и до стандартен начин и разработват по-сложни и ефективни уеб приложения. Новите HTML5 елементи дават някои допълнителни допълнителни функции за генериране на интерактивни уебсайтове.
Препоръчителни статии
Това е ръководство за Html5 Нови елементи. Тук обсъждаме топ 10 нови елемента на Html5 за подобряване на оформлението на документа. Можете също да разгледате следните статии, за да научите повече -
- Корекция на цвета в след ефекти
- Топ 6 версии на Html
- Html5 срещу Html4
- XHTML срещу HTML5
- Какво е мост?
- HTML5 тагове | Топ 4 тагове на HTML5