RadioButtonList控件添加样式

步骤：

1：在单选按钮组控件中 添加属性 RepeatLayout ,其值选“flow”<asp:RadioButtonList ID=”rblcellstat” runat=”server” Width=”240px” RepeatDirection=”Horizontal” RepeatLayout=”flow”>

(说明：选“flow”，RadioButtonList控件在网页中显示为<span></span>形式，若选“table”，在网页中显示<table><tr><td></td></tr></table>形式的html代码)

2：在css文件中写样式

span.includerbl input{text-align:center;border: 0px 0px 0px 0px} /* by  djh */

3：引用样式文件<link href=”http://www.cnblogs.com/include/main05.css” type=”text/css” rel=”stylesheet” />

自动启用

选RepeatLayout=”flow” 时，网页源代码样文如下：

<table cellpadding=”0″ cellspacing=”0″ width=”100%”  class=”outer”>
            <tr>
                <td style=”text-align:right”>設定格子狀態：</td>
                <td style=”width:260px”>
                 <span id=”rblcellstat” style=”display:inline-block;width:240px;”><input id=”rblcellstat_0″ type=”radio” name=”rblcellstat” value=”1″ checked=”checked” /><label for=”rblcellstat_0″>正常</label><input id=”rblcellstat_1″ type=”radio” name=”rblcellstat” value=”2″ /><label for=”rblcellstat_1″>滿格</label><input id=”rblcellstat_2″ type=”radio” name=”rblcellstat” value=”3″ /><label for=”rblcellstat_2″>停用</label><input id=”rblcellstat_3″ type=”radio” name=”rblcellstat” value=”4″ /><label for=”rblcellstat_3″>抽盤</label></span></td>
                <td><input type=”submit” name=”btnSet” value=”設定” id=”btnSet” style=”width:80px;” /></td>
            </tr>
         </table>

选RepeatLayout=”table” 时，样文如下：

<table cellpadding=”0″ cellspacing=”0″ width=”100%”  class=”outer”>

  <tr><td style=”text-align:right”>设定格子状态：</td>

      <td class=”includerbl” style=”width:260px”>

<table id=”rblcellstat” border=”0″ style=”width:240px;”>

          <tr><td><input id=”rblcellstat_0″ type=”radio” name=”rblcellstat” value=”1″ checked=”checked” /><label for=”rblcellstat_0″>正常</label></td>

<td><input id=”rblcellstat_1″ type=”radio” name=”rblcellstat” value=”2″ /><label for=”rblcellstat_1″>满格</label></td>

<td><input id=”rblcellstat_2″ type=”radio” name=”rblcellstat” value=”3″ /><label for=”rblcellstat_2″>停用</label></td>

          </tr></table>

     </td>

    </tr>

 </table>