Master the commonly used HTML tags for quoting content in web pages

Use blockquote for long citations, q for short citations, and cite for references. In practice, only blockquote and q are usually used.
According to the HTML specification, there are three elements for quoting content, namely <blockquote> <q> <cite>. In reality, these tags are rarely used, so when you do apply them, which tags should you use? You have to be very familiar with their semantics.
<blockquote>
A blockquote is a quotation of content. The content must include block-level elements such as headings, lists, paragraphs, or div tags. This element can also have an optional attribute cite that specifies the location (in the form of a URI). For example:
<blockquote cite="https://www.jb51.net/reference/htmltags/blockquote/">
A large quotation. The content of a blockquote element must include block-level elements such as headings, lists, paragraphs or div's.
cite can be used to specify the location (in the form of a URI) where the quote has come from.
</blockquote>
<q>
The <q> tag defines a short quote. The <q> tag is essentially the same as a <blockquote>. The difference lies in their display and application. The <q> tag is used for short inline quotations.
Bob said <q>sexy pyjamas</q> but Chris said <q>a kimono</q>
Although <q> is almost never used, it has some useful properties. For example, you can specify the appearance of the <q> quotation mark symbol through CSS. This is allowed
Q {}
Q {quotes: '»' '«' }
Q {quotes: '„' '“'}
It seems good, but it is not supported by the entire IE series, not even the latest IE8. Huge embarrassing~~
<cite>
Use this tag to define a reference, such as a book or journal title. For example:
And <cite>Bob</cite> said <q>No, I think it's a banana</q>.
Summarize:
Use <blockquote> for long citations, <q> for short citations, and <cite> for references. In practice, only <blockquote> and <q> are usually used.

<<: Detailed explanation of the use of the clip-path property in CSS

>>: Issues installing Python3 and Pip in ubuntu in Docker

Detailed process of creating a VR panoramic project using React and Threejs

Solution to the problem that a line is left blank for no reason on the utf8-encoded page under IE and the utf8 page cannot be displayed

Blog

CSS3 new layout: flex detailed explanation

Master the commonly used HTML tags for quoting content in web pages

Detailed process of creating a VR panoramic project using React and Threejs

Example of how to implement MySQL cascading replication

Using jQuery to implement the carousel effect

Detailed explanation of MySQL joint query optimization mechanism

A brief discussion on MySQL count of rows

Solution to the problem that a line is left blank for no reason on the utf8-encoded page under IE and the utf8 page cannot be displayed

CSS3 new layout: flex detailed explanation

How to implement encryption and decryption of sensitive data in MySQL database

Differentiate between null value and empty character ('') in MySQL

Detailed explanation of commands to view linux files

Recommend

Detailed explanation of the relationship between React and Redux

Mysql tree-structured database table design

How to connect XShell and network configuration in CentOS7

Importance of background color declaration when writing styles

Detailed tutorial on installing Protobuf 3 on Ubuntu

Detailed Example of MySQL curdate() Function

How to remotely connect to MySQL database with Navicat Premium

CSS uses position + margin to achieve the method of horizontal and vertical centering of fixed boxes

Pure CSS to hide the scroll bar but still have the scrolling effect (mobile and PC)

Pure CSS to modify the browser scrollbar style example

Canonical enables Linux desktop apps with Flutter (recommended)

The viewport in the meta tag controls the device screen css

Overview and Introduction to Linux Operating System

How is a SQL statement executed in MySQL?

Tutorial on installing MySQL 5.7.18 decompressed version on Windows