Complete the style rules above by providing your Google Fonts as values to the font- family property. Be sure to include a web safe font as a fallback if the browser fails to load the Google Font. Apply the primary font class to the Level One Section Heading. Then apply the secondary font class to the Level Two Section Heading. Finally, create a style rule that applies the third Google Font to any paragraph element that immediate follows an element with the secondary font class.
what I have so far
<!DOCTYPE html>
<html lang="en">
<style>
body{
margin: 0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #556271;
color: white;
}
h1{
color: #fe6a67;
text-align: center;
font-weight: normal;
text-transform: uppercase;
border-top: 1px dotted #d4dccd;
margin-top: 30px;
}
h2{
font-size: 1em;
text-align: center;
}
body{
margin: 0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
h1{
width: 2px;
border-top: 1px dotted;
border-top-color: #506D84;
}
h2{
text-align: center;
}
</style>
<head>
<link rel="stylesheet" href="style.css">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.first>h2, .second>h2, .third>h2 {
margin-top: 10px;
margin-bottom: 10px;
}
.image {
width: 200px;
}
</style>
</head>
<body>
<div class="first">
<h2>Cursus Eget</h2>
<p>Cursus EgetPurus sit amet volutpat consequat mauris nunc congue nisi vitae. Suscipit tellus mauris a diam
maecenas sed enim ut sem viverra aliquet eget sit.</p>
</div>
<div class="second">
<h2>Diam</h2>
<p>Urna condimentum mattis pellentesque id nibh tortor. Id aliquet lectus proin nibh nisl condimentum id
venenatis. A condimentum vitae sapien pellentesque habitant.</p>
</div>
<div class="third">
<h2>Aliquam Sem Fringilla</h2>
<p>Pellentesque, NecEst velit egestas dui id ornareEst ultricies integer quis auctor elit</p>
</div>
<img src="21.png" alt="picture" class="image">
</body>
</html>
Trending now
This is a popular solution!
Step by step
Solved in 4 steps with 4 images
