plit these into two files one that is index.HTML and the other that is style.CSS what I have down below Document Cursus Eget 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. Diam Urna condimentum mattis pellentesque id nibh tortor. Id aliquet lectus proin nibh nisl condimentum id venenatis. A condimentum vitae sapien pellentesque habitant. Aliquam Sem Fringilla Pellentesque, NecEst velit egestas dui id ornareEst ultricies integer quis auctor elit
split these into two files one that is index.HTML and the other that is style.CSS
what I have down below
<!DOCTYPE html>
<html lang="en">
<style>
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200&family=Roboto:wght@100&family=Scheherazade+New&display=swap');
body {
margin: 0;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
background-color: #556271;
color: white;
}
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 rule for paragraph elements */
p {
font-size: 2em;
text-align: center;
}
/* primary font class */
.primary-font {
font-family: 'Oswald', sans-serif;
}
/* secondary font class */
.secondary-font {
font-family: 'Roboto', sans-serif;
}
/* font class that follows an element with the secondary font class */
.secondary-font+p {
font-family: 'Scheherazade New', serif;
}
.image {
width: 200px;
}
</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>
</head>
<body>
<div class="primary-font">
<h1>Cursus Eget</h1>
<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="secondary-font">
<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="secondary-font">
<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>
Step by step
Solved in 3 steps with 6 images
