Atividade 01
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<p> Texto sem destaque </p>
<p class = "texto-destaque"> Texto em destaque</p>
</body>
</html>
.texto-destaque {
color: red;
}
Atividade 02
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<h1 class="titulo-blog"> Título Blog </h1>
</body>
</html>
.titulo-blog {
color: blue;
font-style: italic;
}
Atividade 03
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<p class="urgente"> Notícias Urgentes </p>
<p> Notícias Normais </p>
</body>
</html>
.urgente {
color: red;
}
Atividade 04
* {
margin:0;
padding:0;
}
Atividade 05
Cada elemento web é constituído por um modelo de caixa, com seu conteúdo. Externamente a ele, há um padding, que é o espaço ao redor do conteúdo; externamente ao padding, há uma borda; e, externamente à borda, há uma margin. Geralmente, existe um padrão de CSS aplicado às páginas web, mas isso varia de navegador para navegador. Por isso, sempre que desenvolvemos, precisamos aplicar um reset CSS antes de pensar na estilização.
Atividade 06
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<p class="paragrafo1"> Informações 1 </p>
<p class="paragrafo2"> Informações 2 </p>
</body>
</html>
* {
margin:0;
padding:0;
}
body {
display: flex;
}
.paragrafo1 {
margin: 10px;
border: 3px solid black;
padding: 10px;
}
.paragrafo2 {
margin: 15px;
border: 3px solid blue;
padding: 15px;
}
