8000 Primeros ejercicios de CSS · JoseAnt7/css-tutorial-exercises-course@30da847 · GitHub
Skip to content

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 30da847

Browse files
committed
Primeros ejercicios de CSS
1 parent 6ddfc18 commit 30da847

File tree

31 files changed

+279
-15
lines changed

31 files changed

+279
-15
lines changed
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>01 Inline Styles</title>
5+
</head>
6+
7+
<body>
8+
<table>
9+
<tr>
10+
<td>Hello</td>
11+
</tr>
12+
<tr>
13+
<td>My brother</td>
14+
</tr>
15+
</table>
16+
</body>
17+
</html>
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<!-- Your code here -->
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<!-- add a style tag and select the <p> tag, then make it color "blue" -->
2+
<p>
3+
Coding is a basic literacy in the digital age, and it is important for kids to understand and be able to work with and understand the technology
4+
around them. Having children learn to code at a young age prepares them for the future. Coding helps children with communication, creativity,
5+
math, writing, and confidence.
6+
</p>
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<style>
5+
a {
6+
/* change this style to yellow */
7+
color: red;
8+
}
9+
</style>
10+
</head>
11+
<body>
12+
Hello! <a href="#">I am an anchor in red, change my color to yellow</a>
13+
</body>
14+
</html>
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<style>
5+
/* Your code here */
6+
</style>
7+
</head>
8+
<body>
9+
Hello! My background should be blue!
10+
</body>
11+
</html>
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="stylesheet" type="text/css" href="./styles.css" />
5+
</head>
6+
<body>
7+
My background should be blue.
8+
</body>
9+
</html>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/* your styles here:
2+
1. Select the body tag
3+
2. Add the background rule equal to blue
4+
*/
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="stylesheet" type="text/css" href="./styles.css" />
5+
<title>03.1 Background</title>
6+
</head>
7+
<body>
8+
My background should be an image with the size "contain"
9+
</body>
10+
</html>
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
body {
2+
background-image: url(https://4geeksacademy.github.io/exercise-assets/img/bg/small-mosaic.jpg);
3+
background-size: cover;
4+
background-repeat: no-repeat;
5+
}
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="stylesheet" type="text/css" href="./styles.css" />
8+
<title>04 List styling</title>
9+
</head>
10+
11+
<body>
12+
<div class="container">
13+
<h2>Your favorite drinks</h2>
14+
<h4>Coca Cola drinks</h4>
15+
<ol class="cocacola">
16+
<li>Coca Cola</li>
17+
<li>Dr. Pepper</li>
18+
<li>Fanta</li>
19+
</ol>
20+
21+
<h4>Pepsi drinks</h4>
22+
<ol class="pepsi">
23+
<li>Pepsi Cola</li>
24+
<li>Mountain Dew</li>
25+
<li>Gatorade</li>
26+
</ol>
27+
28+
<h4>Healthy drinks</h4>
29+
<ul class="healthy">
30+
<li>Kombucha</li>
31+
<li>Kale juice</li>
32+
<li>Sparkling Water</li>
33+
</ul>
34+
35+
<h4>Web-developer drinks</h4>
36+
<ul class="dev-drinks">
37+
<li>Coffee</li>
38+
<li>COFFEE</li>
39+
<li>COFFEE!!!</li>
40+
</ul>
41+
</div>
42+
</body>
43+
</html>

0 commit comments

Comments
 (0)