Set the presentation method of blockquote tag in the article content

First, explain what "blockquote" is: in html, blockquote is a "block reference". The w3c is explained as follows:

The<blockquote>tag definition is a block reference taken from another source.

All text between<blockquote>and</blockquote>will be separated from regular text, often indented on the left and right sides, and sometimes italicized. That is, block references have their own space.

The above is a blockquote content, which is usually used when the content of an article refers to the content of other websites. This tag is also very simple for zblog to use. When editing an article, select the text and click the button shown in the following figure:

The display effect of undefined blockquote is that the left and right sides are indented by some distance, which is obviously not beautiful, so this article is for you Show how to set the display mode of blockquote tag in the article content 。

This article gives a total of two display methods, one is that I think is better, and the other is that many people think is better like Lu Songsong's website.

First:

 blockquote {border-left: 10px solid rgba(102, 128, 153, 0.075);background-color: rgba(102, 128, 153, 0.05); border-radius:0 5px 5px 0; padding: 15px 20px;  margin-left:0; margin-right:0;color:#666;}

Second:

 blockquote {     margin: 10px;     border: 1px dashed #D0D4C8;     background: #F4F5F6 url(" http://lusongsong.com/zb_users/theme/LuSongSong/style/images/blockquote.gif ") no-repeat scroll 5px 3px;     padding: 8px 12px 8px 36px; }

usage method : You can copy the css of any way you like and put it anywhere in the css file of your website.