HTML

Descrição

A Linguagem de Marcação de Hipertexto (HTML - HyperText Markup Language) é uma linguagem de marcação utilizada para produzir páginas na Web que são interpretadas pelos navegadores. Os documentos em HTML são arquivos de texto simples que podem ser criados e editados em qualquer editor de textos comum, como o Bloco de Notas do Windows.
Paulo Sérgio
FlashCards por Paulo Sérgio, atualizado more than 1 year ago
Paulo Sérgio
Criado por Paulo Sérgio mais de 6 anos atrás
72
0

Resumo de Recurso

Questão Responda
HTML A Linguagem de Marcação de Hipertexto (HTML - HyperText Markup Language) é uma linguagem de marcação utilizada para produzir páginas na Web que são interpretadas pelos navegadores. Os documentos em HTML são arquivos de texto simples que podem ser criados e editados em qualquer editor de textos comum, como o Bloco de Notas do Windows.
<meta charset="UTF-8"> Quando gravamos arquivos, há diferentes formatos de armazenar os caracteres em bytes, O Chrome, por padrão, tentará lê-lo em uma codificação conhecida por latin1. Se gravamos nosso arquivo em outro formato, precisamos colocar essa informação no HTML que possui uma série de tags que nem mesmo marcam o texto, e sim dão meta informações ao arquivo.
<meta name="description" content="Free Web tutorials"> Definir uma descrição da sua página da Web:
<meta name="author" content="John Doe"> Definir o autor de uma página
<meta http-equiv="refresh" content="30"> Atualize o documento a cada 30 segundos
<meta name="viewport" content="width=device-width, initial-scale=1.0"> Configurando a viewport para tornar o seu site bom em todos os dispositivos
Metadados são dados (informações) sobre dados. A marca <meta> fornece metadados sobre o documento HTML. Os metadados não serão exibidos na página, mas serão analisáveis ​​por máquina. Os elementos meta normalmente são usados ​​para especificar a descrição da página, as palavras-chave, o autor do documento, a última modificação e outros metadados. Os metadados podem ser usados ​​por navegadores (como exibir conteúdo ou recarregar página), motores de busca (palavras-chave) ou outros serviços da Web. O HTML5 introduziu um método para permitir que os web designers assumissem o controle sobre a viewport (a área visível do usuário de uma página da web), através da marca <meta> (veja o exemplo "Configuração do Viewport" abaixo).
<! DOCTYPE> A declaração <! DOCTYPE> deve ser a primeira coisa no seu documento HTML, antes da tag <html>. A declaração <! DOCTYPE> não é uma tag HTML; é uma instrução para o navegador web sobre a versão do HTML em que a página está escrita.
<! --...--> A etiqueta de comentário é usada para inserir comentários no código-fonte. Os comentários não são exibidos nos navegadores.
<a> A tag <a> define um hiperlink, que é usado para vincular de uma página para outra.
<abbr> A marca <abbr> define uma abreviatura ou um acrônimo, como "Sr.", "Dec.", "ASAP", "ATM". Dica: uma abreviatura e um acrônimo são versões abreviadas de outra coisa. Ambos são frequentemente representados como uma série de letras. As abreviaturas de marcação podem fornecer informações úteis para navegadores, sistemas de tradução e mecanismos de pesquisa.
<address></address> A marca <endereço> define as informações de contato para o autor / proprietário de um documento ou um artigo. Se o elemento <address> estiver dentro do elemento <body>, ele representa as informações de contato para o documento. Se o elemento <endereço> estiver dentro de um elemento <artigo>, ele representa as informações de contato para esse artigo. O texto no elemento <endereço> normalmente é traduzido em itálico . A maioria dos navegadores irá adicionar uma quebra de linha antes e depois do elemento de endereço.
<map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus"> </map> A tag <área> define uma área dentro de um mapa de imagem (um mapa de imagem é uma imagem com áreas clicáveis). O elemento <area> está sempre aninhado dentro de uma marca <map>. Nota: O atributo usemap na marca <img> está associado ao atributo do nome do elemento <map> e cria uma relação entre a imagem e o mapa.
<article></article> A tag <article> especifica conteúdo autônomo independente. Um artigo deve ter sentido por conta própria e deve ser possível distribuí-lo independentemente do resto do site. Fontes potenciais para o elemento <article>: Postagem do fórum Postagem do blog Notícia Comente
<body style="background-color:powderblue;"> A propriedade background-color define a cor de fundo para um elemento HTML.
<h1 style="color:blue;">This is a heading</h1> A propriedade de cor define a cor do texto para um elemento HTML:
<h1 style="font-family:verdana;">This is a heading</h1> A propriedade font-family define a fonte a ser usada para um elemento HTML
<h1 style="font-size:300%;">This is a heading</h1> A propriedade font-size define o tamanho do texto para um elemento HTML
<h1 style="text-align:center;">Centered Heading</h1> A propriedade text-align define o alinhamento de texto horizontal para um elemento HTML
<b> texto em negrito
<strong> Texto importante
<i> texto itálico
<em> texto enfatizado
<marca> texto marcado
<small> Texto pequeno
<q> O elemento HTML <q> define uma pequena cotação.
<blockquote> O elemento HTML <blockquote> define uma seção que é citada de outra fonte.
Você pode definir a cor das bordas: <h1 style="border:2px solid Tomato;">Hello World</h1>
. class
# id
(9, 100%, 64%, 0.5) hsl ( tonalidade , saturação , leveza )
(255, 99, 71, 0.5) rgba ( vermelho, verde , azul, alfa )
#ff6347 hex m HTML, uma cor pode ser especificada usando um valor hexadecimal na forma:
Tipos de CSS Inline - usando o atributo de estilo em elementos HTML Interno - usando um elemento <style> na seção <head> Externo - usando um arquivo CSS externo
Os links HTML são hiperlinks <a href="url">link text</a>
Em HTML, as imagens são definidas com a marca <img> <img src="img_chania.jpg" alt="Flowers in Chania">
Use a marca <map> <img src="workplace.jpg" alt="Workplace" usemap="#workmap"> <map name="workmap"> <area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm"> <area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm"> <area shape="circle" coords="337,300,44" alt="Coffee" href="coffee.htm"> </map>
Para adicionar uma imagem de fundo em uma página da Web, <body style="background-image:url('clouds.jpg')">
Mostre uma imagem se a janela do navegador (viewport) for um mínimo de 650 pixels, e outra imagem se não, mas maior que 465 pixels. <picture> <source media="(min-width: 650px)" srcset="img_pink_flowers.jpg"> <source media="(min-width: 465px)" srcset="img_white_flower.jpg"> <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;"> </picture>
<table> Uma tabela HTML é definida com a tag <table>
<tr> Cada linha de tabela é definida com a marca <tr>
<th> Um cabeçalho da tabela é definido com a tag <th> Por padrão, os cabeçalhos das tabelas são negrito e centrado
<td> Um dado de tabela / célula é definido com a tag <td>
<caption> Use o elemento HTML <caption> para definir uma legenda da tabela
text-align Use a propriedade CSS text-align para alinhar o texto da célula
colspan Use o atributo colspan para criar uma célula várias colunas <table style="width:100%"> <tr> <th>Name</th> <th colspan="2">Telephone</th> </tr> <tr> <td>Bill Gates</td> <td>55577854</td> <td>55577855</td> </tr> </table>
rowspan Para tornar uma célula mais de uma linha, use o atributo rowspan : <table style="width:100%"> <tr> <th>Name:</th> <td>Bill Gates</td> </tr> <tr> <th rowspan="2">Telephone:</th> <td>55577854</td> </tr> <tr> <td>55577855</td> </tr> </table>
<colgroup> e <col> Especifica um grupo de uma ou mais colunas em uma tabela para formatação <table> <colgroup> <col span="2" style="background-color:red"> <col style="background-color:yellow"> </colgroup> <tr> <th>ISBN</th> <th>Title</th> <th>Price</th> </tr> <tr> <td>3476896</td> <td>My first HTML</td> <td>$53</td> </tr> </table>
<thead> A tag <thead> é usada para agrupar conteúdo de cabeçalho em uma tabela HTML. thead { display: table-header-group; vertical-align: middle; border-color: inherit; }
<tbody> A marca <tbody> é usada para agrupar o conteúdo do corpo em uma tabela HTML. tbody { display: table-row-group; vertical-align: middle; border-color: inherit; }
<tfoot> A marca <tfoot> é usada para agrupar o conteúdo do rodapé em uma tabela HTML. tfoot { display: table-footer-group; vertical-align: middle; border-color: inherit; }
<ul> Uma lista não ordenada começa com a tag <ul> Cada item de lista começa com a marca <li> <ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul>
<ol> Uma lista ordenada começa com a marca <ol> . Cada item de lista começa com a marca <li> <ol> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol>
<div> O elemento <div> é um elemento de nível de bloco.
<form> Um formulário HTML com dois campos de entrada e um botão enviar: <form action="/action_page.php" method="get"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <input type="submit" value="Submit"> </form>
<input> A tag <input> especifica um campo de entrada onde o usuário pode inserir dados.
<textarea> A tag <textarea> define um controle de entrada de texto de várias linhas.
<button> A marca <button> define um botão clicável.
<select> O elemento <select> é usado para criar uma lista suspensa. <select> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </select>
<option> A tag <option> define uma opção em uma lista de seleção. <select> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="opel">Opel</option> <option value="audi">Audi</option> </select>
<optgroup> O <optgroup> é usado para agrupar opções relacionadas em uma lista suspensa. <select> <optgroup label="Swedish Cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select>
<fieldset> A tag <fieldset> é usada para agrupar elementos relacionados em um formulário. <form> <fieldset> <legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br> Date of birth: <input type="text"> </fieldset> </form>
<label> A marca <label> define um rótulo para um elemento <input>. <form action="/action_page.php"> <label for="male">Male</label> <input type="radio" name="gender" id="male" value="male"><br> <label for="female">Female</label> <input type="radio" name="gender" id="female" value="female"><br> <label for="other">Other</label> <input type="radio" name="gender" id="other" value="other"><br><br> <input type="submit" value="Submit"> </form>
<video> Para mostrar um vídeo em HTML, use o elemento <video> <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
<audio> Para reproduzir um arquivo de áudio em HTML, use o elemento <audio> <audio controls> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>
<object> O elemento <object> é suportado por todos os navegadores. <object width="400" height="50" data="bookmark.swf"></object>
<canvas> O elemento HTML <canvas> é usado para desenhar gráficos em uma página da Web. O elemento HTML <canvas> é usado para desenhar gráficos, sobre a marcha, via JavaScript.
SVG O que é SVG? SVG significa gráficos vetoriais escaláveis SVG é usado para definir gráficos para a Web SVG é uma recomendação do W3C

Semelhante

Html test
Samuel Melendez
front end developer test
joni jiniani
Test I. Introduction to web technologies
Angel Martínez Rodriguez
Intro to HTML
Balikkoftesi
Front-End Web Development
Chanthy Ngin
HTML + CSS
Justina Sadikova
OpenSource Programming
Faheem Ahmed
HTML Tags Mindmap
Julia C.Wozniak
BGE HTML + CSS
Ian Simpson
HTML TAGS
Charchika Rishi
HTML Basics
Priyam Soni