4.6.12

Blockquote Memakai CSS

Blockquote sederhana hanya menggunakan CSS atribut.
Markup HTML
<blockquote>blah bleh bloh!<cite>Somebody</cite></blockquote>
Kode CSS
blockquote {
font-family: Georgia, serif;
font-size: 18px;
font-style: italic;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.35;
position: relative;
color: #555;
}
blockquote:before {
content: "\201C";
font-size: 80px;
position: absolute;
left: -5px;
top: -17px;
color: #777;
}
blockquote:after {
content: "\201D";
font-size: 80px;
position: absolute;
right: 5px;
bottom: -77px;
color: #777;
}
blockquote cite {
color: #888;
font-size: 11px;
margin-top: 25px;
float: right;
}
blockquote cite:before {
content: "\2014 \2009";
}
blockquote cite:after {
content: "\2009 \2015";
}