Blogger'da CSS ile Renkli Kutu Yapalım

Herkese Merhaba. Bazen Metinin tam ortasında dikkati çekmek istediğimiz yeri renklendirmemiz gerekir fakat daha Orjinal birşeye gerek duyarız. Örneğin renkli bir Kutucuk. Işte bunu bugün sizlere göstereceğim. Aslında çok basit birşey. CSS yi yazıyorsunuz ve Blogger da kullanmak için de belli bir Satır kullanıyorsunuz. Bu kadar basit aslında. Herneyse, bu kutucuğun Arkaplanını ben sarı yaptım, siz kendinize göre değiştirebilirsiniz tabi. Nasıl değiştirileceğini bilmiyorsanız üzülmeyin, ben anlattım herşeyi aşağıda.

Ilk önce Bloğumuza giriş yapıyoruz. Sonra Kumanda Paneli ne giriyoruz. Ardından Yerleşim'e, sonra HTML'yi Düzenle ye. Şimdi CTRL+F kombinasyonumuzu kullanarak Arama pencerimizi açıp ]]></b:skin> kodunu buluyoruz ve aşağıdaki kodları ]]></b:skin> kodunun üzerine yapıştırıyoruz.

KODLAR:

.kutucuk {
background: #FFFF99;
width: 500px;
height: 40px;
text-align:justify;
overflow: hidden;
position:relative;
}

Kodlarımızı ekledikten sonra Şablonumuzu kaydediyoruz. Bu kadar. Konunuzda kullanmak için aşağıdaki Satırı kullanın:

<div class="kutucuk">Blog Doğuhanca</div>

KISA AÇIKLAMA - Ne yaptık?

• Yukarıdaki Satırda kullandığımız id bize CSS mizi yazarken kullandığımız #kutucuk bölümünü gösterir.
• Yukarıdaki Blog Doğuhanca kısmı yerine istediğiniz Metni yazın.
• Yukarıdaki kutucuk yazan yeri CSS nizde değiştirdikten sonra bu Satırdada değiştirebilirsiniz.

KOD AÇIKLAMASI - Ne nedir?
background --> Arkaplanımız (Renk Kodumuz burada)
width --> Kutunun genişliği
height --> Kutunun yüksekliği
text-align --> Kutunun içindeki Yazının geleceği yer (left,right,center,justify)
overflow --> Kutuda taşan yerleri taşmamış gibi göstertir.
position --> Kutunun olduğu yerde kalıp kıpırdamamısını sağlar.

Örnek kutucuk.