.png)
TUTORIAL HTML E CSS INTERNO COMO USAR!
Introdução
Olá amigo que não sabe usar html e css vou mostrar algumas formas para facilitar sua vida em relação a isso ok? vamos primeiro ver como funciona a união das duas internamente e externamente, não é um bixo de sete cabeça, é muito simples de se entender bastar prestar atenção.
Primeiro criaremos a parte básica de um site com o html5. esse exemplo é de css interna. vamos criar a tag style dentro da head, pois é na head que fica a "inteligência" do site
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<style>
</style>
</head>
<body>
conteúdo
</body>
</html>
Blz agora vamos criar uma div lá no corpo do site (body). Você pode escolher, tem a div id, e tem a div class, eu particularmente utilizo mais é a div id.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<style>
</style>
</head>
<body>
<div id="topo">
<div><!-- TOPO DO SITE-->
</body>
</html>
Pronto agora vamos chamar a DIV ID TOPO lá na style que criamos lá em cima.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<style>
#topo{}
</style>
</head>
<body>
<div id="topo">
<div><!-- TOPO DO SITE-->
</body>
</html>
Note que eu coloquei um '#' isso porque quando estamos chamando div id colocamos na css '#' e quando estamos chamando class colocamos na css '.' um pontinho ok? Agora basta pintar e bordar a div.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<style>
#topo{ width:968px;
height:150px;
background:#000;
margin:0 auto; }
</style>
</head>
<body>
<div id="topo">
</head>
<body>
<div id="topo">
<div><!-- TOPO DO SITE-->
</body>
</html>
</body>
</html>
Pronto agora vou explica oque eu coloquei ali.
primeiro colocamos width: que é a largura da div
depois height: que é a altura ambas colocadas com valores em pixel (px).
depois colocamos o background: que é a cor da div e nesse caso só pra mostrar que sou sabido rsrsrs, eu usei cores hexadecimais #000 (preto) mas você pode escrever em inglês o nome da cor agora tá?
tipo assim background:black; vai funcionar do mesmo jeito e por fim fechamos tudas elas com ponto e vírgula (;) e depois o colchete } certo? vamos ver como ficou.
salve esse arquivo com o nome index.html e basta clicar para abrir. Outra coisa, porque você ta usando index.html é porque a primeira página de um site em que o servidor identifica é essa, não importa a extensão (.html, .php, .asp) oque importa é que tem que ser com o nome index Ok?
0 comentários:
Olá amigo, tudo bem com você?