首頁 > web前端 > css教學 > CSS樣式之ASP.NET的使用

CSS樣式之ASP.NET的使用

零下一度
發布: 2017-04-27 13:55:44
原創
2113 人瀏覽過

1  使用link標籤去呼叫樣式,也就是呼叫css檔案中的樣式,可以直接將CSS檔案拖曳到html頁的head下方

     此方法先載入css,然後載入html

<head runat="server">
   <title>网页标题</title>
   <link href="Css/default.css" rel="stylesheet" type="text/css" />   
</head>
登入後複製

2 使用style標籤 

<head runat="server">
   <title>网页标题</title>

   <link href="Css/default.css" rel="stylesheet" type="text/css" />
  
   <style type="text/css">
        body
        {
            width:100%;
        }
        
   </style>

</head>
登入後複製

3 import載入,先載入html,後載入css

   <style type="text/css">
        
        @import url(&#39;css/default.css&#39;);
        
   </style>
登入後複製

4 在default.css中的使用

   1 如果只寫控制項的類型,表示該類型的控制項都會用這樣的樣式

   2 如果想對某一控制項進行設定樣式使用

#   舉個栗子: defaullt.css 檔案

body 
{
    padding: 0px;
    margin: 0px;
    width:960px;
    height:auto;
    display:block;
    margin-left:auto;
    margin-right:auto;   
}
        
#p_Top
{
  width:100%;
  height:80px;
  margin:0 auto;
  background-color:White;
  display:block;
}

#p_Mid
{
  width:100%;
  height:auto;
  margin:0 auto;
  background-color:White;
  display:block;
  min-height:420px;
}

#p_Footer
{
    width:100%;
    height:30px;
}


#Select,#Insert,#Delete,#Update
{
   width:90px;
   margin-left:auto;
   margin-right:auto;
   height:90px;
   font-size:15px;
   border: 3px solid #33CCFF;
}

#Select:hover,#Insert:hover,#Delete:hover,#Update:hover
{
     cursor:pointer;
     background-color:#33CCFF;
}
登入後複製

5 對於控制項而言可以使用屬性載入樣式

  1 使用style屬性直接使用 style=" width:auto; height:auto; margin-left:auto; margin-right:auto;"

  2 使用class  呼叫head裡的樣式

  3 使用CssClass  呼叫head裡的樣式

<style type="text/css">
    
     .Bt
      {
           width:80px;
           height:25px;
           border:none;
      }
       
       .Bt:hover
       {
           cursor:pointer;
           background-color:#33CCFF;
       }
       
       .closed
       {
            border-style: none;
            height:21px;
            width:21px;
            background-image: url(&#39;/Images/closed.png&#39;);
            background-repeat:no-repeat;
       }
       
       .closed:hover
       {
           cursor:pointer;
       }
    
    </style>
登入後複製

6 後台為前台按鈕新增樣式

bt.Attributes.CssStyle.Value = "background-color:Gray;";
登入後複製

7 可以用 迭代寫法 

#表示設定Menu下的ul下的li的樣式

#Menu ul li
		{
			width:100%;
			
			border:1px dotted gray;
			margin:0;
			padding:0;
		}
登入後複製

以上是CSS樣式之ASP.NET的使用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板