Scribd
Carregar
76 visualizações11 páginas

Introdução Ao HTML e CSS

O documento apresenta uma introdução ao HTML e CSS, explicando suas definições, histórias e funções na criação de páginas web. HTML fornece a estrutura básica, enquanto CSS estiliza e embeleza essa estrutura, permitindo a criação de sites e aplicativos. O texto também inclui exemplos de códigos básicos e a importância da combinação entre HTML e CSS para o desenvolvimento web.

Enviado por

gussabunero
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
76 visualizações11 páginas

Introdução Ao HTML e CSS

O documento apresenta uma introdução ao HTML e CSS, explicando suas definições, histórias e funções na criação de páginas web. HTML fornece a estrutura básica, enquanto CSS estiliza e embeleza essa estrutura, permitindo a criação de sites e aplicativos. O texto também inclui exemplos de códigos básicos e a importância da combinação entre HTML e CSS para o desenvolvimento web.

Enviado por

gussabunero
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 11

INTRODUÇÃO AO HTML E CSS

PRIMEIROSPASSOS
O que é HTML?

 Definição: HTML (Hyper TextMarkup Language) essas iniciais em português


significa, linguagem de marcação de hiper texto que é uma linguagem padrão
para criar páginas web.
 História: Criada por Tim Berners-Lee em 1991, a primeira versão do HTML foi
desenvolvida no CERN (Organização Europeia para a Pesquisa Nuclear).
 Estrutura: Utiliza "tags“ que são usados para informar ao navegador que tipo de
estrutura é essa que está sendo construída, podendo ser títulos, parágrafos,
imagens, links, entre outro.
 Elementos principais: <html>, <head>, <title>, <body>, <h1>, <p>, <a>, <img>,
entre outros.
O que é CSS?

 Definição: CSS (Cascading Style Sheets) Enquanto o HTML cria a estrutura do


site, como os tijolos de uma casa, o CSS é a decoração interior, transformando
esses tijolos em algo bonito e agradável.
 História: Criada por Håkon Wium Lie em 1994, o CSS foi desenvolvido para
separar o conteúdo da apresentação visual, melhorando a flexibilidade e a
manutenção de sites.
 Como funciona: Define estilos para HTML utilizando seletores e propriedades.
 Exemplos de Propriedades: color, font-size, margin, padding, background, etc
O Poder do HTML e CSS

HTML e CSS
 São as duas camadas essenciais para a criação de websites e aplicativos.
Enquanto o HTML fornece a estrutura básica e o conteúdo de uma página web, o
CSS é responsável por estilizar e dar vida a essa estrutura.
 É por isso que o HTML precisa da dupla dinâmica do CSS. Juntos, eles podem
criar não apenas páginas web, mas também aplicativos mobile, sistemas web, e
muito mais. O CSS adiciona cor, fontes, layouts e até mesmo animações,
transformando o HTML básico em algo visualmente atraente e funcional.
Código HTML
Básico
Componentes Básicos:
<!DOCTYPE html>: Esta linha informa ao
navegador que o documento é um arquivo
HTML5.
<html>: A tag raiz que encapsula todo o
conteúdo da página.
<head>: Contém metadados e
informações sobre a página, como o título.
<meta charset="UTF-8">: Define o
conjunto de caracteres como UTF-8.
<title>: Define o título que aparece na aba
do navegador.
<body>: Contém todo o conteúdo visível
da página, como texto, imagens e links.
Códigos Básicos do HTML e CSS

HTML Básico:
<h1>:
 O que é: Uma tag que define o maior título em HTML.
 Exemplo: <h1>Título Principal</h1>

<img>:
 O que é: Uma tag que insere uma imagem na página.
 Exemplo: <img src="imagem.jpg">

<p>:
 O que é: Uma tag que define um parágrafo.
 Exemplo: <p>Este é um parágrafo de texto.</p>
HTML Na Prática

Aplicação do código HTML: Aparência do site com a aplicação:


Códigos Básicos do HTML e CSS

CSS Básico:
color:
 O que é: Uma propriedade CSS que define a cor do texto.
 Exemplo: color: blue;

font-family:
 O que é: Uma propriedade CSS que define a fonte do texto.
 Exemplo: font-family: Arial;

background-color:
 O que é: Uma propriedade CSS que define a cor de fundo de um elemento.
 Exemplo: background-color: #f0f0f0;
CSS Na Prática

Aplicação do código CSS: Aparência do site com a aplicação:


Como HTML e CSS
Funcionam Juntos
HTML: Estrutura o conteúdo.
CSS: Estiliza esse conteúdo.
Todas as propriedades CSS
que usamos para estilizar o
HTML ficam dentro da tag
<style>, que por sua vez é
colocada dentro da tag <head>
do documento HTML.
Isso garante que os estilos
sejam aplicados a todos os
elementos na página.
Conclusão

 Para finalizar, faremos uma dinâmica divertida no Kahoot!


 Os três primeiros colocados ganharão uma caixa de bombons.
Preparem-se para testar seus conhecimentos e boa sorte a todos!

Você também pode gostar