Web standards knowledge - tags with similar uses_Experience exchange

We have already talked about the difference between strong and em before. In addition to strong and em, there are some similar tags such as q, cite, and blockquote. These three all belong to the category of references, but there are still some differences here. Let’s explain them one by one first.

, the function of q is to quote non-block elements, that is, to quote content that cannot form a paragraph. It may be a sentence said by someone, or it may be a document excerpt, etc. Features Obviously this is "one sentence".And q itself does not generate paragraphs. q itself does not have any style, and general browsers will not set a default style for it to make it stand out. But we can use CSS to distinguish it from general content. There is another attribute in the q tag that is very important, and that is cite. In this cite attribute value, it is mainly to indicate where the quoted content comes from, or to give the online address.

This content will allow you to further understand the details in the paragraph Be especially careful not to write q instead of p, as these two labels are easy to make mistakes.

In fact, I have already talked about cite in the previous article. In that article, I wrote, "This tag only indicates the title and name of the document. This tag is somewhat similar to the references at the back of our books. The contents of the table of contents are a bit like footnotes." So what is the difference between him and q? In fact, it is easy to understand, q is to display the content, and cite is to display the name of the person or book title who said this content. Cite and q are often used together. For example:

Mr. Lu Xun said: Originally there were no roads on the ground, but as more people walked on them, there were roads.
So what is the difference between blockquote and them? A blockquote is a block quote that XHTML allows to contain any tag. The q and cite above are not so inclusive. The use of blockquote is used when one or more paragraphs of content need to be quoted. Browsers generally indent the quoted content by default to distinguish it from normal paragraphs. Of course we can change the form of distinction through CSS styles.

There is a cite attribute in blockquote, which, like q, is used to indicate the source of the citation. You can indicate the URL of the online documentation in it.

There is also a tag called pre in the XHTML tag. This tag is called "formatting" in Dreamweaver. When I used Dreamweaver before, I never knew what this thing was used for. It’s only now clear that pre is usually used to display source code, and does not support tags that can separate paragraphs such as

. If the displayed content needs to be wrapped, just wrap it in the source file and no code is required to implement it. At the same time, pre will retain all the spaces in the note and display them.

Generally speaking, pre is currently used to display source code, which is similar to code. The difference is that pre is block-level, while code is inline. Simply put, pre can include multiple lines of content, while code only contains a short sentence or a few characters.

What is described here cannot be fully explained, so you need to try it out after reading the document and discover the special features by yourself. A friend said that he would like to see some knowledge about CSS. Here I want to convey my writing intention. I hope to go step by step so that some friends who have not yet escaped from the table layout can first use some forms that will not affect the overall layout. Because there may be compatibility issues when CSS is involved, I will talk about documentation first, and then add some CSS knowledge that does not affect the overall layout. Going deeper step by step will eventually allow readers to naturally transition from table layout to standard power.Of course, if there are friends who have completed this step through self-study, they can communicate with me in my "Miscellaneous Talk Standards" column.