Cheatography
https://cheatography.com
cheat sheet of basic html5
This is a draft cheat sheet. It is a work in progress and is not finished yet.
Essentials
<html> |
Contém todo o conteúdo da página |
<head> |
Define informações sobre o documento (metadata, links, scripts) |
<title> |
Título da página (mostrado na aba do navegador) |
<meta> |
Metadata sobre a página (ex: charset, viewport) |
<body> |
Contém todo o conteúdo visível da página |
Atributos Globais Importantes
id |
Identificador único para um elemento |
class |
define uma ou mais classes |
style |
Estilos inline para o elemento |
hidden |
Oculta um elemento |
Imagens e Links
<img> |
Inserir imagem |
<img src="image.jpg" alt="Description" width="200" height="100"> |
<a> |
Link |
<a href="https://example.com">Click here</a> |
Cabeçalhos e Parágrafos
<h1> - <h6> |
Cabeçalhos, h1 é o maior, h6 é o menor |
<p> |
Parágrafos |
Listas
<ul> |
Lista não ordenada |
<ol> |
Lista ordenada |
Tabelas
<table> |
Define uma tabela |
<tr> |
Linha da tabela |
<th> |
Cabeçalho da tabela (negrito e centralizado) |
<td> |
Célula da tabela |
Tags Especiais
<canvas> |
Desenhar gráficos via scripts |
<svg> |
Gráficos vetoriais escaláveis |
<iframe> |
Incorporar outra página |
|
|
Semântica HTML5
<header> |
Cabeçalho de uma página ou seção |
<nav> |
Navegação principal |
<section> |
Define uma seção de um conteúdo |
<article> |
Define conteúdo independente |
<aside> |
Conteúdo relacionado ao conteúdo principal |
<footer> |
Rodapé da página ou seção |
Elementos Diversos
<div> |
Contêiner genérico |
<span> |
Contêiner genérico inline |
<br> |
Quebra de linha |
<hr> |
Linha horizontal (divisória) |
Multimídia
<audio> |
Inserir áudio |
<audio controls> <source src="audio.mp3" type="audio/mpeg"> </audio> |
<video> |
Inserir vídeo |
<video controls width="300"> <source src="video.mp4" type="video/mp4"> </video> |
Textos
<strong> |
Texto em negrito |
<em> |
Texto em itálico |
<u> |
Texto sublinhado |
<mark> |
Texto destacado (com fundo amarelo) |
Formulários
<form> |
Define um formulário |
<form action="/submit" method="POST"> <label for="name">Name:</label> <input type="text" id="name" name="name"> <input type="submit" value="Submit"> </form> |
<input> |
Campo de entrada |
Tipos comuns: text, password, email, submit, checkbox, radio |
<textarea> |
Campo de texto maior |
<select> |
Caixa de seleção |
<select name="options"> <option value="1">Option 1</option> <option value="2">Option 2</option> </select> |
|
