Skip to content

Commit a2a2c35

Browse files
committed
ejercicio 9
1 parent 648c81f commit a2a2c35

File tree

18 files changed

+93
-40
lines changed

18 files changed

+93
-40
lines changed

exercises/01-Hello-World/index.html

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,8 @@
1-
<!-- your code here -->
1+
<!-- your code here -->
2+
<style>
3+
a {
4+
/* change this style to yellow */
5+
color: pink;
6+
}
7+
</style>
8+
<a href="https://google.com" target="_blank">Click me to open google.com</a>

exercises/01.1-The-Style-Tag/index.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,9 @@
44
around them. Having children learn coding at a young age prepares them for the future. Coding helps children with communication, creativity,
55
math,writing, and confidence.
66
</p>
7+
<style>
8+
/* the website CSS Styles go here */
9+
p {
10+
color: blue;
11+
}
12+
</style>

exercises/01.2-Your-First-Style/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<style>
55
a {
66
/* change this style to yellow */
7-
color: red;
7+
color: yellow;
88
}
99
</style>
1010
</head>

exercises/01.3-Your-Second-Style/index.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@
33
<head>
44
<style>
55
/* Your code here */
6+
body {
7+
background: blue;
8+
}
69
</style>
710
</head>
811
<body>

exercises/02-Separate-Stylesheet/styles.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,6 @@
22
1. Select the body tag.
33
2. Add the background rule equal to blue.
44
*/
5+
body {
6+
background: blue;
7+
}

exercises/02.1-Background/styles.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
body {
22
background-image: url(https://4geeksacademy.github.io/exercise-assets/img/bg/small-mosaic.jpg);
3-
background-size: cover;
4-
background-repeat: no-repeat;
3+
background-size: contain;
4+
background-repeat: inherit;
55
}

exercises/03-Inline-Styles/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
</head>
66

77
<body>
8-
<table>
8+
<table style="background-color: green">
99
<tr>
1010
<td>Hello</td>
1111
</tr>

exercises/04-Class-Selector/index.html

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,11 @@
22
<html>
33
<head>
44
<link rel="stylesheet" type="text/css" href="./styles.css" />
5-
<title>
6-
04 Class selector
7-
</title>
5+
<title>04 Class selector</title>
86
</head>
97

108
<body>
11-
<p>Hello!</p>
12-
<p>World!</p>
9+
<p class="b-blue">Hello!</p>
10+
<p class="b-blue">World!</p>
1311
</body>
1412
</html>

exercises/04.1-Combined-Rules/index.html

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,7 @@
22
<html>
33
<head>
44
<link rel="stylesheet" type="text/css" href="./styles.css" />
5-
<title>
6-
04 Combined Rules
7-
</title>
5+
<title>04 Combined Rules</title>
86
</head>
97

108
<body>
Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,10 @@
11
.myBox {
22
width: 50px;
33
height: 50px;
4-
padding-top: 10px;
5-
padding-left: 30px;
6-
padding-right: 190px;
7-
padding-bottom: 50px;
4+
padding: 10px 190px 50px 10px;
85

9-
background: rgb(189, 189, 189);
10-
background-image: url(https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/3a2d1dd03f58167a5a4894155af2d3aa4d41d647/.learn/assets/baby.jpg?raw=true);
6+
background: rgb(189, 189, 189) no-repeat
7+
url(https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/3a2d1dd03f58167a5a4894155af2d3aa4d41d647/.learn/assets/baby.jpg?raw=true);
118
background-position-x: 100px;
12-
background-repeat: no-repeat;
139
background-size: contain;
1410
}

exercises/04.2-Apply-several-classes/index.html

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,10 @@
22
<html>
33
<head>
44
<link rel="stylesheet" type="text/css" href="./styles.css" />
5-
<title>
6-
04 Class selector
7-
</title>
5+
<title>04 Class selector</title>
86
</head>
97

108
<body>
11-
<div class="card spades">9</div>
9+
<div class="card heart">9</div>
1210
</body>
1311
</html>

exercises/04.3-id-Selector/index.html

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,10 @@
22
<html>
33
<head>
44
<link rel="stylesheet" type="text/css" href="./styles.css" />
5-
<title>
6-
04.3 ID selector
7-
</title>
5+
<title>04.3 ID selector</title>
86
</head>
97

108
<body>
11-
<span>I should look like a button</span>
9+
<span id="button1">I should look like a button</span>
1210
</body>
1311
</html>

exercises/04.3-id-Selector/styles.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
#button1 {
2-
background: #BDBDBD;
3-
border: #5E5E5E;
4-
border-radius: 5px;
2+
background: #bdbdbd;
3+
border: #5e5e5e;
4+
border-radius: 5px;
55
}

exercises/05-Specificity/styles.css

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
ul li{
1+
ul li {
22
background: blue;
33
}
44

5-
#thirditem{
5+
#thirditem {
66
background: yellow;
7-
}
7+
background: green !important;
8+
}
89
/****** DON NOT EDIT ANYTHING ABOVE THIS LINE ****/
9-

exercises/06-Practicing-Rules/index.html

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,12 @@ <h2>3 reasons you know you are learning</h2>
2121
<h2>3 reasons you know love what you are learning</h2>
2222
<ul>
2323
<li>Time passes fast.</li>
24-
<li>
25-
You are anxious to finish this excercise and start the next one.
26-
</li>
24+
<li>You are anxious to finish this excercise and start the next one.</li>
2725
<li>Is 12am and you don't want to go to sleep.</li>
2826
</ul>
2927
<p>
3028
If you can't sleep, what better than watching videos of cats?
3129
<a href="https://www.youtube.com/watch?v=WEgWMOzQ8IE">click here</a>
3230
</p>
3331
</body>
34-
</html>
32+
</html>
Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,28 @@
1-
/* add your styles here */
1+
/* add your styles here */
2+
body {
3+
background: repeat-y;
4+
background-image: url(https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/background-vertical.jpg?raw=true);
5+
font-family: "Times New Roman", Times, serif;
6+
}
7+
8+
h1 {
9+
font-family: Courier;
10+
color: red;
11+
text-align: center;
12+
}
13+
14+
h2 {
15+
text-decoration: underline;
16+
}
17+
18+
html > * {
19+
padding-left: 20px;
20+
}
21+
22+
#id1 {
23+
background-color: rgba(255, 255, 255, 0.2);
24+
}
25+
26+
a:hover {
27+
color: green;
28+
}

exercises/07-Very-Specific-Rules/styles.css

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,19 @@ ul li,
1313
ol li {
1414
color: green;
1515
}
16+
17+
ol > li {
18+
color: green;
19+
}
20+
21+
ol li:nth-child(2) {
22+
background-color: green;
23+
}
24+
25+
ul li {
26+
color: red;
27+
}
28+
29+
tr:nth-child(2n + 1) {
30+
background-color: yellow;
31+
}

exercises/08-Rounded-Image/styles.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,9 @@ body {
33
}
44
.rounded {
55
border-radius: 100%;
6+
object-fit: contain;
7+
}
8+
9+
img {
10+
object-fit: contain;
611
}

0 commit comments

Comments
 (0)