Harici veya dahili olmuş olsun bir CSS dosyamızda CSS kurallarımız içinde bir Css Class tanımladığımızda eğer ASP.NET ile çalışıyor isek bunu bir şekilde ASP web formlarımıza bağlamamız gerekir. Bunu CssClass özelliği ile gerçekleştirebiliriz.
Bir örnek ile birlikte bir CSS dosyasının ASP web form ile birlikte kullanılmasını özetleyelim. Bir WEB projesi oluşturuyorum. Projeme Add New Item diyerek bir adet StyleSheet.css adında stylesheet dosyası ekliyorum ve bir takım CSS kuralları oluşturuyorum.
StyleSheet.css dosyası :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| body {}.title {font-family: Arial, Helvetica, sans-serif;font-size: 22px;}.dropdownmenu {font-family: Arial, Helvetica, Sans-Serif;background-color: #00BBFF;}.textbox {font-family: Arial Helvetica, Sans-Serif;background-color: #00BBFF;border: 1px solid}.button {font-family: Arial;background-color: #00BBFF;border: 1px solid} |
Daha sonra bir tane web form ekliyorum, ben Default.aspx formum üzerinde işlem yapıyorum.
Head elementi içinde CSS dosyamı web formuma bağlıyorum, daha sonra ASP.NET kontrollerinin her biri için eğer bir CSS sınıf kuralı kullanacak isem bunu mutlaka CssClass özelliği ile tanımlıyorum. Aşağıda kullanım şeklini görebilirsiniz.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
| <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head runat="server"> <title></title> <link rel="Stylesheet" type="text/css" href="StyleSheet.css" /></head><body> <form id="form1" runat="server"> <div><p class="title">Lütfen bir ürün seçiniz</p> <p> <asp:DropDownList ID="urunListesi" CssClass="dropdownmenu" runat="server"> <asp:ListItem Text="Etek" Selected="True"></asp:ListItem> <asp:ListItem Text="Pantalon"></asp:ListItem> <asp:ListItem Text="Gömlek"></asp:ListItem> <asp:ListItem Text="Çorap"></asp:ListItem> <asp:ListItem Text="Palto"></asp:ListItem> </asp:DropDownList> </p> <p><asp:TextBox runat="server" ID="txtBoxSayi" CssClass="textbox"></asp:TextBox></p> <p><asp:Button runat="server" ID="btnSepeteEkle" CssClass="button" Text="Sepete Ekle" /></p> </div> </form></body></html> |
Bu örnekte CSS ve bir ASP.NET formumun nasıl birbirine bağlanacağına dair fikir elde ettik, bir sonraki yazıda görüşmek dileği ile..
Hiç yorum yok:
Yorum Gönder