CSS和服务器端控件 [英] CSS and Server Side controls

问题描述

你好...我想获得一些关于为所有服务器端控件指定CssClass的输入，他必须为HTML中的每个控件指定CssClass属性。例如：

Howdy ... I'd like to obtain some input with regards to specifying a CssClass for all server side controls vice having to specify the CssClass property for each control in the HTML. For example:

<div class="data_entry_form">

   <div class="rowElem">
      <div class="data_entry_pair">
         <SFWeb:Label  ID="lblFirstName"  runat="server" CssClass="label" Text="First Name:"></SFWeb:Label>
          <SFWeb:TextBox  ID="txtFirstName"  runat="server" CssClassclass="input"></SFWeb:TextBox>
        </div>

    </div>

相应的CssClass如下所示：

The corresponding CssClass looks like this:

.data_entry_form .data_entry_pair .label{
    font: normal 12px "Verdana", Arial, Helvetica, sans-serif;
    margin-right:5px;
    text-align:left;
    background-color:#FFFFFF;
    width: auto;
    }

.data_entry_form .data_entry_pair .input{
    font: bold 12px "Verdana", Arial, Helvetica, sans-serif;
    margin-right: 20px;
    text-align:left;
    background-color:#FFFFFF;
    }

我希望能够将CssClass定义为这样的东西（标签中没有句号 部分）：

I'd like to be able to define the CssClass to something like this (no period in the "label" part):

.data_entry_form .data_entry_pair label{
    font: normal 12px "Verdana", Arial, Helvetica, sans-serif;
    margin-right:5px;
    text-align:left;
    background-color:#FFFFFF;
    width: auto;
    }

因此减少了为每个<定义CssClass的必要性; sfweb：label xmlns：sfweb =＃unknown>和< sfweb：textbox>在data_entry_pair组中。



另外请注意，我可以访问控件的服务器端代码。在控制器的构造函数中设置这个programmaticaly对我来说似乎合乎逻辑，但我不知道代码框架代码中的位置。



仅供参考，客户端HTML源代码如下：

Thus alleviating the necessity to define the CssClass for every <sfweb:label xmlns:sfweb="#unknown"> and <sfweb:textbox> in the "data_entry_pair" group.

As an additional note, I do have access to the control's server-side code. It seems logical to me to set this programmaticaly in the control's constructor, but I don't know where that is located in the code framework's code.

Just for reference, the client side HTML source renders like so:

<div class="rowElem">
    <div class="data_entry_pair" style="width:250px">
        <span id="ctl00_Body_lblSortName" class="label">Sort Name:</span>
        <input name="ctl00$Body$txtSortName" type="text" id="ctl00_Body_txtSortName" class="input" style="width:250px;" />
    </div>
</div>

我知道很长的问题...感谢阅读。我只是讨厌一次又一次地重复同样的事情，因为它可以编程一次（这是OO的部分内容）。



谢谢！

Long question I know ... thanks for reading. I just hate having to repeat the same thing over and over again when it could be programmed once (which is what OO is partially about).

Thank you!

推荐答案

Body

txtSortName 类型 = text id = ctl00_Body_txtSortName class = input style = width：250px; / >
< / div >
< / div >

txtSortName" type="text" id="ctl00_Body_txtSortName" class="input" style="width:250px;" /> </div> </div>

长问题我知道...感谢您的阅读。我只是讨厌一次又一次地重复同样的事情，因为它可以被编程一次（这是OO的部分内容）。



谢谢！

Long question I know ... thanks for reading. I just hate having to repeat the same thing over and over again when it could be programmed once (which is what OO is partially about).

Thank you!

由于标签呈现为 span ，所以这样做。

As the label is rendered as span, so do like this.

.data_entry_form .data_entry_pair span {
    font: normal 12px "Verdana", Arial, Helvetica, sans-serif;
    margin-right:5px;
    text-align:left;
    background-color:#FFFFFF;
    width: auto;
}

这篇关于CSS和服务器端控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！