Detailed explanation of the use of title tags and paragraph tags in XHTML

Detailed explanation of the use of title tags and paragraph tags in XHTML

XHTML Headings Overview
 When we write Word documents, we often use titles, such as "Chapter 1", "1.2.1", etc. There is also the concept of headings in XHTML syntax. XHTML defines six levels of headings, <h1> to <h6>:

XML/HTML CodeCopy content to clipboard
  1. < h1 > First level heading </ h1 >   
  2. < h2 > Second level heading </ h2 >   
  3. < h3 > Third level heading </ h3 >   
  4. < h4 > Fourth level heading </ h4 >   
  5. < h5 > Fifth level heading </ h5 >   
  6. < h6 > Sixth level heading </ h6 >   

Use of Titles
 In XHTML documents, titles are very important. Search engines use titles to index the structure and content of your web pages. We should be good at using titles to identify our document hierarchy.
In the headings, the first-level heading is the highest, and then it decreases in order. Generally speaking, in an XHTML document, headings apply to the following places in the document (within the <body> tag):
According to the website level:
<h1> defines the website title
<h2>Define website navigation or columns
<h3>Define article titles according to website content:
<h1> defines the website title
<h2>Define the article title
<h3>Define column title. For titles h4 to h6 that are larger than h3, they can be used in appropriate places, such as copyright statements or disclaimers, which are relatively important places.
Also please note that the levels must be descending. Below h1 should be the h2 level, and then h3...


Some suggestions for using titles
 Since h1 represents the core content of the entire page, generally speaking h1 can only appear once (not absolutely, but it definitely cannot appear multiple times) and is used in the most emphasized part of the article. So if it is a specific content page, h1 is often used in the title of the article to highlight the importance of the article, such as this site:

XML/HTML CodeCopy content to clipboard
  1. <h1> XHTML title​​​​   

Whether the website title (website logo) should use h1 at this time depends on the actual situation.
Title Use Exercise Open our learning document 1.html file with an editor and copy the above <h1> to <h6> tags into the <body> tag:

XML/HTML CodeCopy content to clipboard
  1. < body >   
  2. < h1 > First level heading </ h1 >   
  3. < h2 > Second level heading </ h2 >   
  4. < h3 > Third level heading </ h3 >   
  5. < h4 > Fourth level heading </ h4 >   
  6. < h5 > Fifth level heading </ h5 >   
  7. < h6 > Sixth level heading </ h6 >   
  8. < p > hi~Hello! </ p >   
  9. </ body >   

Save and open the 1.html file with a browser (if it is already open, click the browser refresh button to reload the document, the same below, no further instructions), you can see the effect of the title tag as follows:
201636113918682.gif (396×290)

As can be seen from the example, the browser will automatically form a line break for a title (each title occupies a line of its own).

Paragraph p tag
 In XHTML, paragraphs are defined by the <p></p> tags.
XHTML Paragraphs
 Paragraph tag example:

XML/HTML CodeCopy content to clipboard
  1. < p > This is a paragraph. </ p >   

In actual production work, we use <p></p> paragraph tags extensively.
After adding a paragraph tag to the text, the browser will automatically add a paragraph break to the text. But we should not rely on empty <p></p> to form a blank line, but should use <br /> line break tags.


Line break<br />
 In XHTML documents, the title or paragraph tag only provides a line break marker. If we need a blank line or multiple line breaks, we need a line break tag <br /> . In XHTML, it is invalid to press the Enter key to create a line break in the same way as editing Word. The browser will ignore the line break space generated in this way.
Examples:

XML/HTML CodeCopy content to clipboard
  1. <p> This is some content </p>​   
  2. < br   /> < br   />   
  3. < p > Here is some other content </ p >   

Since the line break tag only tells the browser that a line break is needed at this place and has no substantial content, this tag does not appear in pairs, and one <br /> only breaks the line once. If multiple line breaks are required, please enter multiple <br /> tags.
If you insert a <br /> tag in <p></p>, it will also produce a line break effect.


<br />or<br>?
 Although we can still achieve the line break effect by using <br>, that is the result of the browser being compatible with the HTML4.0 specification.
In the XHTML specification, for tags that are not paired, you only need to add a space after the end of the content and then close the tag with />, such as <br /> and tags such as <img /><input /> to be discussed later.
So it's <br /> instead of <br/> or <br> .

<<:  Solution to "No such file or directory" in locale after installing glibc-2.14 in CentOS6.5

>>:  Essential conditional query statements for MySQL database

Recommend

Solution to the problem that elements with negative z-index cannot be clicked

I was working on a pop-up ad recently. Since the d...

Detailed explanation of MySQL database isolation level and MVCC

Table of contents 1. Isolation Level READ UNCOMMI...

uniapp Sample code for implementing global sharing of WeChat mini-programs

Table of contents Create a global shared content ...

Docker and Docker-compose one-click installation tutorial (supports online and offline)

Shell Script #!/bin/sh # Current directory CURREN...

Solve the problem of HTML automatic formatting after saving in vscode

The version of vsCode has been updated in recent ...

HTML uses marquee to achieve text scrolling left and right

Copy code The code is as follows: <BODY> //...

Example of implementing dashed border with html2canvas

html2canvas is a library that generates canvas fr...

Detailed process of upgrading gcc (version 10.2.0) under CentOS7 environment

Table of contents Short Introduction 1. Check the...

Nginx proxy axios request and precautions

Preface I recently wrote a small demo. Because I ...

Analysis of MySQL example DTID master-slave principle

Table of contents 1. Basic Concepts of GTID 2. GT...

Negative margin function introduction and usage summary

As early as in the CSS2 recommendations in 1998, t...

MySQL master-slave replication principle and points to note

Written in front I have been writing a special to...

Problems and pitfalls of installing Mysql5.7.23 in Win10 environment

I read many tutorials, but found that I could nev...

Detailed tutorial on how to automatically install CentOS7.6 using PXE

1. Demand The base has 300 new servers, and needs...

Detailed explanation of the seven data types in JavaScript

Table of contents Preface: Detailed introduction:...