Exemplo de código de um site
Veja a apresentação deste site
O elemento <meta name="viewport" content="width=device-width, initial-scale=1.0" /> é essencial para sites responsivos, ou seja, que se adaptam bem a celulares, tablets e desktops.
A linguagem CSS
A tag <style> em HTML é usada para definir estilos CSS (Cascading Style Sheets) diretamente no documento HTML. Ela funciona como um contêiner para regras CSS que controlam a aparência visual dos elementos da página, como cores, fontes, layout e outros aspectos. Geralmente, a tag <style> é colocada dentro da seção <head> do documento HTML, pois ela contém informações sobre a página que não são exibidas diretamente, mas que são usadas para formatá-la.
Como funciona:
1. Incorporando CSS:
A tag <style> permite que você escreva código CSS dentro do seu documento HTML.
2. Definindo estilos:
Dentro da tag <style>, você usa seletores CSS para identificar os elementos HTML que você quer estilizar e, em seguida, define as propriedades e valores CSS para aplicar.
3. Controle visual:
As regras CSS dentro da tag <style> controlam a aparência da página, como cor de fundo, tamanho da fonte, espaçamento, etc.
4. Organização:
Embora seja possível usar a tag <style> para definir estilos, é recomendado manter estilos externos em arquivos CSS separados (usando a tag <link>) para facilitar a manutenção e organização do código.
Exemplo:
Código
<head>
<title>Exemplo de tag style</title>
<style>
body {
background-color: lightblue;
}
h1 {
color: navy;
text-align: center;
}
</style>
</head>
<body>
<h1>Bem-vindo!</h1>
<p>Este é um exemplo de como usar a tag <style>.
</body>
Neste exemplo, a tag <style> define que o fundo da página () será azul claro e que o título () terá cor azul marinho e ficará centralizado.
O que você pode colocar dentro de <p>:
Apenas elementos em linha (inline), como:
<a> - link
<strong> - negrito semântico
<em> - itálico semântico
<span> - container em linha
<img> imagem (sim, imagem é inline!)
<mark>, <abbr>, <code>, <br>, etc
O CSS Básico