代码之家 › 专栏 › 技术社区 › sikender

是否增加asp.net中复选框的大小?

css asp.net c#

sikender · 技术社区 · 16 年前

有人能提供C#代码或css代码来实现这一点吗?

7 回复 | 直到 16 年前

-1

Gabriel McAdams 16 年前

你不能这么做。复选框是一个窗口浏览器组件。您所能做的最好是创建自己的控件,该控件看起来像一个复选框,但实际上是由每个状态的图像组成的。

以下是一些使用图像而不是复选框的控件示例:

Yannick Richard 8 年前

在asp.net中,复选框将变为带有“checkbox”类型输入的范围

<asp:CheckBox ID="chkBoxName" runat="server" CssClass="ChkBoxClass"/>

.ChkBoxClass input {width:25px; height:25px;}

Jason Rowe 16 年前

有一个html复选框。

<input type="checkbox" id="fatty">
<label for="checkbox-1">Checkbox 1</label>

fatty { /* Change width and height */
   width:4em;
   height:4em;
}

这是我从你那里得到的 here .

Chris 9 年前

input[type=checkbox] {
    -ms-transform: scale(3); /* IE */
    -moz-transform: scale(3); /* FF */
    -webkit-transform: scale(3); /* Safari and Chrome */
    -o-transform: scale(3); /* Opera */
}

代码片段中提供的示例。

.scale1 {
    margin: 15px;
    -ms-transform: scale(1); /* IE */
    -moz-transform: scale(1); /* FF */
    -webkit-transform: scale(1); /* Safari and Chrome */
    -o-transform: scale(1); /* Opera */
}

.scale2 {
    margin: 15px;
    -ms-transform: scale(2); /* IE */
    -moz-transform: scale(2); /* FF */
    -webkit-transform: scale(2); /* Safari and Chrome */
    -o-transform: scale(2); /* Opera */
}

.scale3 {
    margin: 15px;
    -ms-transform: scale(3); /* IE */
    -moz-transform: scale(3); /* FF */
    -webkit-transform: scale(3); /* Safari and Chrome */
    -o-transform: scale(3); /* Opera */
}

<input id="cb1" type="checkbox" class="scale1">
<label for="cb1">scale1 </label>

<input id="cb2" type="checkbox" class="scale2">
<label for="cb2">scale2 </label>

<input id="cb3" type="checkbox" class="scale3">
<label for="cb3">scale3 </label>

BernieSF 10 年前

出于某种原因,这对我不起作用:

   <asp:CheckBox id="requestAccountCB" style="width: 20px; height: 20px;" runat="server"/>

但这起到了作用:

    <style>
        #requestAccountCB { width: 20px; height: 20px }
    </style>

    <body>
       <form runat="server">
           <asp:CheckBox id="requestAccountCB" runat="server"/>
       </form>
    </body>

Community Mohan Dere 9 年前

如上所述,这完成。

你能做的就是 . 这一切都是用css完成的,它工作得非常完美。

input[type=checkbox] {
display:none;
}

input[type=checkbox] + label
{
background-image: url('images/off.gif');
height: 16px;
width: 16px;
display:inline-block;
padding: 0 0 0 0px;
}

input[type=checkbox]:checked + label
{
background-image: url('images/on.gif');
height: 16px;
width: 16px;
display:inline-block;
padding: 0 0 0 0px;
}

和HTML代码:

<input type='checkbox' name='thing' value='valuable' id="thing"/><label for="thing"></label>

代码可以在中找到 this 不停摆弄

here

顺便提一下 :如果您像我一样使用ASP.NET,可以添加标记为:

 <asp:CheckBox runat="server" ID="chkEmailForUnpluggedService" Text="<label for='thing'>" />

D.B 8 年前

呈现的Html如下所示:

<span class="15465503">
    <input id="ctl00_ctl00_ctl00_BB_SB_ScB_ucSR_rptR_ctl01_chkShortlist" 
     type="checkbox" name="ctl00$ctl00$ctl00$BB$SB$ScB$ucSR$rptR$ctl01$chkShortlist");">
</span>

input[id$="chkShortlist"] {
width: 18px;
height: 18px;
}

Treadmeister 4 年前

在2021年,如果还有人需要帮助的话——上面的大量答案并没有帮助我调整旧WebForms应用程序中ASP复选框的大小。相反,添加复选框作为标准HTML输入元素(作为type=“checkbox”),而不是ASP:checkbox,然后设置runat=“server”,帮助我能够通过内联样式控制这一点,同时仍然能够在后面的代码中控制这一点。例如。

<input type="checkbox" id="cbInputDamagedStatus" style="width:1.5em; height:1.5em; display: inline-block;" runat="server" />

和

cbInputDamagedStatus.Checked = true;