Day 1 of Learning Web Development and HTML.

This is my first blog and I am trying to share my journey toward becoming a good full-stack developer. I always have a curiosity about what to do in IT and technology. In the booming era of web3 and blockchain technology. There are many trending and developing things in the IT field such as AI, Machine Learning, Space Exploration, Robotics, and many more which are not possible to write in a single blog. But I chose to start my career with full-stack web development and I have bought a course from Udemy of Angela Yu(Complete Web Development Bootcamp).

I will document my day of learning here and share with you what I have learned in a day. You can also learn from me by reading my blogs.

Let's get started today I learned about HTML headings, paragraphs, self-closing tags, listings, and anchor tags and I did exercises about these different components of HTML.

First, I will share with you about HTML headings. What I learned in HTML headings.

HTML headings:

There are 6 headings tags

<h1>Heading 1</h1> is the biggest among all the heading tags available in HTML>

<h2>Heading 2</h2>

<h3>Heading 3</h3>

<h4>Heading 4</h4>

<h5>Heading 5</h5>

<h6>Heading 6</h6> is the smallest among all the heading tags available in HTML>

[ Note: From <h1>Heading 1</h1> sizes are decreasing ascendency to the <h6>Heading 6</h6>]

Second, I learned about self-closing tags which are:- <br/> and <hr/>

<br/> is used to break the line inside the paragraph and <hr/> is used to create the horizontal line inside the blog where we need it.

Here are my screenshots of code and output where I used these tags.

Third, I learned about <ol></ol> which is used to make an ordered list we use <list></list> inside <ol></ol> and <ul></ul> to enter the things which we want to list. <0l></ol> make list like ordered from 1, 2, 3... and so on but <ul></ul> make the list unordered with bullet points ahead of our list.

Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>NestingList</title>
</head>
<body>
   <ul>
    <li>A</li>
    <li>B
        <ol>
            <li>B1</li>
            <li>B2
                <ul>
                    <li>
                        B2a<ul>
                            <li>B2aa</li>
                            <li>B2ab</li>
                        </ul>
                    </li>
                    <li>B2b</li>
                    <li>B2c</li>
                </ul>
            </li>
            <li>B3
                <ol><li>B31</li>
                <li>B32</li></ol>
            </li>

        </ol>
    </li>
    <li>C</li>
   </ul> 
    
</body>
</html>

Output:

Fourth, I learned about anchored tags(<a></a>) which is used to create hyperlinks, which allow you to link from one web page to another or to other resources on the web.

Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Anchor Tags</title>
</head>
<body>
    <h1>My Top 5 Favourite Websites</h1>
    <ol>
        <li><a href="https://www.udemy.com/">Udemy</a></li>
        <li><a href="ttps://factzstudy.blogspot.com">FactzStudy</a></li>
       <li>
        <a href="https://www.youtube.com/">YouTube</a>

       </li>
    <li><a href="https://twitter.com/?lang=en">X(Formely Twitter)</a></li> 
    <li><a href="https://www.notion.so/product">Notion</a></li>

</ol>

</body>
</html>
Output: