You have probably seen webpages that display a quote from the article, but taken out of the flow of the article text. The html blockquote element is easy to use and can be used break up the monotony of paragraphs of text and give your webpage a more professional look.
Welcome to Bucaro TecHelp!

Welcome to Bucaro TecHelp!
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact Advertise on Bucaro TecHelp Advertise Here RSS News Feeds News Feeds

HTML5 Solutions: Essential Techniques for HTML5 Developers

Essential Techniques for HTML5 Developers

HTML5 brings the biggest changes to HTML in years. Web designers now have new techniques, from displaying video and audio natively in HTML, to creating realtime graphics on a web page without a plugin.

This book provides a collection of solutions to all of the most common HTML5 problems. Every solution contains sample code that is production-ready and can be applied to any project.

Click Here

HTML Blockquote Basics

You have probably seen webpages that display a quote from the article, but taken out of the flow of the article text. This is a page design technique borrowed from printed magazines, and if done properly it can make your article look more professional. One important thing a blockquote does is break up the monotony of paragraphs of text on a webpage, and that's important for viewer eye relief.

A basic blockquote is easy to create, just place the quote text within <blockquote> </blockquote> tags, as shown below.

<blockquote>A basic blockquote is easy to create</blockquote>

a basic blockquote is easy to create

Note that the blockquote is an html block level element, which means that it contains an embedded carriage-return line-feed immediately before the opening <blockquote> tag and immediately after the closing </blockquote> tag. The blockquote is unique because unlike other block level elements, it places some margin before and after the blockquote, in other words, the blockquote will be displayed narrower than paragraphs in the same column.

Although the focus of this article is about html, here's a few style tricks that are easy to code and that you might find useful. By adding the style attribute to the <blockquote> tag you can define a border to display around the quote. Note that if you add a border, you'll also need to specify some padding between the border and the text.

<blockquote style="border:solid blue 2px; padding:4px;">
The blockquote is an html "block" level element, which means it contains an embedded carriage return before and after.
</blockquote>

The blockquote is an html "block" level element, which means it contains an embedded carriage return before and after.

Using the style attribute, you can also define a specific font and text color. Note that this method of applying style is called inline style because the style rules are defined in the html element's tag. This is a very easy way to apply style.

<blockquote style="font-family:Courier; font-size:14px; color:green;">

The blockquote is an html "block" level element, which means it contains an embedded carriage return before and after.

The html blockquote element is easy to use and can be used break up the monotony of paragraphs of text and give your webpage a more professional look.

RSS Feed RSS Feed



Web Design Sections

HTML5 for Masterminds

HTML5 for Masterminds

How to take advantage of HTML5 to create amazing websites and revolutionary applications

This book is not an introduction of HTML5 but instead a complete course that will teach you how to build compelling websites and amazing web applications from scratch. Every chapter explores basic concepts as well as complicated issues of HTML5, CSS3 and Javascript.

Concepts are supported by fully functional codes to guide beginners and experts through every single tag, style or function included in the specification.

Click here for more information.


[Site User Agreement] [Advertise on This site] [Search This Site] [Contact Form]
Copyright©2001-2011 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268