/ / Lista de tags HTML básicas

Lista de tags HTML básicas

Se você decidir criar um site, então sem linguagema marcação de hipertexto html não o levará muito longe. Claro, há também CSS, PHP e outras linguagens de script, sem as quais um site completo, como você está acostumado a ver, não funcionará. No entanto, são as tags html básicas que permitirão que você estabeleça a base do seu site.

As marcas principais, sem as quais em lugar nenhum

Quando você abre qualquer documento html oupágina da web, você vê um grande número de tags diferentes. No entanto, se você olhar com atenção, a maioria deles se repete porque descreve os mesmos elementos. Por exemplo, as tags html principais incluem tags como tipo de documento <! DOCTYPE html>, <html>, <head>, <body>, <title>, <img>, <p> e outras.

Abrindo e fechando tags

Tipo de documento e declaração de documento html

Para indicar o tipo do documento atual, useo elemento <! DOCTYPE>. O navegador precisa disso para reconhecer como interpretar uma determinada página da web. Este elemento terá uma aparência diferente dependendo de qual versão de html você está usando. Em HTML5, terá o seguinte valor: <! DOCTYPE html>

Depois de ter indicado o tiporefere-se ao seu documento, a tag <html> deve ser usada. Como a maioria das outras tags, é pareado, ou seja, possui tags de abertura e fechamento. A diferença entre eles é que há uma barra "/" antes da tag de fechamento. Portanto, a tag html mais básica para a construção de um site seria assim:

<html>

...

</html>

Nesse caso, o resto do código estará localizado entre as tags de abertura e fechamento, que envolverão todo o conteúdo da página da web.

Notebook com código

tag <head>

Esta tag também é a tag html principal.Ele é escrito após <html> e também é pareado e contém principalmente os metadados da página da web. Esses dados não são exibidos na parte visível da página html (exceto para a tag <title>, que contém o título da página), mas são usados ​​pelo navegador para exibir o documento corretamente. Além disso, as informações localizadas nesta tag são usadas por vários mecanismos de pesquisa. Exemplo:

<head>

Metadados

<title> Título da página </title>

</head>

tag <body>

A tag principal para o site html, porque é elecontém todos os elementos visíveis da página - todo o texto, todas as imagens e outras informações. Basicamente, como a tag <html>, é um contêiner para outras tags. Exemplo:

<body>

Conteúdo visível da página da web

</body>

Títulos e parágrafos

Todas as tags acima são básicastags de idioma html. No entanto, existem muitos outros elementos na linguagem de marcação de hipertexto. Por exemplo, tags de parágrafo e título. Eles permitem que você estruture o texto, divida-o em parágrafos separados e destaque. Assim, para os parágrafos, é utilizada a tag <p>, que é uma tag par, entre os elementos de abertura e fechamento do qual existe algum texto. Exemplo:

<p>

Texto do parágrafo

Além de parágrafos, eles podem conter textocabeçalhos. No entanto, eles também alteram a aparência do texto contido, tornando-o maior e em negrito. Existem 6 tipos de títulos que variam em tamanho. Por exemplo, o título <h1> é o maior e o título <h6> é o menor.

Descrição dos cabeçalhos

Usando imagens

Nenhum site está completo sem imagens,fotos e fotos. Afinal, sem isso, as páginas da web seriam um texto seco, nada interessante de estudar. Para inserir qualquer imagem no site, a tag <img> é usada na linguagem de marcação de hipertexto. É importante observar que essa tag não está emparelhada, portanto, ela será escrita como <img /> no código.

Hiperlinks em texto

Muitas vezes, além de texto e várias imagens,os sites usam links. Eles podem redirecionar para um recurso de terceiros ou para outra página do seu site. Para indicar a presença de um link, a tag <a> é usada.

Homem segurando colchetes

O que são atributos?

Nós descobrimos um pouco sobre as tags principais.No entanto, a maioria das tags também possui atributos. Eles são escritos no elemento de abertura e consistem em duas partes. O primeiro é o nome do próprio atributo, o segundo é o valor desse atributo, que é escrito após o sinal "=" e está entre aspas.

Atributos básicos de tags html

Muitas tags possuem atributos.No entanto, para algumas tags, eles são opcionais, a menos que você queira modificar os elementos de alguma forma. Para outras tags, é necessária a presença de atributos, como, por exemplo, a tag <a> (para criar hiperlinks) e a tag <img /> (para adicionar imagens à página). A questão é que, se não especificarmos os atributos e seus valores para essas tags html principais, não os veremos na página do site.

Encontre fotos no laptop

Atributos para a tag <a>

Se você especificar no código o texto contido na tag<a>, então você não verá nada além deste texto na página da web. A própria tag, na verdade, fala apenas da intenção de criar um hiperlink e, para criá-lo realmente, você precisa de um atributo. Este atributo será href, e o valor deste atributo será um link específico para o recurso. Assim, se quisermos criar um link para o site fb.ru, será parecido com este:

<a href="fb.ru"> Link para fb.ru </a>

Portanto, todo o texto que está entre as tags <a> é um hiperlink, e o valor do atributo href, entre aspas duplas, será o endereço para o qual iremos clicando no texto.

Atributos Src para <img />

A situação é semelhante com a tag <img />.Se não especificarmos o atributo e seu valor junto com ele, as imagens não aparecerão na página da web. Como no caso da tag <a>, a presença da tag <img /> apenas diz que vamos inserir a foto em nosso código. No entanto, para que esta imagem apareça, você deve especificar o endereço desta imagem. Para isso, você precisará usar o atributo src, cujo valor será o endereço de uma imagem localizada em um recurso de terceiros ou em seu computador.

<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg />

O atributo alt para a tag <img />

Além disso, a tag <img /> tem mais umatributo. Não é considerado obrigatório, mas é reconhecido como recomendado para uso. Este atributo é o atributo de texto alternativo. O valor deste atributo será o texto correspondente à descrição da foto ou imagem. Este texto será exibido caso a imagem não carregue por algum motivo. Além disso, o uso desse atributo ajudará as pessoas com deficiência visual que usam leitores de tela. Assim, a tag <img />, junto com os dois atributos apresentados, terá a seguinte aparência:

<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg

alt = "descrição da imagem" />

Que outros atributos existem?

Há um grande número de atributos, elesa lista é tão grande quanto a lista das principais tags html. No entanto, há um atributo inerente a várias tags de uma vez. Isso é alinhar. Ele pode ser usado com a tag <img /> e também com a tag <p>. Sua essência é definir a posição de uma imagem ou texto na página. Os valores mais básicos para este atributo são direito e esquerdo, que denotam alinhamento à direita e à esquerda (respectivamente). Se você aplicá-lo a uma imagem, o código ficará assim:

<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg

alt = "descrição da imagem"

alinhar = "direita" />

Código na tela

Usando estilos

No entanto, deve-se notar que recentementealguns desses atributos não são usados ​​e, em vez disso, são utilizadas folhas de estilo em cascata (CSS). Para usar estilos em html, a tag <link> é escrita, que é projetada para conectar estilos e está localizada na tag <body>.

Gostei:
0
Posts populares
Desenvolvimento Espiritual
Alimento
sim