Bootstrap Blockquote style

Style blockquote

For quoting blocks of content from another source within your document.

Wrap <blockquote> around any HTML as the quote.


<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--from w  w  w.j  a  va 2 s .co  m-->
<body style='margin: 20px;'>

  <blockquote>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      Integer posuere erat a ante.</p>
  </blockquote>

</body>
</html>

Click to view the demo

Quotation source style

Style and content changes for simple variations on a standard <blockquote>. Add <small> tag for identifying the source. Wrap the name of the source work in <cite>.


<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--from w w w.  j av a  2s .co  m-->
<body style='margin: 20px;'>

  <blockquote>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      Integer posuere erat a ante.</p>
    <small>Someone famous in <cite title="Source Title">Source
        Title</cite></small>
  </blockquote>

</body>
</html>

Click to view the demo

Right-aligned blockquote

Use .pull-right for a floated, right-aligned blockquote.


<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!-- w w  w  .j  a v a 2s .  co m-->
<body style='margin: 20px;'>

  <blockquote class="pull-right">
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      Integer posuere erat a ante.</p>
    <small>Someone famous in <cite title="Source Title">Source
        Title</cite></small>
  </blockquote>

</body>
</html>

Click to view the demo





















Home »
  Bootstrap »
    Bootstrap »




Introduction
Basic HTML Style
List
Table
Form
Layout
Navigation Bar
Button
Control