The difference between em and strong can be discussed from three levels.
First, let’s see the instructions in html 4.01:
em: indicates emphasis.
strong: indicates stronger emphasis.
em expresses emphasis, strong expresses a stronger emphasis. It is concise and to the point, indicating the origin of the naming of em and strong. And in the browser, em is represented in italics by default and strong is represented in bold. This is the first level of difference.
On the second level, we have made a good summary in the two articles emphasis in context versus overall highlighting and em vs. strong:
em is used for partial emphasis, while strong is global emphasis. Visually, em's emphasis is in sequence, and it will be noticed only when you read somewhere. The emphasis of strong is a random and unordered keyword sentence that is immediately highlighted when you see a certain article. Italics and bolds just satisfy these two visual effects, so they become the default styles of em and strong.
I feel that the above has been explained very clearly? Let’s take a look at the difference at the third level. The html5 draft provides detailed explanations:
em represents the focus of the content (stress emphasis), strong represents the importance of the content (strong importance). strong will not change the semantics of the sentence where it is located, em will change the semantics of the sentence where it is located. And give a very good example:
<p><em>cats</em> are cute animals.</p>
Emphasizing cats discusses which animal is smart and cute.
<p>cats <em>are</em> cute animals.</p>
The emphasis is, it is discussed whether cats are smart and cute.
<p>cats are <em>cute</em> animals.</p>
Emphasizing cleverness and cuteness is a discussion of whether cats are smart and cute or stupid or annoying.
<p><strong>warning.</strong> this dungeon is dangerous.
<strong>avoid the ducks.</strong> take any gold you find.
<strong><strong>do not take any of the diamonds</strong>,
They are explosive and <strong>will destroy anything within
ten meters.</strong></strong> you have been warned.</p>
strong means an emphasis on importance and will not cause changes in the meaning of the sentence. Finally, pay attention to how heavy both em and strong can have. For example, it is important to use two strong to express the content.
It can be seen that the local emphasis and global emphasis mentioned at the second level are not accurate enough. The mystery of the difference between em and strong is vividly explained in the html5 draft. I recommend that you read the html5 draft carefully when you have time. There are many elements that are explained very clearly and are of great value for how we use the most appropriate labels in the most appropriate places.
Finally, in the reply to the front-end and migrant workers’ articles, and in the emails received, I regret not to find anyone who knows the difference at the third level. Therefore, the gifts prepared (I really prepared 10 copies) were so lonely that I couldn't send them out. However, this article is just an introduction. Next, we will use a series of articles to explore the semantics of elements in html. The promise of gifts continues to be effective, leaving it to the next topic:
Please explain the semantics of dl and list at least 5 usage scenarios.
You can check the information, post the results in the reply, or send me an email. Gifts are limited, and the first 10 answers are correct must be given.
Additional: I discussed it with some friends, and my final opinion is:
em is a sentence that adding or not adding will cause semantic changes.
Strong emphasizes importance, and has nothing to do with local or global. It is also possible to emphasize strong locally. Strong emphasizes importance and will not change the meaning of the sentence.