Custom "Block quotes" for blogger.

Friday, 1 October 2010 by nkoknki | 1 comments

--"Blockquotes" is often quotes (" ") in the text to mark the highlight quotes from other sources. In Blog, "Blockquotes" is used in body text to mark highlights points, or quotes, or notes, "Blockquotes" may have background different from body text.

--In most Blogger templates are verified definition block " blockquotes" which appear in sample between two command tags <b:skin>. In this blog, I customized background of "Blockquotes" to make more highlight orginal "Block quotes". In this article, I will give examples and show you options " Blockquotes" to have highlight point invidual for you.

If you don't use often it, you can confuse about using it in article. You needn't worry because they are easy for using.

--If you compose posts in Blogspot, to mark "Blockquotes" any text, you simply highlight and click on the button marked (") as shown below:

--This button is also available in HTML editor, is also very easy to use as mentioned above, plus you can also select the text "Blockquotes" by putting your text in the tag <blockquotes>, as in below:

<blockquote>Write your quotations here</blockquote>

--Confirm the definition of "block quotes" in the template like?In the template (the middle portion of the card and <b:skin> </ b: skin>), you can find it like this:

blockquote {
margin:1em 20px;
}

--As you can see, a confirmation number on the command line "Blockquotes" appears like when you published your article. By default, any text that appears in <blockquote> tags will be displayed left aligned. And most "Blockquotes" are defined by the margin to margin clear division between the text quoted by them and the text of the article. As you can see in the example above.
In your blog template, you may find there. "Post" is added before the "blockquote." This component will "define" certification block "Blockquotes" will show how in the article, at which the write block quote. However, if you intend to use the sidebar / footer / header-style format "Block quote" you should give. "Posts" to appear in every Quoting the same article in the article.
Custom to make a few style "citing" new
In the next section, I present you with custom or common blocks are used to cite different from your default template, namely: Customize borders, backgrounds and font styles.BordersAdd borders to frame the use of block quotes to influence the impact by intuition, it will clear division between the block quote and the article. The most common way to add to the current Border cited as additional lines of code red below:

blockquote {
margin:1em 20px;
border: 1px solid #000000;
padding: 5px;
}

A solid black border - black frame around the block quote immediately defined above is: 1px (1pixel frame border width), solid (not leaving immediately) # 000000 (black). "Padding" in this example is the distance from the margins to position the text frame.

--Here are other examples of block quotes when you change the border style:

blockquote {
margin:1em 20px;
border: 3px dotted #ff0000;
padding: 10px;
}

Result: Maintenance supervisors red dot is 3 pixels wide, the distance to the margin is 10 pixels

--You can experiment to create different effects on the border with their attributes including color. You can refer to their properties in Tizag's excellent tutorial.Use background color and imagesYou can also use a combination of background color and images to create a block quote according to your own definition:

blockquote {
margin:1em 20px; background: #cccccc;
}

--This example uses images combine to create block quotes, you can refer to the instructions below to create a definition for block quote using visual effects.

Nghe
Đọc ngữ âm
blockquote {
margin:1em 20px;
background: #dfdfdf url(http://bloggerbuster.com/images/blockquote-top.gif) top left no-repeat;
padding: 30px 10px 10px 10px;
}

--Also you can use pictures quotes "quote marks" mixed background color to use as the following example:

blockquote {
margin:1em 20px;
background: #e0e0e0 url(http://bloggerbuster.com/images/bg_blockquote.gif) top left no-repeat;
padding: 8px 8px 8px 65px;
}

Based on the above example you create a block quote form on the beautiful and striking as you want.
Using fontsBesides the above two methods you can use the font style to create block quotes, or a combination of three to create. You use the style defined by bold, italic ... or color differences. For example:

This is block quote example of using both combinations of three font styles such as bold, italics and red ...
--To produce the effect that you can refer to the below:

blockquote {
margin:1em 20px;
font-weight; bold;
font-style: italic; color: #ff0000;
}

Above is the method of block definitions that I learned from the blog of Armanda, applied to his blog (phattrienso) should have been translated and successfully introduce to you for your reference. with approximate expected utility, and would appreciate an encouraging word for comments from you.

Blog tips

1 comments:

Anonymous said...: Excellent site you have here.. It's difficult to find high-quality writing like yours nowadays. I seriously appreciate people like you! Take care!!
website design; 13 September 2013 at 13:15

Connecting IT

Custom "Block quotes" for blogger.

1 comments:

Post a Comment

Learning English

Followers

Visitors