熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> .NET編程 >> 正文

ASP.NET 2.0 Master Page主題以及皮膚的使用

2013-11-13 09:57:14  來源: .NET編程 

         Style Themes and Skin
l         ASPNet 新應用樣式

  ASPNet 包含大量用於定制外觀的新特性其中服務器端控件提供Style對象模型用於定制字體邊界背景前景顏色寬度高度等等信息同時控件還支持使用CSS定制其外觀還可以把所有這些定制在一些skin文件裡並把這些描述控件外觀的skin文件放置在theme文件夾中反復使用

  l         為控件定制風格

  ü         為HTML控件定制外觀

  CSS是一套統一的描述標記這套標記是相對於HTML相對獨立的這套標記使用很多特殊的符號來定制一些自己的外觀描述方式比如CSS可以方便的描述一個文字的大小尺寸寬度高度文字的前景演示背景顏色以及控件的各種各樣的屬性CSS是一套開放性國際標准目前被各個浏覽器廣泛兼容我們在NET中可以方便的引入CSS為我們的控件定制外觀

  ?         對於HTML控件可以使用CSS來定制其外觀無論是客戶端的HTML控件還是服務器端HTML控件其定制方法都一樣

  ?         CSS既可以直接定制每個控件的顯示風格也可以定制一種風格並命名為一個類只需要指定一個控件的顯示風格是該類即可

  ?         代碼示例通過CSS定制顯示HTML控件

  一種方式在控件定義過程中使用style定義如下

  <button id=Button runat=server>Click me!</button>

  <input id=Text type=text value=One Two Three runat=server/>

  <select id=Select runat=server>

  <option>Item </option>

  <option>Item </option>

  <option>Item </option>

  </select>

  <span >

  <input id=Radio type=radio name=Mode checked runat=server/>Option <br>

  <input id=Radio type=radio name=Mode runat=server/>Option <br>

  <input id=Radio type=radio name=Mode runat=server/>Option

  </span>

  第二種方式是我們把CSS先提前定制出來然後把控件指定他的style如下定義(放在<head></head>裡面)

  <style>

  spanstyle  

  {

  font: pt verdana;

  fontweight:;

  color:orange;

  }

  buttonstyle

  {

  font: pt verdana;

  backgroundcolor:lightgreen;

  bordercolor:black;

  width:

  }

  inputstyle

  {

  font: pt verdana;

  backgroundcolor:yellow;

  borderstyle:dashed;

  bordercolor:red;

  width:;

  }

  selectstyle

  {

  font: pt verdana;

  backgroundcolor:lightblue;

  color:purple;

  }

  radiostyle

  {

  width:;

  backgroundcolor:red;

  zoom:%

  }

  </style>

  然後我們在定義控件的時候調用前面設計的類調用方式如下

  <span id=Span class=spanstyle runat=server>

  <button id=Button class=buttonstyle runat=server>Click me!</button>

  <input id=Text type=text value=One Two Three class=inputstyle runat=server/>

  <select id=Select class=selectstyle runat=server>

  <option>Item </option>

  <option>Item </option>

  <option>Item </option>

  </select>

  <input id=Radio type=radio name=Mode checked class=radiostyle runat=server/>Option <br>

  第二種方法顯然比第一種要好把描述風格都寫在前面並命名同時


From:http://tw.wingwit.com/Article/program/net/201311/12099.html
    推薦文章
    Copyright © 2005-2013 電腦知識網 Computer Knowledge   All rights reserved.