CSS / 인용문(Blockquote) 꾸미기
다음과 같은 인용문을 꾸미는 여러 가지 예제입니다.
1 2 3 |
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet.</p> </blockquote> |
예제 1
1 2 3 4 5 6 7 8 |
blockquote { border: 1px solid #27a9e3; margin-left: 0px; margin-right: 0px; padding-left: 20px; padding-right: 20px; border-left: 10px solid #27a9e3; } |
예제 2
1 2 3 4 5 6 7 8 |
blockquote:before { content: "\201C"; font-size: 3em; font-family: Georgia; color: #bcbcbc; float: left; margin: -5px 10px 0px -10px; } |