jpaulohe4rt /
markdown4noobs
Ensinar o básico de Markdown para iniciantes
53/100 healthLoading repository data…
EricRochaGoncalves / repository
Tutorial básico de HTML e CSS
A transparent discovery signal based on current public GitHub metadata.
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
Este tutorial básico é ideal para iniciantes que desejam aprender como criar páginas web utilizando HTML (HyperText Markup Language) e CSS (Cascading Style Sheets). Aqui, vamos cobrir a estrutura fundamental de uma página HTML e como usar CSS para estilizar os elementos.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meu Primeiro Site</title>
</head>
<body>
<h1>Bem-vindo ao meu primeiro site!</h1>
<p>Este é um parágrafo de exemplo.</p>
</body>
</html>
<!DOCTYPE html>: Define que o documento está usando a versão HTML5.<html lang="pt-br">: Define a linguagem do documento como português.<head>: Contém informações sobre o documento, como título e metadados.<meta charset="UTF-8">: Define a codificação de caracteres como UTF-8, importante para exibir caracteres especiais corretamente.<body>: Contém o conteúdo visível da página, como títulos e parágrafos.<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Links e Imagens</title>
</head>
<body>
<h1>Links e Imagens em HTML</h1>
<p><a href="https://www.exemplo.com">Clique aqui para visitar o exemplo</a></p>
<img src="imagem.jpg" alt="Descrição da imagem">
</body>
</html>
<a href="url">: Cria um link que, ao ser clicado, redireciona para a URL especificada.<img src="imagem.jpg" alt="Descrição">: Exibe uma imagem na página, com a descrição alternativa exibida caso a imagem não seja carregada.<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemplo de CSS</title>
<style>
body {
background-color: #f4f4f4;
font-family: Arial, sans-serif;
}
h1 {
color: #333;
text-align: center;
}
p {
font-size: 18px;
color: #666;
}
</style>
</head>
<body>
<h1>Estilos com CSS</h1>
<p>Este parágrafo está estilizado com CSS.</p>
</body>
</html>
<style>: A tag <style> dentro do <head> permite que você adicione estilos diretamente no arquivo HTML.body { background-color: #f4f4f4; }: Define o fundo da página.h1 { color: #333; text-align: center; }: Estiliza o título h1, mudando a cor do texto e centralizando-o.p { font-size: 18px; color: #666; }: Estiliza o parágrafo, ajustando o tamanho da fonte e a cor.<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Listas em HTML</title>
</head>
<body>
<h1>Listas</h1>
<h2>Lista Não Ordenada</h2>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<h2>Lista Ordenada</h2>
<ol>
<li>Primeiro</li>
<li>Segundo</li>
<li>Terceiro</li>
</ol>
</body>
</html>
<ul>: Cria uma lista não ordenada (com marcadores).<ol>: Cria uma lista ordenada (numerada).<li>: Define um item da lista.<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Formulário de Contato</title>
</head>
<body>
<h1>Formulário de Contato</h1>
<form action="#" method="POST">
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" required>
<label for="email">E-mail:</label>
<input type="email" id="email" name="email" required>
<label for="mensagem">Mensagem:</label>
<textarea id="mensagem" name="mensagem" required></textarea>
<button type="submit">Enviar</button>
</form>
</body>
</html>
<form>: Define o formulário, com o atributo action indicando o destino dos dados e method definindo o método de envio (GET ou POST).<input>: Usado para campos de texto, como nome e e-mail.<textarea>: Usado para criar uma área maior de entrada de texto (mensagem).<button>: Define o botão de envio.Agora que você aprendeu o básico de HTML e CSS, pode começar a construir suas próprias páginas web! Este tutorial abordou a estrutura fundamental, como criar links, imagens, estilizar com CSS e até criar formulários. Com esses conhecimentos, você tem uma base sólida para avançar para tópicos mais complexos.
Selected from shared topics, language and repository description—not editorial ratings.
jpaulohe4rt /
Ensinar o básico de Markdown para iniciantes
53/100 healthjorditorresBCN /
Tutorial básico de uso de TensorFlow
41/100 healthJuliaLangPt /
Tutorial básico da linguagem de programação Julia
35/100 healthantoniorws /
Trilha de Java básico para iniciar sua carreira no mundo java 💻
51/100 healthcursodepythonoficial /
Flask Workshop - Workshop básico de Flask
34/100 healthboterostg /
Bot básico hecho mediante www.glitch.com y con Python3 , el cual irá creciendo conforme hagamos tutoriales/clases/dudas/llamadas en discord. Grupo de Telegram: http://t.me/boterostg
54/100 health