Uyarı Mesaj Kutusu Yapımı

Css ile "Dikkat" , "Onay" ve "Yasak" uyarı kutuları yapacağız. Tabi siz bunları değiştirebilirsiniz. Sizin kullanımınıza kalmış.

Öncelikle blogger tema sekmesinde HTML'yi düzenle kısmına geliyoruz ve ]]></b:skin> kodunu buluyoruz. Üzerine şu kodları ekliyoruz ve kaydediyoruz.

.dikkat{ border:solid 1px #DEDEDE; background:#FFFFCC url(http://icons.iconarchive.com/icons/famfamfam/mini/16/icon-alert-icon.png) 8px 6px no-repeat; color:#222222; font-weight:bold; padding:4px; text-align:center; } .onay{ border:solid 1px #90ac13; background:#eef4d3 url(http://icons.iconarchive.com/icons/famfamfam/silk/16/accept-icon.png) 8px 6px no-repeat; color:#6b800d; font-weight:bold; padding:4px; text-align:center; } .yasak{ border:solid 1px #CC0000; background:#F7CBCA url(http://icons.iconarchive.com/icons/famfamfam/silk/16/delete-icon.png) 8px 6px no-repeat; color:#CC0000; font-weight:bold; padding:4px; text-align:center; }

Bu işlemde mesaj kutularını tanımladık. Bunları herhangi bir yazıya eklemek istersek yazı içinde HTML bölümüne geçip

Dikkat için
<div class="dikkat"> Dikkat mesajını burada yazılacak</div>

Onay için
<div class="onay"> Onay mesajını burada yazılacak</div>

> Yasak için
<div class="yasak"> Yasak mesajını burada yazılacak</div>

kodlarını eklemeniz yeterli olacaktır. Eklediğiniz kodlar aşağıdaki gibi gözükecektir.

Dikkat mesajını burada yazılacak

Onay mesajını burada yazılacak

Yasak mesajını burada yazılacak