Introduction to Common XHTML Tags

<br />For some time, I found that many people do not know how to use XHTML, not only ordinary beginners, but also some programmers do not know how to write XHTML. Here I would like to summarize some common application problems, which may help everyone to reach a tacit understanding in communication and cooperation.
There are many tags in XHTML, but only a few are frequently used, and you only need to master these few. Let's list them one by one: div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em
In my mind I always think of it as a bottle or a box, and I feel it is quite hard. This div has no special meaning and can be used in many places, which means it can hold different things. The correct way to write it is that <div></div> must have a closing portion. Everyone uses it for layout purposes, and some people use it to store articles to form paragraphs. In fact, this approach is not very good, because there is naturally a specific tag to use as the paragraph of the article. That is the <p></p> tag we will talk about below, but use DIV to wrap all the paragraphs as a whole. This is very practical.
p This is a tag with specific semantics, indicating a paragraph, and is used to distinguish paragraphs. In most browsers, P basically has a top and bottom margin. But there are no line indents, because line indents are just a way to indicate paragraphs but are not necessary or required. Therefore, when using the P tag, you can set the line indent for P if necessary. I recommend not using P outside of the article, because P has certain semantics and may not be appropriate if used elsewhere. The correct way to write it is <p></p>
span is also a very commonly used tag. This tag can be said to be very similar to div and has no specific meaning, but it is a cascading element, not a block-level element. I always think of it as a bag. Unlike a box, it does not have its own width and height. Its width and height can only be determined by the amount of content, so it is very much like a bag. This tag is exactly complementary to div.
ul,li This is a list. In the list, besides UL there is also OL, but I think OL is a bit useless. Because UL can have the same numerical sorting effect as OL through CSS definition. So generally I don’t recommend using OL, UL is enough. UL is block-level, and its child li is also a block-level tag. The correct way to write it is <ul><li></li></ul> The LI tag is wrapped by the UL tag. There can be countless LI tags in the UL tag. The LI tag cannot be used independently. And the LI tag must be sealed, which is not only a matter of aesthetics, but also beneficial for later maintenance. Many programmers don't like to seal this LI. The purpose of UL list is mainly to list one-dimensional data of the same type. Specific examples include using it on menus, listing some rules in articles, etc. There is a special form in the list that is different from UL. That is the following DL
dl,dt,dd This is a very special combination of three labels. Here DT refers to the title and DD refers to the content. DL is the container that contains them. The correct way to write it is <dl><dt></dt><dd></dd></dl>. There can be many groups of DT and DD in DL. When there are many groups, try to match one DT with one DD. If there is a lot of content in DD, you can add a P tag in DD for use together. The DL list is a very good list format and can be used more often.
a This represents a link, which is a specific attribute and is also the most magical tag on the web page. Because it connects countless web pages together. The correct way to write it is: <a href="" title=""></a>, where href indicates the target address and TITLE is the prompt text when the mouse is hovering over it, which is optional. But the benefits must outweigh the absence.
img This is an image tag, and also a tag with specific attributes. The normal way of writing is: <img src="" alt="" title=""/> Here src is the target address, ALT and TITLE are replacement text, ALT is IE-specific, and TITLE is universal for other browsers. But remember that the backslash at the end is a must.
H This is a series of labels, from H1 to H6, a total of six. Some people say it is too few, some say it is just right, and some say that so many are not needed. Anyway, I think it's about the same. The correct way to write it is: <h></h> is mainly used to store titles, and some friends use it for other purposes. Personally, I think it’s better to leave this tag alone and just use it as a title. It is best not to have any mutual inclusion between these six labels.
The word strong means to emphasize, which has semantics and its function is very simple. As for the sample work, whether to emphasize with bold or to use color to emphasize is up to you. The correct way to write it is <strong></strong>
em is very similar to strong and is used to express emphasis. The default setting in most browsers is italic. The usage is the same as strong. The writing method is:
The form is not mentioned here because the form has basically not changed and there is nothing special to say.

<<: CSS3 transition to achieve underline example code

>>: Bundling non-JavaScript static resources details

Implementation of docker redis5.0 cluster cluster construction

Introduction to Common XHTML Tags

Implementation of docker redis5.0 cluster cluster construction

Install JDK8 in rpm mode on CentOS7

A brief analysis of how to set the initial value of Linux root

How to add, delete and modify columns in MySQL database

Detailed explanation of MySQL database paradigm

Detailed explanation of Vue data proxy

Markup Language - List

Javascript destructuring assignment details

H tags should be used reasonably in web page production

Detailed explanation of the application of CSS Sprite

Recommend

Using trap to perform environment cleanup before graceful shutdown of docker container

Docker installation and deployment example on Linux

Use of environment variables in Docker and solutions to common problems

A brief discussion on MySQL select optimization solution

Pure CSS to achieve automatic rotation effect of carousel banner

Analysis of the Poor Performance Caused by Large Offset of LIMIT in MySQL Query

Detailed explanation of how to restore database data through MySQL binary log

How to optimize logic judgment code in JavaScript

MySQL: mysql functions

CSS achieves the effect of changing the color of the entire line when the mouse is placed on it

IE6/7 is going to be a mess: empty text node height issue

MySQL constraint types and examples

How to use localStorage in JavaScript

Solutions to VMware workstation virtual machine compatibility issues