Tag HTML <artigo>

Falaremos sobre Tag Articles neste post. Desejando que isso apoie as demandas do aprendizado.

A tag HTML <article> é usada para definir um conteúdo autônomo e independente que pode ser distribuído ou reutilizado em diferentes contextos. Ele representa uma seção de conteúdo que pode ser compartilhada ou distribuída em diferentes plataformas, como artigos de notícias, postagens de blog, descrições de produtos e análises.

Os três artigos a seguir são de conteúdo independente e independente:

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<body>
<article>
<h2>ServiceNow</h2>
<p>ServiceNow, Inc. engages in the provision of enterprise cloud computing solutions. The company was founded by Frederic B. Luddy in June 2004 and is headquartered in Santa Clara, CA.</p>
</article>
<article>
<h2>Tesla</h2>
<p>Tesla, Inc. engages in the design, development, manufacture, and sale of fully electric vehicles, energy generation and storage systems. Jeffrey B. Straubel founded the company Elon Reeve Musk, Martin Eberhard, and Marc Tarpenning on July 1, 2003, </p>
</article>
<article>
<h2>Netflix</h2>
<p>Netflix, Inc. is a streaming entertainment service company that provides subscription services for streaming movies and television episodes over the Internet and sending DVDs by mail. The company was founded by Marc Randolph and Wilmot Reed Hastings Jr. on August 29, 1997, </p>
</article>
</body></html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

O CSS pode ser aplicado para estilizar o elemento <article> no artigo da tag:

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
<head>
<style>
.all-firm {
margin: 0;padding: 3px;
background-color: lightblue;
}
.all-firm > h1, .firms{
margin: 20px;
padding: 10px;
}.firms{
background: white;
}.firms> h2,
p {
margin: 4px;
font-size: 90%;
}
</style>
</head>
<body>
<article class="all-firm">
<h1>Most Popular Compaines</h1>
<article class="firms">
<h2>ServiceNow</h2>
<p>ServiceNow, Inc. engages in the provision of enterprise cloud computing solutions. The company was founded by Frederic B. Luddy in June 2004 and is headquartered in Santa Clara, CA.</p>
</article>
<article class="firms">
<h2>Tesla</h2>
<p>Tesla, Inc. engages in the design, development, manufacture, and sale of fully electric vehicles, energy generation and storage systems. Jeffrey B. Straubel founded the company, Elon Reeve Musk, Martin Eberhard, and Marc Tarpenning on July 1, 2003, </p>
</article>
<article class="firms"> <h2>Netflix</h2>
<p>Netflix, Inc. is a streaming entertainment service company that provides subscription services for streaming movies and television episodes over the Internet and sending DVDs by mail. The company was founded by Marc Randolph and Wilmot Reed Hastings Jr. on August 29, 1997.</p>
</article>
</article></body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Aqui está outro exemplo da tag de artigo:

Example:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<body>
<article>
<h2>My Experience with the new iPhone</h2>
<p>I've been using the new iPhone for a few weeks now and overall, I am very impressed with it. The camera is amazing and the new features make my life easier.</p>
<h3>Pros</h3>
<ul>
<li>Great camera</li>
<li>Fast performance</li>
<li>Good battery life</li>
</ul>
<h3>Cons</h3>
<ul>
<li>Expensive</li>
<li>Limited storage capacity</li>
</ul>
<p>In conclusion, I highly recommend the new iPhone to anyone looking for a high-quality smartphone with great features. It's a bit expensive but it worth it.</p>
</article>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Índice-

Tag HTML <artigo>:

Usos e Definição

A tag Article <article> indica que o artigo é único e autossuficiente.

Um artigo deve ser compreensível e capaz de ser publicado separadamente do resto do site.

Aqui estão algumas fontes prováveis para o elemento <article> :

postagem no fórum
postagem no blog
Notícia

IMPORTANTE: Um navegador não exibe nenhum atributo específico para o elemento de artigo. Se você deseja estilizar o elemento do artigo, pode usar CSS (como mostrado no exemplo abaixo).

Atributos Globais

Em HTML, a tag <article> também aceita atributos globais .

Atributos do Evento

Em HTML, a tag <article> também aceita Atributos de evento .

Compatibilidade do navegador

Na tabela a seguir, os números indicam a versão do navegador compatível com o elemento no Tag Article .

Elemento
<artigo>	6.0	9,0	4.0	5,0	11.1

Configurações de CSS por padrão

A maioria dos navegadores exibe o elemento <article> usando os seguintes valores padrão para Tag Article:

article {
display: block;
}

Usos da tag de artigo HTML

Alguns dos principais usos da tag <article> incluem:

Cada postagem do blog pode ser agrupada em uma tag <article> para indicar que é um conteúdo independente que pode ser compartilhado ou distribuído independentemente.
A tag <article> é comumente usada para artigos de notícias para definir o conteúdo como uma unidade independente que pode ser facilmente compartilhada e distribuída.
Os sites de comércio eletrônico geralmente usam a tag <article> para definir as descrições do produto como peças de conteúdo independentes que podem ser compartilhadas em diferentes plataformas.
As resenhas de usuários podem ser agrupadas em uma tag <article> para indicar que são peças de conteúdo independentes que podem ser compartilhadas ou distribuídas.

Assine nosso boletim informativo abaixo, se quiser ficar conectado com as informações técnicas mais recentes neste site.

Nós valorizamos o seu feedback.

Tag HTML <artigo>

Example

Example

Example:

Usos e Definição

Atributos Globais

Atributos do Evento

Compatibilidade do navegador

Configurações de CSS por padrão

Usos da tag de artigo HTML

Sentindo entediado?