Lihat Code Di bawah ini

CODE CSS

<style type='text/css'> .quote blockquote:after, .quote blockquote:before { top: 100%;border:solid transparent; content: " ";height: 0;width: 0; position: absolute;pointer-events: none} .quote blockquote:after { border-top-color: #ff1493; border-width: 11px; left: 65%;margin-left: -11px} .quote blockquote:before { border-top-color: #ffffff; border-width: 12px; left: 65%;margin-left: -12px} .quote blockquote p { font:700 italic 14px/normal 'PT Serif', serif; color: #ff1493;padding: 18px;text-indent: 100px; background-color: #000; border-radius: 5%; border: 4px solid #ff1493; position: relative} .quote blockquote p:before{ content: '\201C';font-family: serif;font-style: normal; font-weight: 700;position: absolute;font-size: 134px; top: -0.5em;left: -95px;color: #ff1493;} .quote .desc {text-align: right;padding: 21px 120px 21px 21px;position: relative} .quote .img { display: block;width: 75px;height: 75px; border: 4px solid #ff1493;border-radius: 55%; background: url(http://catatan-sioon.yu.tl/files/1461172601-picsay.png) no-repeat center center; position: absolute;right: 19px; bottom: 0px; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.5),0 2px 3px rgba(0,0,0,0.6)} .quote .profile {font:500 18px/normal 'Alegreya SC', serif;color: #ffa500} .quote cite a:hover{color: #ff4500} .quote cite a {font:700 italic 13px/normal 'Alegreya', serif;color: #ff1493} .info-wrap{width: 500px;margin: 10px auto;padding: 10px 10px;position: relative} .info-wrap p{margin: 0;padding: 0} .info-wrap blockquote {margin: 0;padding: 0;position: relative} .info-wrap cite {font-style: normal} </style>

CODE HTML

<div class="info-wrap quote"> <div class="img"></div> <blockquote cite="http://catatan-sioon.yu.tl"> <p>Wellcome To My Wapsite <a href="http://gadis69.sextgem.com">Wap Demo Mobie In</a><br/> Wap Ini Di buat cuma sekedar untuk demo .. dan wap ini saya dirikan dengan tujuan untuk berbagi pengetahuan seputar Tutorial Blog, SEO Tips, CSS, HTML dan JavaScript, Design Template dan sedikit informasi umum .. untuk melihat postingan <a href="http://catatan-sioon.yu.tl">"KLIK DISINI"</a></p> </blockquote> <div class="desc"> <p class="profile"><i>Ocha Love Wida</i></p> <cite><a href="http://catatan-sioon.yu.tl">Blog Ponsel Si Oon&/lt;a></cite> </div> </div>

RELATED POST

RANDOM POST

Kembali ke Tutorial