There is such a piece of HTML, please find fault:
This is the original Yahoo pen test question (the text has changed). It has been used for many years, and no one has completely answered it correctly.
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ the solution part================
The motivation for this question is that too many people think HTML is too simple, but it is the most basic and important part of front-end development. The reasonableness of the HTML structure design directly affects the ease of code maintenance, flexibility, and web page performance and collaboration efficiency. Many people think that front-end development is javascript development, which is totally wrong. Javascript, html and css, the three basic pillars of front-end development, are completely different in nature and closely related. A correct understanding of them and a reasonable application are the differences between professional and non professional. Some back-end engineers can write beautiful JS, but they really don't know how to reasonably combine js, html and css. The accurate grasp of html is not the same as learning general programming languages, but is based on rich practical experience and experience. It is the basic skill of front-end engineers.
This is not a real question or a fake question, but a serious question of "drawing eggs", which tests basic skills. The code is like a person, and his understanding of a line of code is enough to reflect his front-end development literacy.
get down to business. Examination site of this question:
Test point 1: Differences between html and xhtml
This line of code is completely correct under the html 4.01 strict, and is full of errors under the xhtml 1.0 strict. So it is obviously a test site. In xhtml, all tags are closed. P and br need to be closed. Tags cannot be capitalized, but P needs to be lowercase. Both nbsp and br must be included in the container. Html is not wrong. P In html, closing tags are optional, and closing is not required.
This test point tells you how harsh xhtml is. This is the basic test point. If you answer correctly, you can get 60 points.
Test site 2: Test style separation
It is unreasonable to use nbsp to control indentation. CSS should be used for this. So you should delete nbsp
Test point 3: Rational use of labels
Br is a forced line break label, and p is a paragraph. The original question uses continuous br to create two paragraphs. The effect is achieved, but it is obviously unreasonable, and the paragraph spacing can no longer be controlled later. The correct way is to use two p's to represent two paragraphs. It is reasonable to use br for normal text folding after "I said".
If you answer all the questions correctly, you will get 100 points.
Results of improvement on the original question:
<p>What I wrote is not HTML, but loneliness</ p> <p>I said:<br/>Don't be infatuated with brother, he is just a legend</p>
Bonus points: reasonable semantic labels
On the basis of the above, reasonable semantic labels and necessary marking of content are added. However, the excessive use of labels will add insult to injury. For example, "I said" can be marked with the q tag.
<p>What I wrote is not HTML, but loneliness. <p>I said:<br><q>Don't be infatuated with brother, he is just a legend</q>
I think this is enough. If we go further, "I" is marked with cite, and "HTML" is marked with abbr or acronym (it is too true to discuss the difference between abbr and acronym), it is OK. No matter how complicated it is, it is unnecessary.
<p>What I wrote is not<abbr title="Hyper Text Markup language">HTML</abbr>, but loneliness. <p><cite>I</site>said:<br><q>Don't be infatuated with brother, brother is just a legend</q>
