Skip to content

Commit 55ce04a

Browse files
biigbiig
committed
chapter3
1 parent b6d07af commit 55ce04a

File tree

10 files changed

+233
-1
lines changed

10 files changed

+233
-1
lines changed

‎my_solution/02-HTML-Fundamentals/index.html

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,47 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>Document</title>
77
</head>
8-
<body>Hello biig </body>
8+
<body>
9+
<article>
10+
Hello biig Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim,
11+
alias ad deserunt excepturi provident aliquam corrupti vero nam, eius
12+
fugit delectus commodi, esse sequi adipisci nihil impedit quidem
13+
temporibus exercitationem. Lorem ipsum dolor, sit amet consectetur
14+
adipisicing elit. Itaque suscipit vitae libero exercitationem tenetur
15+
totam fugit enim doloremque repellendus corporis officiis consequatur,
16+
natus eos odio, deleniti veniam magnam? Eligendi, debitis. Lorem, ipsum
17+
dolor sit amet consectetur adipisicing elit. Perferendis, molestiae a?
18+
Fugiat nisi laudantium id error labore animi repellendus, voluptatum
19+
perspiciatis doloremque similique pariatur, quos officiis aspernatur quia,
20+
velit facere.
21+
</article>
22+
<aside>
23+
<header>
24+
<h3>Related posts</h3>
25+
</header>
26+
<ul>
27+
<li>
28+
<article>
29+
<img src="related-1.jpg" alt="" width="50" height="50" />
30+
<a href="#">How to learn web develoment</a>
31+
</article>
32+
<footer>By jonas Schmedtmann</footer>
33+
</li>
34+
<li>
35+
<article>
36+
<img src="related-2.jpg" alt="" width="50" height="50" />
37+
<a href="#">The unknown powers of CSS</a>
38+
</article>
39+
<footer>By Jim Dillon</footer>
40+
</li>
41+
<li>
42+
<article>
43+
<img src="related-3.jpg" alt="" width="50" height="50" />
44+
<a href="#">Hy JavaScript is Awesome</a>
45+
</article>
46+
<footer>By jonas Schmedtmann</footer>
47+
</li>
48+
</ul>
49+
</aside>
50+
</body>
951
</html>

‎my_solution/03-CSS-Fundamentals/blog.html

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+
<title>BLOG</title>
5+
</head>
6+
<body>
7+
<h2>BLOG</h2>
8+
<a href="index.html">Back to home</a>
9+
</body>
10+
</html>

‎my_solution/03-CSS-Fundamentals/content.txt

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
📘 The Code Magazine
2+
3+
The Basic Language of the Web: HTML
4+
5+
Posted by Laura Jones on Monday, June 21st 2027
6+
7+
All modern websites and web applications are built using three fundamental technologies: HTML, CSS and JavaScript. These are the languages of the web.
8+
9+
In this post, let's focus on HTML. We will learn what HTML is all about, and why you too should learn it.
10+
11+
What is HTML?
12+
13+
HTML stands for HyperText Markup Language. It's a markup language that web developers use to structure and describe the content of a webpage (not a programming language).
14+
15+
HTML consists of elements that describe different types of content: paragraphs, links, headings, images, video, etc. Web browsers understand HTML and render HTML code as websites.
16+
17+
In HTML, each element is made up of 3 parts:
18+
19+
The opening tag
20+
The closing tag
21+
The actual element
22+
You can learn more at the MDN Web Docs.
23+
24+
Why should you learn HTML?
25+
26+
There are countless reasons for learning the fundamental language of the web. Here are 5 of them:
27+
28+
To be able to use the fundamental web dev language
29+
To hand-craft beautiful websites instead of relying on tools like Worpress or Wix
30+
To build web applications
31+
To impress friends
32+
To have fun 😃
33+
34+
Hopefully you learned something new here. See you next time!

‎my_solution/03-CSS-Fundamentals/img/challenges.jpg

120 KB
Loading

‎my_solution/03-CSS-Fundamentals/img/laura-jones.jpg

6.64 KB
Loading

‎my_solution/03-CSS-Fundamentals/img/post-img.jpg

53.4 KB
Loading

‎my_solution/03-CSS-Fundamentals/img/related-1.jpg

50.2 KB
Loading

‎my_solution/03-CSS-Fundamentals/img/related-2.jpg

33 KB
Loading

‎my_solution/03-CSS-Fundamentals/img/related-3.jpg

43.5 KB
Loading

‎my_solution/03-CSS-Fundamentals/index.html

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>The Basic Language of the Web: HTML</title>
6+
</head>
7+
8+
<body>
9+
<!--
10+
<h1>The Basic Language of the Web: HTML</h1>
11+
<h2>The Basic Language of the Web: HTML</h2>
12+
<h3>The Basic Language of the Web: HTML</h3>
13+
<h4>The Basic Language of the Web: HTML</h4>
14+
<h5>The Basic Language of the Web: HTML</h5>
15+
<h6>The Basic Language of the Web: HTML</h6>
16+
-->
17+
18+
<header>
19+
<h1>📘 The Code Magazine</h1>
20+
21+
<nav>
22+
<a href="blog.html">Blog</a>
23+
<a href="#">Challenges</a>
24+
<a href="#">Flexbox</a>
25+
<a href="#">CSS Grid</a>
26+
</nav>
27+
</header>
28+
29+
<article>
30+
<header>
31+
<h2>The Basic Language of the Web: HTML</h2>
32+
33+
<img
34+
src="img/laura-jones.jpg"
35+
alt="Headshot of Laura Jones"
36+
height="50"
37+
width="50"
38+
/>
39+
40+
<p>Posted by <strong>Laura Jones</strong> on Monday, June 21st 2027</p>
41+
42+
<img
43+
src="img/post-img.jpg"
44+
alt="HTML code on a screen"
45+
width="500"
46+
height="200"
47+
/>
48+
</header>
49+
50+
<p>
51+
All modern websites and web applications are built using three
52+
<em>fundamental</em>
53+
technologies: HTML, CSS and JavaScript. These are the languages of the
54+
web.
55+
</p>
56+
57+
<p>
58+
In this post, let's focus on HTML. We will learn what HTML is all about,
59+
and why you too should learn it.
60+
</p>
61+
62+
<h3>What is HTML?</h3>
63+
<p>
64+
HTML stands for <strong>H</strong>yper<strong>T</strong>ext
65+
<strong>M</strong>arkup <strong>L</strong>anguage. It's a markup
66+
language that web developers use to structure and describe the content
67+
of a webpage (not a programming language).
68+
</p>
69+
<p>
70+
HTML consists of elements that describe different types of content:
71+
paragraphs, links, headings, images, video, etc. Web browsers understand
72+
HTML and render HTML code as websites.
73+
</p>
74+
<p>In HTML, each element is made up of 3 parts:</p>
75+
76+
<ol>
77+
<li>The opening tag</li>
78+
<li>The closing tag</li>
79+
<li>The actual element</li>
80+
</ol>
81+
82+
<p>
83+
You can learn more at
84+
<a
85+
href="https://developer.mozilla.org/en-US/docs/Web/HTML"
86+
target="_blank"
87+
>MDN Web Docs</a
88+
>.
89+
</p>
90+
91+
<h3>Why should you learn HTML?</h3>
92+
93+
<p>
94+
There are countless reasons for learning the fundamental language of the
95+
web. Here are 5 of them:
96+
</p>
97+
98+
<ul>
99+
<li>To be able to use the fundamental web dev language</li>
100+
<li>
101+
To hand-craft beautiful websites instead of relying on tools like
102+
Worpress or Wix
103+
</li>
104+
<li>To build web applications</li>
105+
<li>To impress friends</li>
106+
<li>To have fun 😃</li>
107+
</ul>
108+
109+
<p>Hopefully you learned something new here. See you next time!</p>
110+
</article>
111+
112+
<aside>
113+
<h4>Related posts</h4>
114+
115+
<ul>
116+
<li>
117+
<img
118+
src="img/related-1.jpg"
119+
alt="Person programming"
120+
width="75"
121+
width="75"
122+
/>
123+
<a href="#">How to Learn Web Development</a>
124+
<p>By Jonas Schmedtmann</p>
125+
</li>
126+
<li>
127+
<img src="img/related-2.jpg" alt="Lightning" width="75" heigth="75" />
128+
<a href="#">The Unknown Powers of CSS</a>
129+
<p>By Jim Dillon</p>
130+
</li>
131+
<li>
132+
<img
133+
src="img/related-3.jpg"
134+
alt="JavaScript code on a screen"
135+
width="75"
136+
height="75"
137+
/>
138+
<a href="#">Why JavaScript is Awesome</a>
139+
<p>By Matilda</p>
140+
</li>
141+
</ul>
142+
</aside>
143+
144+
<footer>Copyright &copy; 2027 by The Code Magazine.</footer>
145+
</body>
146+
</html>

0 commit comments

Comments
 (0)