Distinguir entre elementos HTML e atributos HTML
- 24-07-2022
- Trung Minh
- 0 Comments
Neste artigo, aprenderemos os atributos HTML, além de ajudá-lo a distinguir os elementos HTML.
O que é HTML na postagem? Eu disse que HTML é essencialmente XML, então é composto de dois componentes principais, que são nomes de tags ( tagname ) e atributos ( attribute ). Para XML, o nome da tag pode ser definido por você mesmo, mas para HTML você deve usar o nome da tag encontrado na lista HTML Elements. Caso contrário, o navegador não entenderá qual tag você está usando para gerar o formato correto.
Então, qual é o atributo em HTML e qual é o elemento HTML , vamos descobrir imediatamente.
O que são elementos html?
O elemento html é a lista de tags html que o navegador suporta e também está na lista de tags html que a WWW especificou.
A lista de tags HTML é tão vasta que é difícil listar e usar instruções. Por isso, listo apenas algumas cartas, e nos próximos artigos apresentarei mais.
Mục lục
Cartão de nome:
O nome da tag HTML deve estar em sua própria lista, por exemplo:
- html
- corpo
- cabeça
- título
- meta
- h1
- h2
- h3
- h4
- h5
- h6
- p
- div
- tabela
- crianças
- td
- …
Não posso listá-los todos, mas vou abordá-los gradualmente nos próximos artigos.
Abrindo e fechando tags
Cada tag terá uma tag de abertura ( opentag ) e uma tag de fechamento ( closetag ). Por exemplo, com a tag div
, eu escreveria o seguinte:
<div>Nội dung bên trong</div>
Tag de fechamento ausente (tag de fechamento rápido)
Existem também algumas tags que estarão faltando a tag de fechamento, esse tipo é chamado de quick closetag, ou seja, só existe na tag de abertura, escreveremos o seguinte:
<tagname/>
Exemplo : tags de entrada, meta e link
<input /> <link /> <meta />
Cartões aninhados dentro de cartões
As tags HTML serão aninhadas juntas para formar um layout sólido, agora a tag filha estará completamente dentro da tag pai.
Exemplo :
<div> <input type="text" classname="Class Name" value=""/> </div>
Portanto, no processo de escrever o código HTML, você não deve esquecer a tag de fechamento , pois assim a interface será facilmente quebrada. Caso a tag de fechamento esteja faltando, usaremos a sintaxe quick closetag .
Atributos em HTML
Podemos pensar em cada tag HTML como um objeto. Agora o objeto HTML terá atributos para descrevê-lo. Por exemplo, a tag de input
tem os seguintes atributos:
- name : Usado para declarar o nome
- type : Usado para definir a categoria
- id : Usado para nomear a chave do cartão
- value : Usado para declarar o valor da tag
<input type="text" name="inputname" id="inputid" value=""/>
Ao executar, você verá uma caixa de texto aparecer e você poderá inserir dados nessa caixa.
Aspas simples e duplas
Os novatos provavelmente encontrarão esse erro. Cada atributo no HTML terá a estrutura name="value"
ou name='value'
. Se você usar aspas simples '
em torno do valor, o valor de valor não deve conter aspas simples. Por outro lado, se aspas duplas "
forem usadas, o valor não deve aparecer entre aspas duplas.
<input type="text" name="inputname" id="inputid" value="Hello 'freetuts.net'"/>
Então, mais tarde, quando você quiser exibir dados no banco de dados em uma linguagem de back-end como PHP, JSP, você precisa converter esses marcadores para outro formato.
Atributos Estendidos
Cada tag HTML aceita apenas determinados atributos próprios. Mas se você quiser definir outro atributo, tudo bem. No entanto, o navegador não entenderá essas propriedades, portanto, não fará nada. Portanto, geralmente combinaremos propriedades autodefinidas com Javascript para lidar com problemas. Aprenderemos sobre isso em outras lições.
Por exemplo : Na tag de entrada, não há atributo classname
, mas também podemos adicioná-lo, mas não funcionará em tempo de execução.
<input type="text" classname="Class Name" value=""/>
Epílogo
Então, neste artigo, mostrei como nomear tags HTML e seus próprios atributos. Esta lição ainda não entrou nas cartas comuns, então ainda é um pouco chata, mas você tem que entender as regras acima, então nas próximas lições você será fácil de aprender.