FontAwesome Alıntı Simgesi Nasıl Yapılır

Question

FontAwesome Quote Icon yani Alıntı simgesi yapmak istiyorum nasıl yapabilirim.

resimdeki gibi

Answer 1

Eklenecek Kod :

<div id="DIV_1">

<div id="DIV_2">

<p id="P_3">

Sitenizdeki konu yazısı ...

</p>

</div>

</blockquote>

CSS Kodunuz :

#DIV_1 {
    box-sizing: border-box;
    position: relative;
    width: 50%;
    padding: 20px 20px 20px 70px;
    font: normal normal normal normal 16px/24px 'Merriweather Sans', sans-serif;
font-family: 'Merriweather Sans', sans-serif;
font-size: 16px;
font-style: italic;
line-height: 1.5em;
background: #eee;
color: #fff;
}

#DIV_1:before {
  font-family: "FontAwesome";
  content: "\f10d";
  font-size: 20px;
  font-style: normal;
  color: #0000;
  position: absolute;
  top: 28px;
  left: 18px;
}

#P_3 {
    margin: 10px 0px;
}

 

Renk kodlarınız , yazı boyutlarını CSS kodu kısımından düzenleyebilirsiniz.