Bugün Günlerden: . Toplam 19 kategorideki 7.414 yazıda 7.872 yorum bulunmaktadır.
Tavsiye: LG G5′i Nasıl Hızlandırırım? 5 Adımda LG G5 Hızlandırma Hatırlayalım: LG G5 ile İlgili En Yaygın 10 Problem ve Çözümleri
Sponsorlu Bağlantılar

CSS ile Çizgi Efektli Yazı Yazma Nasıl Yapılır?

Sponsorlu Bağlantılar

Bir süredir CSS derslerine ara vermiştik. Şimdi ise güzel bir ders ile karşınızdayız. CSS ile çizgi efektli yazı yazma nedir öncelikle bunu açıklayalım. Standart border kodumuzu, yazımızın arkasından geçecek şekilde tanımlamaya çalışacağız. Böylelikle ortaya gerçekten güzel bir görünüm çıkacak. Dilerseniz aşağıdaki adımlar doğrultusunda web sitenizdeki yazı başlıklarınızda v.b. kullanabilirsiniz bu özelliği. Fazla vakit kaybetmeden izniniz ile, ilgili adımlara göz atıyor olacağız.

AYRICA: CSS ile Uzun Yazıları Üç Nokta ile Bitirmek

1) Öncelikle temanızın CSS alanına aşağıdaki kodları ekleyin.

<style>
/* CSS */
.line-titles {position: relative;margin-top:30px;margin-left:-40px;text-align: center;display: block;font-size:16px;width:1050px;}
.line-titles:before {position:absolute;top:50%;z-index:1;display:block;width:100%;height:1px;border-top:1px solid #ddd;content:""}
.line-titles span {position:relative;z-index:1;padding:0 20px;background:#fff;display:inline-block}
</style>

2) HTML kısmına ise aşağıdaki kodları ekleyin.

<div class='line-titles'><span>Başlık Buraya Gelecek</span></div>

Örnek Görünüm

Not: Kırmızı alanı kendinize göre değiştirmeyi unutmayınız.

Sponsorlu Bağlantılar


Teknobeyin Facebook
Sayfasını Bugün Beğenin!
  1. Yorum bulunmamaktadır.

Bu yazıya yorum göndermek ister misiniz?

Dikkat: Her yorum gönderen kişi, kendi gönderdiği yorumdan sorumlu olmaktadır.
Not: Yazı ile herhangi bir ilgisi bulunmayan yorumların onaylanmadığını belirtmek isteriz.
Yazı Etiketleri
Yukarı Çık