Что такое HTML5?
HTML - это язык гипертекстовой разметки. HTML - это язык разметки, используемый для отображения текста на веб-страницах. 5 в конце просто означает, что это версия, которую мы будем изучать, есть также HTML1.0, HTML2.0, XHTML и так далее. Но HTML5 - последняя версия, и мы будем это изучать.
Почему я должен изучать HTML?
HTML - действительно хороший язык для начала изучения, особенно если вы хотите создавать веб-сайты или стать интерфейсным веб-разработчиком / дизайнером. Однако вы не можете получить работу, используя только HTML (может быть, если вам повезет). HTML - это просто текст веб-страницы, вам также необходимо изучить CSS3 (для стилизации) и JavaScript (чтобы сделать веб-страницу интерактивной). Итак, сначала изучение HTML - это хорошее начало, а после того, как вы узнаете об HTML, вы можете приступить к изучению других языков.
Как я уже говорил ранее, HTML означает язык гипертекстовой разметки, и это язык разметки, который НЕ ЯЗЫК ПРОГРАММИРОВАНИЯ. Итак, начнем с основ.
- HTML был создан Тимом Бернерсом Ли в конце 1991 года.
- HTML - это стандартный язык разметки, используемый для отображения текста на веб-страницах.
- HTML использует простые теги, которые легко использовать
- HTML действительно легко выучить
Чтобы начать изучение HTML5, вам потребуется следующее:
Компьютер. Компьютер - это машина, которая может следовать набору инструкций для выполнения определенного действия. Вы также можете давать инструкции компьютеру.
Веб-браузер. Веб-браузер - это программное обеспечение, используемое для поиска, извлечения и отображения контента во всемирной паутине, включая веб-страницы, файлы изображений, видеофайлы и другие файлы. Примеры некоторых веб-браузеров: Google Chrome, Mozilla Firefox, Microsoft Edge, Opera и т. Д. Я бы НЕ рекомендовал использовать Internet Explorer.
Текстовый редактор: Как сказано в названии, текстовый редактор редактирует текст. Если вы используете Windows, вы можете использовать текстовый редактор по умолчанию: блокнот, а если вы используете Mac, вы можете использовать текст по умолчанию: text-edit. Вы также можете загрузить профессиональные текстовые редакторы, такие как Visual Studio Code, Sublime Text и т. Д.
Итак, теперь у вас есть то, что вам нужно, давайте начнем изучать HTML.
HTML использует теги для структурирования веб-страницы, большинство начальных тегов имеют закрывающий тег, за исключением некоторых тегов. Каждый тег служит разной цели. Мы не будем изучать все в HTML, мы только создадим прочный фундамент.
Поэтому посмотрите на теги, чтобы узнать, что они делают и как их можно использовать. Изображения в конце также являются важной частью, так что посмотрите и на них.
Теги:
‹! DOCTYPE html›: должен начинаться с этого тега, и это один из немногих тегов, у которых нет конечного тега. Этот тег сообщает браузеру, что это документ HTML.
‹html›: этот тег входит в состав тега! DOCTYPE и сообщает компьютеру и браузеру, что это начало HTML-кода.
‹/html›: это конечный тег для тега ‹html›, большинство начальных тегов должны иметь закрывающий тег. Обратите внимание на косую черту, что важно, она показывает разницу между начальным и конечным тегами.
‹head›: начало тега заголовка, элемент заголовка предназначен для связывания внешних документов, доступа к метаданным и отображения заголовков. Теги заголовка НЕ для отображения текста на веб-странице !!!
‹title›: начальный тег для заголовка на веб-странице.
‹/title›: конечный тег для начального тега.
‹/head›: в конце тега заголовка была косая черта, чтобы компьютер знал, что это конечный тег. Все метаданные, ссылки на внешние документы должны располагаться между начальным и конечным тегами.
‹body›: начальный тег основного текста предназначен для отображения текста, а также для отображения таблиц, списков, абзацев, заголовков и т. д.
‹/body›: конечный тег тела показывает компьютеру конец этого элемента, все элементы, которые необходимо отобразить, должны находиться между начальным и конечным тегами тела.
‹p›: этот элемент представляет собой абзац. Сюда можно добавить текст размером с абзац.
‹/p›: это конечный тег для тега абзаца, и все содержимое должно располагаться между начальным и конечным тегами.
‹h1›: это начальный тег для первого заголовка, который также является самым большим.
‹/h1›: это конечный тег для первого тега заголовка, и все содержимое должно располагаться между начальным и конечным тегами.
‹h2›: это второй и второй по величине тег заголовка.
‹/h2›: это конечный тег для двух тегов заголовка, и все содержимое должно располагаться между начальным и конечным тегами.
‹h3›: это третий тег заголовка и третий по величине.
‹/h3›: это конечный тег для трех тегов заголовка, и все содержимое должно располагаться между начальным и конечным тегами.
Все заголовки до ‹h6› или шестой.
Итак, вы уже изучили несколько элементов: элемент HTML, элемент body, элемент head и т. Д. Откройте новый файл в текстовом редакторе, сохраните файл как файл index.html. «.Html» в конце является расширением и сообщает компьютеру открыть файл в веб-браузере. Наберите весь код и поэкспериментируйте с ним. Когда вы закончите, перейдите к своим файлам и откройте HTML-файл в веб-браузере. Теперь вы должны увидеть все, что набрали (кроме тегов).
Посмотрите на изображения ниже, чтобы увидеть, как структурирован код и как он отображается на веб-странице.
На изображении выше показано, как структурирован код. Обратите внимание, что заголовок можно разместить только в заголовке, а элементы абзаца и заголовка можно разместить только в теле. Все теги в приведенном выше коде также имеют закрывающий тег.
На изображении выше вы можете увидеть, что код отображается на вашей веб-странице. Все инструменты браузера (закладки и расширения). Скажем, вы добавили еще один фрагмент кода в свой HTML-файл, вам нужно сохранить файл и перезагрузить веб-страницу, чтобы увидеть результат.
Мы рассмотрели, как структурировать базовую HTML-страницу, сохранить файл и просмотреть его в браузере. Тем не менее, мне еще предстоит многому научиться, что я не могу собрать все это в одном месте, поэтому я научил вас только некоторым вещам в HTML. Я помог тебе построить фундамент, теперь тебе нужно идти и строить остальную часть дома. Ниже я привожу ссылки на несколько ресурсов, которые помогут вам изучить HTML, CSS, JavaScript и любой другой компьютерный язык, который вы хотите выучить.
Изучите веб-разработку / дизайн: www.w3schools.com
Я надеюсь, что вы узнали кое-что из этого урока, и я надеюсь, что вы узнаете гораздо больше по ходу дела.
