Skip to content

Commit 21a8fcb

Browse files
Yves250Yves250
committed
module project
1 parent 2eafd55 commit 21a8fcb

3 files changed

Lines changed: 76 additions & 0 deletions

File tree

‎.vscode/settings.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"liveServer.settings.port": 5502
3+
}

‎css/style.css‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,5 +15,58 @@ body {
1515
*
1616
* - When using Flexbox, remember the items you want to move around need to be inside a parent container set to 'display: flex'
1717
*/
18+
nav {
19+
/* background-color: black; */
20+
font-size: 15px;
21+
height: 80px;
22+
display: flex;
23+
flex-direction: row;
24+
justify-content: space-between;
25+
}
26+
ul {
27+
width: 100%;
28+
display: flex;
29+
flex-direction: row;
30+
list-style: none;
31+
margin-right: 150px;
32+
margin-top: 35px;
33+
34+
}
1835

36+
li a {
37+
color: black;
38+
text-decoration: none;
39+
}
1940

41+
li a {
42+
padding: 14px 16px;
43+
}
44+
nav {float: right;}
45+
.article {
46+
background-image: url(/img/first-background.jpg);
47+
background-size: cover;
48+
background-repeat: no-repeat;
49+
height: 600px;
50+
margin-top: 40px;
51+
52+
}
53+
.article {
54+
color: white;
55+
text-align: center;
56+
height: 500px;
57+
margin: 50px;
58+
59+
60+
}
61+
button {
62+
background-color: rgb(243, 101, 50);
63+
padding: 10px 30px 10px 30px;
64+
margin-top: 250px;
65+
66+
}
67+
/* h2 {
68+
margin-top: 250px;
69+
} */
70+
/* h1 {
71+
margin-top: 250px;
72+
} */

‎index.html‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,5 +15,25 @@
1515
<!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
1616
<!-- All the images you need are in the 'img' folder -->
1717

18+
<div>
19+
<header>
20+
<nav>
21+
<ul>
22+
<li><a href="">Meet Karma</a></li>
23+
<li><a href="">How it Works</a></li>
24+
<li><a href="">Store</a></li>
25+
<li><a href="">Blog</a></li>
26+
<li><a href="">Help</a></li>
27+
<li><a href="">Login</a></li>
28+
</ul>
29+
</nav>
30+
</header><br>
31+
<div class="article">
32+
<h1>Introducing Karma</h1>
33+
<h2>Bring WiFi with you,everywhere you go</h2>
34+
<button>Learn More</button>
35+
</div>
36+
</div>
37+
1838
</body>
1939
</html>

0 commit comments

Comments
 (0)