<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Pagina teste</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<!--1) Estilizando elementos com classes CSS-->
<h1 class="titulo-blog">Destacando títulos com CSS</h1>
<p class="texto-destaque">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus a
efficitur risus. Mauris lobortis non lorem eget fringilla. Nunc interdum
consequat tellus sed dapibus. Vivamus a molestie risus, a tincidunt
libero. Cras eget ligula viverra, varius dui id, pulvinar tortor. Donec et
metus quis enim sodales efficitur. Curabitur quam ante, maximus vel
consequat quis, fermentum fringilla sem. Fusce sagittis dictum interdum.
Fusce feugiat velit quis sapien egestas, at viverra augue cursus. In hac
habitasse platea dictumst. Ut porttitor aliquam sem ac pretium. Donec
maximus nulla eget venenatis tempor.
</p>
<p class="urgente">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus a
efficitur risus. Mauris lobortis non lorem eget fringilla. Nunc interdum
consequat tellus sed dapibus. Vivamus a molestie risus, a tincidunt
libero. Cras eget ligula viverra, varius dui id, pulvinar tortor. Donec et
metus quis enim sodales efficitur.
</p>
<p class="texto-especifico">
Aliquam mollis accumsan interdum. Cras ut rhoncus justo. Etiam vel porta
elit. Aliquam pharetra fringilla mauris sit amet suscipit. Sed fringilla
ultricies ex non porta. Cras tellus enim, aliquam non eros et, posuere
molestie tellus. Pellentesque sed tortor id magna ullamcorper aliquet sit
amet et orci. Vestibulum sodales, nisi eget cursus porttitor, nunc mauris
luctus augue, vitae convallis dui sem a mi
</p>
</body>
</html>
* {
margin: 0;
padding: 0;
}
body {
background-color: black;
}
.titulo-blog {
color: beige;
padding: 15px;
}
.texto-destaque {
padding: 30px;
color: indigo;
}
.urgente {
color: red;
padding: 30px;
}
.texto-especifico {
color: plum;
margin: 200;
padding: 30px;
}
