Notes on using the blockquote tag

Notes on using the blockquote tag
<br />Semanticization cannot be explained in just a few words, and there is no official and strict definition yet. What is not controversial about <blockquote> is:
1. Quote a longer text
2. Can I use the cite tag or attribute? The question is, does the quoted text in <blockquote> have to be contained by a block-level element?
First, the explanation from W3C
9.2.2 Quotations: The BLOCKQUOTE and Q elements<!ELEMENT BLOCKQUOTE - - (%block;|SCRIPT) -- long quotation --><!ATTLIST BLOCKQUOTE %attrs;
-- %coreattrs, %i18n, %events -- cite
%URI;
#IMPLIED -- URI for source document or msg -- ><!ELEMENT Q - - (%inline;)*
-- short inline quotation --><!ATTLIST Q %attrs;
-- %coreattrs, %i18n, %events -- cite
%URI;
#IMPLIED -- URI for source document or msg -- >
These two notes indicate that the content contained is a quoted text. BLOCKQUOTE is used for long quoted text (block-level content) and Q is used for short quoted text (inline content) and does not allow incomplete quoted sentences.
This example uses text from "The Two Towers", by JRR Tolkien, as the most commonly quoted text.
<BLOCKQUOTE cite="http://www.mycom.com/tolkien/twotowers.html"><P>They went in single file, running like hounds on a strong scent,and an eager light was in their eyes. Nearly due west the broad swath of the marching Orcs tramped its ugly slot; the sweet grass of Rohan had been bruised and blackened as they passed.</P></BLOCKQUOTE>
This article is developed using web standards and mentions the semantics of some tags. The following is an excerpt from <blockquote>
For longer quotations that form one or more paragraphs, the <blockquote> element should be used. CSS can then be used to style the quotation. Note that text is not allowed directly inside a <blockquote> element – ​​it must be contained in an element, usually a <p> element.
Example: <blockquote cite="http://www.w3.org/TR/1999/REC-html401-19991224/struct/text.html"> <p>&#8220;The following sections discuss issues surrounding the structuring of text. Elements that present text (alignment elements, font elements, style sheets, etc.) are discussed elsewhere in the specification. For information about characters, please consult the section on the document character set.&#8221;</p></blockquote>
http://24ways.org/advent/transitional-vs-strict-markup
This article is about transitional-vs-strict, the difference between transitional and standard XHTML, and the difference in content models. Regarding <blockquote>, in strict, the quoted content must be contained in a block-level element, usually <p> or <div>.
Content model differences
An element type's content model describes what may be contained by an instance of the element type. The most important difference in content models between Transitional and Strict is that blockquote, body, and form elements may only contain block level elements. A few examples:
text and images are not allowed immediately inside the body element, and need to be contained in a block level element like p or div
input elements must not be direct descendants of a form element
text in blockquote elements must be wrapped in a block level element like p or div
Therefore, I think that in strict type, block-level elements must be used to contain quoted text, but in non-strict type, it is not necessary. However, it is recommended to do so because strict documents are stricter and can be regarded as backward compatible.

<<:  Docker uses CMD or ENTRYPOINT commands to start multiple services at the same time

>>:  jQuery plugin to implement accordion secondary menu

Recommend

Detailed explanation of application scenarios of filters in Vue

filter is generally used to filter certain values...

Let's talk about parameters in MySQL

Preface: In some previous articles, we often see ...

Understanding the CSS transform-origin property

Preface I recently made a fireworks animation, wh...

How to query and update the same table in MySQL database at the same time

In ordinary projects, I often encounter this prob...

Differences and comparisons of storage engines in MySQL

MyISAM storage engine MyISAM is based on the ISAM...

Solve the problem of spring boot + jar packaging deployment tomcat 404 error

1. Spring boot does not support jsp jar package, ...

How to migrate the data directory in mysql8.0.20

The default storage directory of mysql is /var/li...

Some notes on installing fastdfs image in docker

1. Prepare the Docker environment 2. Search for f...

Front-end JavaScript operation principle

Table of contents 1. What is a JavaScript engine?...

Solution to the problem of MySQL data delay jump

Today we analyzed another typical problem about d...

5 super useful open source Docker tools highly recommended

Introduction The Docker community has created man...

Samba server configuration under Centos7 (actual combat)

Samba Overview Samba is a free software that impl...

Detailed tutorial on how to install MySQL 5.7.18 in Linux (CentOS 7) using YUM

The project needs to use MySQL. Since I had alway...

The textarea tag cannot be resized and cannot be dragged with the mouse

The textarea tag size is immutable Copy code The c...