)
Before & Afterİle istediğimiz html etiketlerinin önüne veya sonuna metin eklenmesini sağlayabiliriz. :after ile belirttiğimiz etiketlerin sonuna, :before ile de önüne istediğimiz metinleri Ekleyebiliriz.
Content özelliği ile eklenecek metin belirtilir. Stil özelliklerini belirleyerek de bu metni biçimlendirebilriz.Örnek ;
PHP Kod:
<style>
.webailesi:after /* webailesi classı verilmiş yazının Sonrasına */ {
content:"Kelimenin Sonuna Gelicek Yazı"; /* Text Alanı */
color: blue; /* Renk */
border-left: 1px solid black; /* Yazının Soluna 1px Siyah Çizgi */
padding-left: 10px; /*Soldan 10px iç Boşluk */
margin-left: 7px; /* Soldan 7px Dış Boşluk */
}
.webailesi:before /* webailesi classı verilmiş yazının Öncesine */ {
content: "Kelimenin Başına Gelicek Yazı"; /* Text Alanı */
color: green; /* Renk */
border-right: 1px solid black; /* Yazının Sağına 1px Siyah Çizgi */
padding-right: 10px; /*Sağdan 10px iç Boşluk */
margin-right: 7px; /* Sağdan 7px Dış Boşluk */
}
.webailesi {
color:red; /* Renk */
display:flex;
justify-content: center;
background: #e4e4e4;
padding:15px;
border-radius:5px;
}
</style>
<div class="webailesi">
Webailesi.Com
</div>
Çıktı ;
