As a blogger, sometimes we want to insert quotes where the text of the quote is placed between double inverted quotation marks. It is good to have quotations stand out from the regular text on the web page. Blogger allows the addition of "Blockquote" but the default style is dull. Luckily, we can revamp the Blockquote style using our own CSS code. In this post, we will see some simple customization of Blogger Blockquote without using any external image backgrounds.
Blockquote is an HTML tag used to define long quotations. According to the W3C HTML5,
How to add a quote in Blogger?
To add a quote in Blogger, use the Blockquote tool from the toolbar. Select a text and click the Blockquote or in a new line, click on the Blockquote tool and start typing.
Where to place the CSS code to customize Blogger Blockquote style?
- Go to Blogger Dashboard > Click Your Blog Site > Template > Customise
- Click on Advanced > Add CSS > Paste code
- Apply To blog.
CSS CODE :
That's It! Do You Like This ???
.blockquote {
background-color: lightgrey;
border-left: 4px solid #03ba93;
margin: 10px;
padding: 10px;
font-size: 16px;
font-style: italic;
font-family: Arial;
}
background-color: lightgrey;
border-left: 4px solid #03ba93;
margin: 10px;
padding: 10px;
font-size: 16px;
font-style: italic;
font-family: Arial;
}
