HTML5 - Criação de documentos e atributos

HTML5 - Criação de documentos e atributos

Esta é a parte menos interessante, mas sem dúvida uma das mais críticas. Cada documento HTML usa pelo menos parte desses elementos e às vezes todos eles, então não faz mal sabermos como usá-los apropriadamente para a criação de documentos HTML5 correto e geral.
Elementos de tipo de documento
Vamos começar com os elementos do tipo documento. Estes são os blocos que moldam nosso documento HTML e define um contexto inicial para o navegador.
O elemento doctype
O elemento doctype é único em sua categoria. É uma boa prática iniciar cada documento HTML que criamos com um elemento do tipo doctype. Este é o elemento que informa ao navegador que ele estará lidando com HTML.
A maioria dos navegadores ainda exibirá nosso conteúdo corretamente se omitirmos o doctype, mas não é uma prática confiar que o navegador se comportará dessa maneira.
A sintaxe correta para aplicar um elemento do tipo doctype É o seguinte:
O elemento html
Este elemento é geralmente chamado de elemento raiz e indica o início do HTML em nosso documento.
A sintaxe é a seguinte:


Conteúdo e elementos aqui

O elemento principal
O elemento cabeça Ele contém todos os metadados do documento. Em HTML, os metadados fornecem ao navegador informações sobre o conteúdo e a marcação do documento, mas, além disso, podemos incluir scripts e referências a recursos externos, como folhas de estilo CSS.
A sintaxe é a seguinte dentro do documento:



Olá


O elemento do corpo
Este elemento encapsula o conteúdo de um documento HTML, é o oposto do elemento head que encapsula os metadados e as informações do documento. O elemento corpo ele sempre segue o elemento head, o que significa que é o segundo filho na estrutura do elemento html raiz.
Vamos ver sua sintaxe:

Exemplo

Eu gosto maçãs e laranjas.

Elementos de tipo de metadados
Os elementos de tipo de metadados nos permitem fornecer informações sobre o documento HTML. Eles não se contentam em si mesmos, mas fornecem informações sobre o conteúdo que os seguirá. Elementos de metadados de tipo são adicionados ao elemento principal.
Definir um título para o nosso documento
O elemento título defina um título ou nome para o nosso documento. Os navegadores geralmente exibem o conteúdo desse elemento na parte superior da janela ou guia.
Vamos ver como o adicionamos à nossa estrutura:

Exemplo

Eu gosto maçãs e laranjas.

Definir a base para URLs relativos
O elemento base corrige um Url base, na qual quais links relativos, contidos no documento HTML será resolvido. Um link relativo é aquele que omite o protocolo, o host e a porta do URL e é avaliado em relação a outro URL. O elemento base também especifica como os links são abertos quando um usuário clica neles e como o navegador age depois que um formulário é inserido.
Tendo visto os elementos essenciais para o documento, podemos apenas completar com o resto dos elementos que funcionam para os metadados e, assim, construir um documento HTML correto e que pode ser interpretado por qualquer navegador da melhor maneira.
Atributos

• dir

Atributo dir especifica a direção do texto contido em um elemento. Os valores suportados para isso são:

• ltr (texto da esquerda para a direita)
• rtl (texto da direita para a esquerda)

Vejamos um exemplo simples de sua aplicação:

Exemplo

dir = "rtl"> Isso é da direita para a esquerda

dir = "ltr">Isso é da esquerda para a direita

• menu contextual

Este atributo permite definir o contexto dos elementos dos menus. Eles aparecem na tela quando o usuário os dispara por assim dizer, por exemplo, quando clicamos com o botão direito em um elemento.

• arrastável

Atributo arrastável faz parte do suporte HTML5 para arraste e solte e é usado para indicar quando um elemento pode ser arrastado.

• ponto de largada

Atributo ponto de largada faz parte do suporte HTML5 para arraste e solte y é a contraparte do atributo arrastável que foi explicado acima.

• escondido

Atributo escondido É um atributo booleano que indica que um elemento não é relevante, portanto não estará visualmente presente no documento. Os navegadores interpretam esse atributo de forma a ocultar o item da visualização do usuário. Vamos ver um exemplo disso:

Exemplo
Alternancia



escondido>

inhame	Cidade
Adam Freeman	Londres
Joe ferreiro	Nova york
Anne Jones	Paris

Neste exemplo, definimos uma tabela que contém um elemento tr que representa uma linha na qual o atributo oculto está presente. Além disso, definimos um botão que, quando pressionado, invoca a função Javascript toggleHidden que remove o atributo oculto.

• ir

Um dos atributos mais conhecidos é ir, que permite atribuir um identificador exclusivo a um elemento. Esses identificadores são comumente usados ​​para estilizar um elemento ou selecionar um elemento com Javascript. Vejamos um exemplo de como usamos o atributo id para estilizar um elemento.

Exemplo

id = "w3clink"href =" http://w3c.org "> site W3C

• verificação ortográfica

Atributo verificação ortográfica é usado para especificar se o navegador deve verificar a sintaxe de algum conteúdo. O uso deste atributo só faz sentido quando é aplicado a um elemento que o usuário pode editar.
Vejamos um exemplo:

Exemplo
verificação ortográfica = "verdadeiro"> Este é um texto incorreto

• estilo

Atributo estilo nos permite definir um estilo CSS diretamente em um elemento, vemos:

Exemplo
style = "background: grey; color: white; padding: 10px">
Visite o site da Apress

• tabindex

Este atributo permite controlar a ordem dos focos dos elementos quando os acessamos por meio da chave tabular.
Exemplo
Inhame: tabindex = "1"/>

Cidade: tabindex = "- 1"/>

País: tabindex = "2"/>

tabindex = "3"/>

Pudemos aprender tudo sobre atributos e como eles podem ser aplicados a elementos em nosso documento HTML. Isso a fim de estender sua funcionalidade de uma forma que se adapte às necessidades do nosso site.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo