DEV Community

Cover image for HTML Noob Basics
Muhammad
Muhammad

Posted on

HTML Noob Basics

What is HTML?

It is a language that is represented by <> tags. HTML is where we decide what to make bold, italic, justified paragraphs and images.

Alt Text

Lets put it into action, create a test.html file in the php_start directory that we have been following. Write the following piece of code.

<h1>Hello Noobs</h1>
Enter fullscreen mode Exit fullscreen mode

Alt Text

Now lets run the file, Great.

This is a heading tag, its starts with

and ends with a forward slash

Now here is how a proper html file will start

<!DOCTYPE html>
<html lang="en">
   <head>
     <title>Page Title</title>
   </head>

   <body>
      <h1>This is a Heading</h1>
      <p>This is a paragraph.</p>
      <p>This is another paragraph.</p>
   </body>
</html>
Enter fullscreen mode Exit fullscreen mode
  • <!DOCTYPE html> This defines that this is now HTML5 (It is a latest version of HTML)
  • This defines that it is the base where we start the file, we have also defined the language in it.
  • This section is where we define the title add styles, add scripts and add the meta of the file where we get search engine optimized pages.
  • This is where everything becomes beautiful, by styling that which we want to display.

Now lets see some more codes

//LINKS
<a href="url">link text</a>

//IMAGES
<img src="path/to/your/image.jpg" alt="title">

//LISTS
<ul>
  <li>Happy</li>
  <li>Still Happy</li>
  <li>Way Happy</li>
</ul>

//PARAGRAPHS
<p>This is the Noob World</p>

//EMBED YOUTUBE
<iframe width="500" height="500" src="https://www.youtube.com/watch?v=dT4A3rttrs8" />
Enter fullscreen mode Exit fullscreen mode

Noob Index

Top comments (0)