Какой конкретный тег используется для представления статьи в HTML?

Основные теги HTML Изучение

В этой статье мы увидим, как представить статью в HTML.

Тег <article> — один из новых элементов секционирования в HTML5. Тег HTML <article> используется для представления статьи. В частности, содержимое тега <article> не зависит от другого содержимого сайта (даже если оно может быть связано).

Другими словами, элемент статьи представляет компонент страницы, состоящий из автономной композиции в документе, странице или сайте. Например – в синдикации.

Потенциальным источником элемента статьи являются:

  1. Статья в журнале/газете
  2. запись в блоге
  3. Сообщение на форуме
  4. Пользователь отправил комментарий

Этот тег чаще всего используется в двух контекстах:

  • На странице с одним элементом контента можно использовать один элемент <article>, чтобы содержать основной контент и отделять его от остальной части страницы.
  • На странице с несколькими частями контента (страница индекса блога, страница результатов поиска, страница категории, лента новостей) можно использовать несколько элементов <article> для содержания каждой отдельной части контента.

В любом случае, он похож на элемент <div> и отображает стильную работу так же. Однако использование элемента <article> вместо <div> предоставляет больше семантической информации программам чтения с экрана, поисковым системам и сторонним приложениям.

Примечание. Этот тег не отображается в браузере как нечто особенное, для этого вам нужно использовать CSS.

Параметр CSS по умолчанию: большинство браузеров будут отображать элемент статьи со следующими значениями.

Синтаксис:

<article> {
    display:block;
}

Пример: в этом примере используется встроенный стиль в элементе статьи.

HTML

<!DOCTYPE html>
<html>
 
<body>
    <article style="
        width: 300px;
        border: 2px solid gray;
        padding: 10px;
        border-radius: 10px;
        margin: 5px;">
        <img src=
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png"
            alt="article tag"
            width="300" height="250"
            class="alignnone size-medium wp-image-560930" />
 
        <h1>GeeksforGeeks</h1>
 
        <p>
            What We Offer We provide a variety of 
            services for you to learn, thrive and 
            also have fun! Free Tutorials, Millions 
            of Articles, Live, Online and Classroom 
            Courses ,Frequent Coding Competitions, 
            Webinars by Industry Experts, Internship 
            opportunities and Job Opportunities.
        </p>
    </article>
</body>
 
</html>

Вывод:

Читайте также:  Инструменты передачи для лучшего сотрудничества между дизайнерами и разработчиками

в этом примере используется встроенный стиль в элементе стать

Оцените статью
bestprogrammer.ru
Добавить комментарий