Detailed explanation of the differences between similar tags and attributes in HTML

【1】<i></i> and <em></em> tags

Same: Both indicate italics.

the difference:

(1) <em> indicates emphasized content, while <i> is physically italic and has no meaning in terms of content.

(2) The <em> tag is a "semantic" tag, and search engines will understand these semantics. It is specifically set to mean "emphasis" in HTML. When seeing these "emphasis" tags, some screen readers may use different inflection that is more beneficial to SEO.

【2】<br/> and <p> tags

Similarities: Both have line break properties.

Difference: <br/> is used alone; it performs a small line break.

<p></p> is used in pairs; it executes a line break between paragraphs.

【3】<strong> and <b> tags

<strong> is a logical tag that strengthens the tone of a character and expresses emphasis. You can also use CSS to change the specific performance of strong.

<b> is an entity tag, which means bold.

In order to comply with current W3C standards, it is recommended to use the strong tag.

【4】<span> and <div> tags

Same: It is a container tag and is widely used in HTML language. If you replace "<div>" with "<span>", you will find that the effect is exactly the same after execution. Both of them play the role of separating each block.

Difference: <span> is a row-type element and will not wrap before and after it;

The <div> is a block-level element and the elements it encloses will automatically wrap. One div occupies one line.

【5】valign and align attributes

valign: represents the vertical alignment of the row [top, center/mmiddle, bottom]

align: represents the horizontal alignment [left center/middle right]

【6】center and middle attributes

align=middle usually centers the image

align=center usually centers the text

Can be used for the same effect

Usually use center, middle may not work in IE

【7】<button> and <input type="button">

<button> provides more powerful functions and richer content.

Everything between the <button> and </button> tags is the content of the button, including any acceptable body content, such as text or multimedia content.

The only prohibited element is image maps.

Always specify a type attribute for buttons.

The default type for Internet Explorer is "button", while the default in other browsers (including the W3C specification) is "submit".

【8】text-align:center and <center>

<center> not only affects the text, it also centers the entire element.

text-align does not control the alignment of an element, only the inner content.

The element itself is not moved from one section to the other, only the text within it is affected.

【9】Letter-spacing and word-spacing

Letter-spacing refers to the spacing between letters;

Word-spacing refers to the spacing between words.

Chinese characters are usually controlled by letter-spacing.

word-spacing does not work for Chinese