Skip to content

Commit 89b627a

Browse files
committed
2-DR2-TP1.04
1 parent 1dddea0 commit 89b627a

File tree

3 files changed

+104
-1
lines changed

3 files changed

+104
-1
lines changed

2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP1.03/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<link rel="stylesheet" href="./style.css">
7-
<title>DR1-TP1.02</title>
7+
<title>DR1-TP1.03</title>
88
</head>
99
<body>
1010
<main>
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<link rel="stylesheet" href="./style.css">
7+
<title>DR1-TP1.04</title>
8+
</head>
9+
<body>
10+
<main>
11+
<!-- Ex 10 -->
12+
<ul id="primeiro">
13+
<li>
14+
<ul>
15+
<li>Item 1</li>
16+
<li>Item 2</li>
17+
<li>Item 3</li>
18+
</ul>
19+
</li>
20+
<li>
21+
<ul>
22+
<li>Item 1</li>
23+
<li>Item 2</li>
24+
<li>Item 3</li>
25+
</ul>
26+
</li>
27+
</ul>
28+
<!-- Ex 11 -->
29+
<ul id="segundo">
30+
<li>
31+
<ul>
32+
<li>Item 1</li>
33+
<li>Item 2</li>
34+
<li>Item 3</li>
35+
<li>Item 4</li>
36+
</ul>
37+
</li>
38+
<li>
39+
<ul>
40+
<li>Item 1</li>
41+
<li>Item 2</li>
42+
<li>Item 3</li>
43+
<li>Item 4</li>
44+
</ul>
45+
</li>
46+
<li>
47+
<ul>
48+
<li>Item 1</li>
49+
<li>Item 2</li>
50+
<li>Item 3</li>
51+
<li>Item 4</li>
52+
</ul>
53+
</li>
54+
</ul>
55+
</main>
56+
</body>
57+
</html>
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
body {
2+
background-color: #333333;
3+
color: #ffffff;
4+
font-family: Verdana, Geneva, Tahoma, sans-serif;
5+
}
6+
7+
main {
8+
border: 1px solid #494949;
9+
padding: 16px;
10+
border-radius: 8px;
11+
}
12+
13+
ul {
14+
list-style-type: none;
15+
padding: 0;
16+
17+
display: flex;
18+
gap: 16px;
19+
20+
&#primeiro {
21+
flex-direction: row;
22+
justify-content: space-around;
23+
24+
ul {
25+
display: flex;
26+
flex-direction: column;
27+
}
28+
}
29+
30+
&#segundo {
31+
flex-direction: column;
32+
justify-content: space-around;
33+
34+
ul {
35+
display: flex;
36+
flex-direction: row;
37+
justify-content: space-between;
38+
}
39+
}
40+
}
41+
42+
li {
43+
background-color: #3a3a3a;
44+
padding: 12px 16px;
45+
border-radius: 6px;
46+
}

0 commit comments

Comments
 (0)