Learn how to start HTML Basic Tags - Punchitech


This website uploads some web development tutorials, like HTML, CSS, JavaScript, and Bootstrap also PHP and more stuff about web development.

Nov 22, 2019

Learn how to start HTML Basic Tags

HTML Basic tags: This chapter introduces examples of the more commonly used tags in HTML.
You may not have been exposed to these examples, but don't worry, you will be able to master them after reading this chapter! 

HTML title

The HTML title (Heading) is defined by the <h1> - <h6> tag.
hIt is headeran abbreviation of the English title, the title is everywhere, and its application range is very wide: website structure, writing, PPT, etc.
There are six title element labels --  <h1><h2> , <h3><h4><h5><h6>and each element represents a different level of content in the document:
 <h1> Represents the main title (the main heading), <h2> represents two subtitle (subheadings), <h3>represents three subtitle (Sub-subheadings), <h4><h5><h6>followed by decreasing the size of the font.

The Above program preview is given below

HTML paragraph

HTML paragraphs are <p>defined by tags, which Pare paragraphabbreviations for English paragraphs. They are often used to create a paragraph.

The following example describes the structure of the title and paragraph:

What the elements involved in the above examples represent specifically depends entirely on what the author has edited, as long as the hierarchy is reasonable. When creating such a structure, you only need to remember the following:

  • First, you should only use it once for each page <h1>, which is the main heading, and all other headings are below the hierarchy.
  • Second, make sure to use the headings in the correct order in the hierarchy. Don't use it <h3>to represent subtitles, followed <h2>by subheadings, which is meaningless and can lead to strange results.
  • Finally, in the six title levels available, you should ensure that the title level is used no more than three on each page, unless you think it is necessary to use more. Documents with many heading levels can become difficult to navigate and difficult to navigate. In this case, if possible, it is recommended to spread the content across multiple pages.

Spaces in HTML

There may be a lot of spaces in the code - this is not necessary

The following two code snippets are equivalent:

No matter how many spaces you use (including space characters, including line breaks), when rendering the code, the HTML interpreter will reduce the consecutive occurrences of space characters to a single space character.

Why do we use so many spaces? 

The answer is for readability - if your code is well-formatted, it's easy to understand your code, and vice versa. In our HTML code, we have each nested element indented with two spaces.
The style you use to format your code depends on you (such as how many spaces are used for each layer of indentation), but remember that you should stick with a style.

HTML link

HTML links are <a>defined by tags aTags, also called anchor(anchor)elements can be used to link to an external address to implement a page jump function, or to link to a part of the current page to implement internal navigation

For Example: <a href="https://www.arichee.com"> arichee </a>

 Hint:href Specify the address of the link in the attribute.

HTML image

HTML images are <img>defined by tags Use imgelements to add images to your website, using src attributes to point to the specific address of an image.

Here's an example: <img src="https://www.your-image-source.com/your-image.jpg">

Note that the imgelement is a self-closing element and does not require an end tag.

For Example: <img src="arichee.jpeg" width="300" height="300">

Note: The name and size of the image are provided as attributes.

HTML emphasis

In human language, in order to highlight the meaning of a sentence, we usually emphasize certain words, and we usually want to mark certain words as the focus or to some extent. HTML provides a number of semantic elements and allows us to mark the body content by the meaning of these elements. In this chapter, we will see the most common elements.

In HTML we can use em(emphasis)elements to mark such a situation, the browser default style is italic:

<p>I am <em>glad</em> you weren't <em>late</em>.</p>
In HTML we can also use <strong>(strong importance)elements to mark such a request, the browser default style is bold:
<p>This liquid is <strong>highly toxic</strong>.</p>
<p>I am counting on you. <strong>Do not</strong> be late!</p>

Also See this :
HTML Introduction
HTML Editors