Uma análise aprofundada da diferença entre artigo e seção em HTML5

Os blocos de conteúdo referem-se a unidades que dividem logicamente as páginas HTML. Para sites de páginas, cada parte, como menu de navegação, texto do artigo e comentários do artigo, pode ser chamada de bloco de conteúdo.

O elemento article representa conteúdo completo e independente em um documento, página ou aplicativo que pode ser referenciado externamente de forma independente. Pode ser um artigo de blog ou jornal, uma postagem em um fórum, um comentário de usuário ou um plug-in independente, ou qualquer outro conteúdo independente. Além do conteúdo, um elemento de artigo geralmente possui seu próprio título (normalmente colocado dentro de um elemento de cabeçalho) e às vezes suas próprias notas de rodapé.

 <article> <header> <h1>Título</h1> <p>Data de publicação: <time pubdate=pubdate>2010/10/10</time></p> </header> <p>Como usar o artigo </p> <footer> <p><small>Copyright @ yiiyaa.net Todos os direitos reservados</samll></p> </footer> </article>

Nota: Os elementos do artigo podem ser aninhados e, em princípio, o conteúdo interno precisa estar associado ao conteúdo externo. Por exemplo, em uma postagem de blog, os comentários sobre o artigo podem ser aninhados usando elementos de artigo; o elemento de artigo usado para apresentar os comentários é incluído no elemento de artigo que representa o conteúdo geral.

O código aninhado é o seguinte:

 <article> <header> <h1>Como usar o elemento article</h1> <p>Data de publicação: <time pubdate=pubdate>2010/10/10</time></p> </header> <p >Esta tag exibe o conteúdo principal de todo o artigo, e o elemento de seção abaixo contém os comentários sobre o artigo</p> <section> <h2>Comentários</h2> <article> <header> <h3>Publicado por: maizi</h3> <p><time pubdate datetime=2016-6-14>1 hora atrás</time></p> </header> <p>Este artigo é muito bom, dê é um sinal de positivo! </p> </article> <article> <header> <h3>Publicado por: Xiaoni</h3> <p><time pubdate datetime=2016-6-14T:21-26:00>1 hora atrás</ time></p> </header> <p>Este artigo é muito bom, explica o artigo em detalhes</p> </article> </section></article>

O conteúdo da amostra é dividido em várias partes: o título do artigo é colocado no elemento de cabeçalho, o texto do artigo é colocado no elemento p após o elemento de cabeçalho e, em seguida, o elemento de seção distingue o texto dos comentários (é um elemento de bloqueio). usado para dividir o conteúdo da página), na seção O conteúdo do comentário é incorporado no elemento. O comentário de cada pessoa no comentário é relativamente independente e completo, portanto, um elemento de artigo é usado para todos eles. O elemento de artigo do comentário pode ser dividido em títulos e comentários. é colocado no elemento de cabeçalho e no elemento p, respectivamente.

1. O elemento de seção é usado para dividir o conteúdo da página do site ou aplicativo. A função do elemento de seção é dividir o conteúdo da página em seções, ou dividir o artigo em seções;

2. Um elemento de seção geralmente consiste em conteúdo e seu título. Geralmente não é recomendado usar o elemento de seção para conteúdo que não possui título.

3. O elemento de seção não é um elemento contêiner comum quando um conteúdo precisa ser estilizado diretamente ou um comportamento definido por meio de um script, é recomendado usar p em vez do elemento de seção;

4. Se os elementos article, nav e apart atenderem a determinadas condições, não use o elemento section para defini-los;

5. O conteúdo do elemento de seção pode ser armazenado separadamente no banco de dados ou enviado para um documento do Word.

 <section> <h1>O </h1> título do elemento de seção <p>A parte do tópico do bloco de seção</p> </section>

No HTML5, você pode incluir todas as partes subordinadas da página, como barras de navegação, menus, avisos de direitos autorais, etc., em uma página unificada para que possam ser decoradas usando estilos CSS. Finalmente, os tabus sobre o uso do elemento de seção são resumidos da seguinte forma:

1) Não use o elemento de seção como um contêiner de página estilizado, esse é o trabalho do elemento p.

2) Se o elemento article, o elemento side ou o elemento nav forem mais adequados para uso, não use o elemento section.

3) Não use o elemento de seção para blocos de conteúdo sem títulos.

Tanto foi dito acima, qual a diferença entre os dois? Na verdade, em HTML5, o elemento article pode ser considerado um tipo especial de elemento de seção, que enfatiza mais a independência do que o elemento de seção. Ou seja, o elemento section enfatiza a segmentação ou fragmentação, enquanto o artigo enfatiza a independência. Especificamente, se um conteúdo for relativamente independente e completo, você deve usar o elemento article, mas se quiser dividir um conteúdo em vários parágrafos, você deve usar o elemento section. Além disso, no HTML5, o elemento p se torna um contêiner. Ao usar estilos CSS, um estilo CSS geral pode ser aplicado a esse contêiner.

O texto acima é a diferença entre artigo e seção em HTML5 introduzida pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe-me uma mensagem e o editor responderá a tempo. Gostaria também de agradecer a todos pelo apoio ao site de artes marciais VeVb!