Skip to content

Commit 2dd46be

Browse files
N0sBaN0sBa
committed
update
1 parent 10de6bc commit 2dd46be

File tree

10 files changed

+132
-0
lines changed

10 files changed

+132
-0
lines changed

‎.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": 5501
3+
}

‎starter/02-HTML-Fundamentals/blog.html

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<html>
4+
<head>
5+
<title>Blog</title>
6+
</head>
7+
<body>
8+
<a href="index.html">Back</a>
9+
<h1>
10+
This is my blog
11+
</h1>
12+
</body>
13+
</html>
14+
</html>

‎starter/02-HTML-Fundamentals/challenges.jpg renamed to ‎starter/02-HTML-Fundamentals/img/challenges.jpg

File renamed without changes.

‎starter/02-HTML-Fundamentals/laura-jones.jpg renamed to ‎starter/02-HTML-Fundamentals/img/laura-jones.jpg

File renamed without changes.

‎starter/02-HTML-Fundamentals/post-img.jpg renamed to ‎starter/02-HTML-Fundamentals/img/post-img.jpg

File renamed without changes.

‎starter/02-HTML-Fundamentals/related-1.jpg renamed to ‎starter/02-HTML-Fundamentals/img/related-1.jpg

File renamed without changes.

‎starter/02-HTML-Fundamentals/related-2.jpg renamed to ‎starter/02-HTML-Fundamentals/img/related-2.jpg

File renamed without changes.

‎starter/02-HTML-Fundamentals/related-3.jpg renamed to ‎starter/02-HTML-Fundamentals/img/related-3.jpg

File renamed without changes.

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

Lines changed: 111 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>Basic language of Web</title>
6+
<link rel="stylesheet" href="style.css">
7+
</head>
8+
<body>
9+
<header>
10+
<h1>📘 The Code Magazine</h1>
11+
12+
<nav>
13+
<a href="blog.html">Blog</a>
14+
<a href="#">Chanlenges</a>
15+
<a href="#">Flexbox</a>
16+
<a href="#">CSS Grid</a>
17+
</nav>
18+
</header>
19+
20+
<article>
21+
<header>
22+
<h2>The Basic Language of the Web: HTML</h2>
23+
<img src="laura-jones.jpg" alt="Headshot of Laura Jones" height="50" width="50">
24+
25+
<p>
26+
Posted by <strong>Laura Jones</strong> on Monday, June 21st 2027
27+
</p>
28+
29+
<img src="post-img.jpg" alt="HTML coed on a screen" width="500" height="200"/>
30+
</header>
31+
32+
<p>
33+
All modern websites and web applications are built using three <em>fundamental</em> technologies: HTML, CSS and JavaScript. These are the languages of the web.
34+
</p>
35+
36+
<p>In this post, let's focus on HTML. We will learn what HTML is all about, and why you too should learn it.</p>
37+
38+
<h3>What is HTML?</h3>
39+
<p>
40+
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).
41+
</p>
42+
<p>
43+
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.
44+
</p>
45+
46+
<p>In HTML, each element is made up of 3 parts:</p>
47+
<ol>
48+
<li>The opening tag</li>
49+
<li>The closing tag</li>
50+
<li>The actual element</li>
51+
</ol>
52+
<p>
53+
You can learn more at the
54+
<a href="https://developer.mozilla.org/en-US/" target="_blank">MDN Web Docs</a>.
55+
</p>
56+
57+
<h3>
58+
Why should you learn HTML?
59+
</h3>
60+
61+
<p>
62+
There are countless reasons for learning the fundamental language of the web. Here are 5 of them:
63+
</p>
64+
<ul>
65+
<li>
66+
To be able to use the fundamental web dev language
67+
</li>
68+
<li>
69+
To hand-craft beautiful websites instead of relying on tools like Worpress or Wix
70+
</li>
71+
<li>
72+
To build web applications
73+
</li>
74+
<li>
75+
To impress friends
76+
</li>
77+
<li>
78+
To have fun 😃
79+
</li>
80+
</ul>
81+
<p>
82+
Hopefully you learned something new here. See you next time!
83+
</p>
84+
</article>
85+
86+
<aside>
87+
<p><strong>Related posts</strong></p>
88+
<ul>
89+
<li>
90+
<img src="img/related-1.jpg" alt="a man code on screen" width="60">
91+
<a href="#">How to learn Web Developement</a>
92+
<p>By Jonas Schmedtmann</p>
93+
</li>
94+
<li>
95+
<img src="img/related-2.jpg" alt="thunder" width="60">
96+
<a href="#">The Unknown Powers of CSS</a>
97+
<p>By Jim Dillon</p>
98+
</li>
99+
<li>
100+
<img src="img/related-3.jpg" alt="code on screen" width="60">
101+
<a href="#">Why JavaScript is Awsome</a>
102+
<p>By Matidla</p>
103+
</li>
104+
</ul>
105+
</aside>
106+
107+
<footer>
108+
Copyright &copy; 2027 by The Code Magazine.
109+
</footer>
110+
</body>
111+
</html>

‎starter/02-HTML-Fundamentals/style.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
* {
2+
box-sizing: border-box;
3+
/* outline: 1px solid limegreen !important; */
4+
}

0 commit comments

Comments
 (0)