2012-08-29 28 views
11

私はasp:Buttonを持っていますが、asp:ButtonにcssClassプロパティのCSSスタイルを使用しましたが、これらのスタイルは機能しません。 asp:LinkButtonを使用すると、それらのスタイルはうまくいきます。スタイルにテーマやスキンは必要ありません。cssスタイルをasp.netボタンに設定する方法は?

これは私のASPページです:

<asp:Button CssClass="smallButton" Text="Sign In" runat="server" ID="submit"></asp:Button> 

これは私のCSSです:

.smallButton 
{ 
    //styles 
} 

私はASPを変更する場合:ASPにButton:LinkBut​​tonの

<asp:LinkButton Text="Sign In" runat="server" ID="submit" CssClass="smallButton"></asp:LinkButton> 

または

<span class="smallButton"><asp:LinkButton Text="Sign In" runat="server" ID="submit"></asp:LinkButton></span> 

スタイルがうまくいきます。 asp:Buttonコントロールの問題のみ

+0

は私たちにコードを表示してください。私たちがあなたが間違っていたことをどのように推測すると思いますか? –

+0

asp.netボタンが生成しているhtmlを提供できますか? – Erwin

+0

@ Sujanth答えがあなたを助けたら、それを受け入れるべきです。ありがとうございます。 – freebird

答えて

10

私は、コードを見られるような値を渡すことができます.... 。 貴重なご回答ありがとうございました.......

15

ASP.NET Buttonに割り当ててから、目的のスタイルを適用することができます。

<asp:Button class="mybtn" Text="Button" runat="server"></asp:Button> 

CSS:

.mybtn 
{ 
    border:1px solid Red; 
    //some more styles 
} 
+0

同じ方法を使用していますが、これはasp:Buttonコントロールでは機能しませんが、これはasp:LinkBut​​tonとImage Buttonコントロールで動作しています – Sujanth

+0

@Sujanthブラウザからキャッシュをクリアして再試行できます大丈夫です。 – freebird

+0

これに注意してください。 ASP.NetはCSSフィールドを上書きします。たとえば、ボタンを無効にすると、cssクラスは "無効"に上書きされます。提供されたセッターCssClassを使用して、ASP.Netがcssクラスを設定するときに調整できるようにします。 –

1

あなたは自分のCSSファイルでinput要素のスタイルを設定できます。それはASP.NETとは無関係です。 CssClass

<form action=""> 
    Name: <input type="text" class="input" /> 
    Password: <input type="password" class="input" /> 
    <input type="submit" value="Submit" class="button" /> 
</form> 
CSS 
.input { 
    border: 1px solid #006; 
    background: #ffc; 
} 
.button { 
    border: 1px solid #006; 
    background: #9cf; 
} 

あなたはそれに"input"クラスを割り当てることができます。

+0

しかし、サーバーコントロールを使用していないため、ユーザーがここで何を望んでいるのかわかりません。 – Steve

+0

これは基本的には他のみんなが提案したものです。 – Remy

+0

ここでは、すべての人がサーバーコントロールを使用しています。ニックピッキングはしませんが、asp.netは理由のためにサーバーコントロールを利用しています。確かに、これらのコントロールとヴォイラにrunatタグを追加できました。 – Steve

10

あなたは

input[type="submit"] 
    { 
    //css coding 
    } 
input[type="submit"]:Hover 
    { 
    //css coding 
    } 

は、これは私の問題のためのソリューションです... CssClass属性を使用してCSSクラス名

<asp:Button CssClass="button" Text="Submit" runat="server"></asp:Button>` 

.button 
{ 
    //write more styles 
} 
0

あなたが言った答えはすべてのボタンに適用されます。あなたは「Default.aspファイル」のようにasp.netのデザインページにボタンを持って、あなたがしたい場合は

CssClass="someclass" 
1

input[type="submit"].someclass { 
    //somestyle} 

そして、あなたはあなたのボタンに以下を追加してください:あなたはこれを試してみてくださいボタン、ラベル、または他のコントローラ用のCSSファイルと指定された属性を作成します。そして、最初のすべてのプロジェクトでCSSページ

  1. 右クリックを作成するの
  2. 選択のStyleSheet

あなたのCSSページでこれらのコードを書き、今のCSSのページを持っている(新しいアイテムを追加します。スタイルシート。CSS)

StyleSheet.css

.mybtnstyle 
{ 
border:1px solid Red; 
background-color:Red; 
border-style:groove; 
border-top:5px; 
outline-style:dotted; 
} 

Default.aspファイル

{

<head> 
    <title> testing.com </title> 
</head> 
<body> 
<b>Using Razer<b/> 
<form id="form1" runat="server"> 
<link id="Link1" rel="stylesheet" runat="server" media="screen" href="Stylesheet1.css" /> 
<asp:Button ID="mybtn" class="mybtn" runat="server" Width="339px"/> 
</form> 
</body> 
</html> 

}

4

誰もがクラスを使用しての混乱に行きたいとは思いません、これを試してみてください:

<asp:button Style="margin:0px" runat="server" /> 

Intellisenseは提案しませんが、エラー、警告、またはメッセージをスローせずにジョブを完了します。ホバー効果でスタイル

0
<asp:LinkButton ID="mybutton" Text="Link Button" runat="server"></asp:LinkButton> 

に資本Sを忘れないでください:

#mybutton 
     { 
      background-color: #000; 
      color: #fff; 
      font-size: 20px; 
      width: 150px; 
      font-weight: bold; 
     } 
     #mybutton:hover 
     { 
      background-color: #fff; 
      color: #000; 
     } 

http://www.parallelcodes.com/asp-net-button-css/

関連する問題