HTML Basic

HTML (HyperText Markup Language) teaching

Kevin Li
by Kevin Li 6:15 PM

 HTML (HyperText Markup Language, HyperText Markup Language) is the basic language used to write web pages. Usually HTML is used with CSS and JavaScript to develop web applications.

HTML is a "markup language" rather than a programming language, and web browsers such as common Chrome, IE, Safari, Firefox know how to read HTML files and present the content described in HTML on the page on.

So, why learn HTML? Because HTML is one of the three basic languages ​​for web development:

  • HTML: Used to describe the content and semantic structure of web pages
  • CSS: used to describe the style of the web page and how the screen is rendered
  • JavaScript : Used to describe the behavior of web pages, allowing web pages to interact with users and servers

For frontend developers, HTML is a must-learn skill!

So, what can we describe with HTML? For example, we can use HTML syntax to describe the title of a web page, a paragraph, a table, embed images, videos, or create interactive forms in the web page.

An HTML archive file (HTML document) will look like a bunch of labels consisting of (tags) structure, called a label is a use angle brackets <tagname> ... </tagname>surround HTML elements (HTML elements), surrounded by different labels represent different In the content block, the browser will interpret the HTML tags to present the content of the web page, but will not display the tags themselves on the page. The tags are only used to mark and distinguish different semantic content.

HTML files are essentially pure text files. For example, an HTML file will look like this:

<!DOCTYPE html>
<html>
  <head>
    <title>Page title</title>
  </head>
  <body>
    <h1>This is the first level heading</h1>
    <p>This is a paragraph</p>
  </body>
</html>

The content surrounded by each HTML tag can contain other HTML tags, so the structure of HTML file belongs to a hierarchical tree (nested) structure:

         +-------+
         | html  |
         +---+---+
             |
    +--------+------+
    |               |
 +--+---+        +---+--+
 | head |        | body |
 +--+---+        +---+--+
    |                |    
+---+---+       +----+----+
| title |       |         |
+-------+   +---+--+   +--+--+
            |  h1  |   |  p  |
            +---+--+   +--+--+
                |         |
              text      text

Briefly explain the HTML file above, where:

  • <!DOCTYPE html> The tag is used to declare that this is a document using HTML5 syntax standards
  • <html> The tag is the root element of the HTML file
  • <head> The tag contains the content that will not be displayed on the page, which is used to describe the meta-information about the page (metadata)
  • <title> The tag is used to specify the title of the webpage, usually displayed on the browser tab
  • <body> The label contains the content that will be displayed on the page
  • <h1> Tags are used to specify the first level/most important title
  • <p> Tags are used to contain a paragraph of text

So how do you see what the edited HTML page actually looks like? The answer is very simple, just open it with a browser, drag the HTML file to the browser and open it directly, or right-click on the HTML file and choose to open the file with the browser!

Kevin Li

Posted by Kevin Li

Post a Comment

0 Comments