Понимание основных HTML-тегов — фундаментальный навык в веб-разработке. Если веб-сайт представляет собой дом, каждый HTML-тег подобен кирпичу, придающему ему форму. Точно так же, как вы не можете понять, как построить дом, не понимая, как построить структуру, вы не можете понять, как создавать хорошие веб-сайты, не разбираясь в HTML.
Поскольку веб-разработка — одна из лучших технических работ 2019 года , освоение основных HTML-тегов — идеальное место для начала обучения.
Что такое HTML-теги?
Вы читаете эту статью на веб-сайте. Вы когда-нибудь задумывались, как компьютер знает, какой контент отображать и как его отображать? Что делает некоторые тексты полужирными, курсивными, а некоторые содержат ссылку на другую веб-страницу?
Часть ответа — HTML-теги. Когда-то HTML составлял большую часть кода в Интернете. Хотя это изменилось, HTML по-прежнему играет важную роль в получении контента в Интернете.
HTML — это язык разметки. После того, как человек напишет контент, ему нужно будет разметить его с помощью HTML, чтобы отличить заголовок от абзацев. В большинстве случаев это делается путём вставки тегов по всему контенту.
Что такое основные HTML-теги?
Тег HTML — это специальное ключевое слово, заключённое в острые скобки <и>, например: <body>. Теги почти всегда идут парами, с одним начальным тегом и одним конечным тегом. Разница в том, что закрывающие теги имеют дополнительную косую черту внутри скобок:
<example> Первый тег — это начало, а второй тег — конец. </example>
Вот 10 распространённых HTML-тегов, о которых должен знать любой веб-разработчик, и они особенно важны для тех, кто только начинает изучать HTML .
- <html> </html>
Это тег корневого элемента. Это означает, что всё, что находится между этими скобками, содержит код HTML.
- <head> </head>
Этот тег отличает заголовок веб-страницы от содержимого. Здесь вы помещаете код Javascript или даёте «мета» информацию о веб-сайте.
- <title> </title>
Вы заметили, что вкладки браузера содержат текст, который даёт вам обзор веб-сайта? Этот текст записывается как заголовок сайта с этим тегом.
- <body> </body>
Тег body определяет фактическое содержимое веб-сайта.
- <h1> </h1>
Это тег заголовка, который создаёт заголовок, увеличивая текст и делая его жирным. Есть шесть тегов заголовков: h1, h2, h3, h4, h5, h6, в порядке убывания размера.
- <p> </p>
Этот тег указывает, что данный раздел должен быть отдельным абзацем. Браузеры обычно вставляют пробелы между абзацами, чтобы текст было легче читать.
- <a> </a>
Этот тег позволяет нам создать ссылку с её атрибутом href, например:
<a href=bestprogrammer.ru> Нажмите здесь </a>.
- <img> </img>
Тег image — это то, как вы вставляете изображения на веб-страницу.
- <div> </div>
Теги Div группируют несколько частей контента в один контейнер, что позволяет вам делать такие вещи, как применять отдельные стили только к этому контенту.
- <span> </span>
Span похож на уменьшенную версию div, используемую для стилизации встроенного содержимого или взаимодействия с ним. Вы можете добавить всего пару слов к определённому классу (<span class = ‘endorsement’> Text </span>), который, опять же, отлично подходит для стилизации и повышения отзывчивости контента.
Этого должно быть более чем достаточно, чтобы вы начали создавать фантастические веб-сайты!
ЧИТАЙТЕ ТАКЖЕ:
- Лучшие бесплатные и премиум редакторы HTML — Mac, Windows и Linux.
- Как связать CSS с HTML, чтобы сделать разметку более читаемой.
- Раскрывающийся список HTML.