Basic HTML Guide part 1
Hello Again. Now let's have a quick guide in HTML. okay, let's Start!
Before we begin, let's have a quick look on what we will do..
Before we begin, let's have a quick look on what we will do..
The image above will be our output.
So, what's the requirements for this lesson?
* Web Browser (Google Chrome, Mozilla Firefox, Safari, or Internet Explorer)
Recommended Web Browser : Google Chrome / Mozilla Firefox
* Text Editor ( notepad, gedit, vim, sublimetext)
Recommended Text Editor: sublime text(windows) / atom(macintosh)
* Determination and a Couple of Concentration
Yes, That is all you need for this lesson. Now let's begin.
Now, let's open your Text Editor, and type the following:
<html>
<head>
</head>
<body>
<p>Hello World!</p>
</body>
</html>
Save it as anyname.html
Now let's try to open your HTML file with your Web Browser.
Wow, Awesome it works! Why? How?
Notice that <html> tag? It is the file's definition that you're creating a HTML file, Some browser might accept file without <html> tag, but its not a good practice to exclude it from our file.
So, your whole File will be wrapped with Opening and Closing HTML tag. Just like what we did.
Now what's next? Just like Human Anatomy, head comes first before the body. Anything inside <head></head> won't appear in your screen.
Why? Because head tag is used for loading StyleSheets(CSS), Scripts(JS/VB), and Meta Tags. So, whatever you write inside the head tag will never appear inside your main screen.
Now the Body, everything you write inside it will be shown in your browser's screen. The example for that is that Hello World Text you've typed earlier.
What's the P tag? P tag stands for Paragraph, used for creating a paragraph text.
Another important tag is the <br /> tag. it comes in solo. It allows you to break the line of your text/ elements. for example.
Hello <br /> World
will output
Hello
World
Now let's try what you've learned.
Using the Things You've learned. Create a HTML file that contains the following.
Your Name, Age, Address, and Favorite Quotation.
Upload a Screenshot of your progress and Comment it down below :D
Feel Free to Suggest, and Please Stay Tuned for more Updates!
So, what's the requirements for this lesson?
* Web Browser (Google Chrome, Mozilla Firefox, Safari, or Internet Explorer)
Recommended Web Browser : Google Chrome / Mozilla Firefox
* Text Editor ( notepad, gedit, vim, sublimetext)
Recommended Text Editor: sublime text(windows) / atom(macintosh)
* Determination and a Couple of Concentration
Yes, That is all you need for this lesson. Now let's begin.
Now, let's open your Text Editor, and type the following:
<html>
<head>
</head>
<body>
<p>Hello World!</p>
</body>
</html>
Save it as anyname.html
Now let's try to open your HTML file with your Web Browser.
Wow, Awesome it works! Why? How?
Notice that <html> tag? It is the file's definition that you're creating a HTML file, Some browser might accept file without <html> tag, but its not a good practice to exclude it from our file.
So, your whole File will be wrapped with Opening and Closing HTML tag. Just like what we did.
Now what's next? Just like Human Anatomy, head comes first before the body. Anything inside <head></head> won't appear in your screen.
Why? Because head tag is used for loading StyleSheets(CSS), Scripts(JS/VB), and Meta Tags. So, whatever you write inside the head tag will never appear inside your main screen.
Now the Body, everything you write inside it will be shown in your browser's screen. The example for that is that Hello World Text you've typed earlier.
What's the P tag? P tag stands for Paragraph, used for creating a paragraph text.
Another important tag is the <br /> tag. it comes in solo. It allows you to break the line of your text/ elements. for example.
Hello <br /> World
will output
Hello
World
Now let's try what you've learned.
Using the Things You've learned. Create a HTML file that contains the following.
Your Name, Age, Address, and Favorite Quotation.
Upload a Screenshot of your progress and Comment it down below :D
Feel Free to Suggest, and Please Stay Tuned for more Updates!