ASP.NET - Code Behind 'da CSS Style Kullanma

Çok ihtiyacım olan bir noktada imdadıma yetişen bir konu olduğu için bildiklerimi paylaşmak istedim ve sırf bu makalede Code Behind kavramı geçiyor diye öncesinde Code Behind Kodlama makalesini yazdım. Code Behind kodlamanın ne olduğunu bilmeyenler öncelikle buradaki makalemi okumanızı tavsiye ederim.

ASP.NET 'te Code Behind kısmında aşağıdaki yönergeleri takip ederek bir nesnenin stil özelliğini değiştirebilirsiniz.

Html içindeki bir nesnenin Code Behind 'da görünmesi için iki önemli nokta vardır. Birincisi ID özelliği ikincisi ise runat özelliğidir.

<asp:Label ID="Label1" runat="server">

Yukarıdakine benzer bir nesneye Code Behind 'dan ulaşılabilir.

Nesnemize de ulaştığımıza göre aşağıdaki kod ile style ekleyebilirsiniz.

Label1.Style.Add("color", "red");

veya aşağıdaki kullanım ile style dosyamızda oluşturduğumuz "renkayarlari" isimli classı ekleyebilirsiniz.

Label1.CssClass="renkayarlari";

Bu sayede bir butona tıkladığınızda bir nesnenin görünürlüğünü(visibility) değiştirebilirsiniz, kenar çizgilerini, renk ayarlarını veya aklınıza gelen herhangi bir özelliğini.

Javascript ile nesnelerin style özelliklerini değiştirmek varken neden bunlarla uğraşalım diyenleri duyar gibiyim. Bir butona tıklayarak yaptırılacak postback olayından sonra bir nesnenin style özelliğini değiştirme ihtiyacı duyabilirsiniz. İşte bu gibi durumlarda yukarıdaki kodlar imdadınıza yetişecektir.

Önemli: CssClass özelliğini sadece asp nesneleri için verebilirsiniz. Örneğin bir div nesnesi için;

<div id="kapsayici" runat="server"></div>
kapsayici.Style.Add("border", "thin solid #ccc");

kodu çalışırken,

kapsayici.CssClass = "renkayarlari";

kodu çalışmaz. Bunun nedeni asp nesnelerinin(label, textbox, panel vb..) CssClass özelliği bulunurken, html nesnelerinin(div, ul, li, span vb..) CssClass özelliği yoktur.

Bir makalenin daha sonuna geldik. Söylemeyi unuttuğum yerler veya aklınıza takılan kısımları sorabilirsiniz. Bir başka makalede görüşmek üzere :)

Blog Yorumları (2 Yorum)

avatar
  1. avatar avatar

    {{comment.Name}} dedi ki

Bu makaleyi faydalı buldunuz mu?

Bu içerikle ilgili görüşleriniz önemlidir. Ne düşündüğünüzü söyleyin.

Bu makale faydalı mıydı?

Üzgünüm faydalı değil.
Bildiriminiz gönderiliyor...
Geri bildiriminiz için teşekkürler!
Gönderme sırasında hata alındı!