HTML blockquote tag usage and beautification

HTML blockquote tag usage and beautification

Blockquote Definition and Usage

 The <blockquote> tag defines a blockquote.
All text between <blockquote> and </blockquote> is separated from the regular text, often indented on the left and right (increased margins), and sometimes italicized. That is, blockquotes have their own space.

There are no differences between HTML and XHTML.

Tips and Notes:

 Tip: Use the q element to mark short quotations.

Note: To validate the page as strict XHTML, the <blockquote> element must contain a block-level element, like this:


Copy code
The code is as follows:

<blockquote>
<p>here is a long quotation here is a long quotation</p>
</blockquote>



Tip: You can modify some of the code before running


Status in browser:

CSS blockquote beautification effect


I believe everyone is familiar with blockquote. It is called "text box" in Word, and in fact it can be called text box on the web page. If you add blockquote tags at both ends of a paragraph of text, the text will be displayed, and the text inside will contain the format of blockquote, so as long as you define the various properties of blockquote with CSS, you will find that this will be a good thing. Note that IE does not support some of the definitions in this CSS code, and Firefox or Chrome will display the best results.


Tip: You can modify some of the code before running

<<:  A QQ chat room based on vue.js

>>:  Detailed explanation of table return and index coverage examples in MySQL

Recommend

How to use nginx to configure access to wgcloud

The nginx configuration is as follows: Such as ht...

JS native 2048 game source code sharing (the latest on the Internet)

I have been learning about algorithms recently an...

Docker realizes the connection with the same IP network segment

Recently, I solved the problem of Docker and the ...

Steps to deploy Spring Boot project using Docker

Table of contents Create a simple springboot proj...

How to allow remote connection in MySql

How to allow remote connection in MySql To achiev...

Detailed explanation of the use of Vue3 state management

Table of contents background Provide / Inject Ext...

Several methods of implementing two fixed columns and one adaptive column in CSS

This article introduces several methods of implem...

Detailed explanation of compatibility issues and solutions for setting max-width and min-width in table

Setting min-width and max-width properties in tab...

How to install yum source and upload and download commands rz and sz under CentOS7 (with pictures)

** Detailed graphic instructions for installing y...

Five delay methods for MySQL time blind injection

Five delay methods for MySQL time blind injection...

Basic use of subqueries in MySQL

Table of contents 1. Subquery definition 2. Subqu...

Summary of 28 common JavaScript string methods and usage tips

Table of contents Preface 1. Get the length of a ...

Vue2 cube-ui time selector detailed explanation

Table of contents Preface 1. Demand and Effect ne...

A brief discussion on the CSS overflow mechanism

Why do you need to learn CSS overflow mechanism i...

How to make full use of multi-core CPU in node.js

Table of contents Overview How to make full use o...