Sample

<SiteBuilder:Form input-class="mod-input">

  <HeaderTemplate>

    <table cellpadding="5" cellspacing="0" width="100%" class="mod-form" style="margin: 10px 0; border: 0;">

  </HeaderTemplate>

  <FieldTemplate>

    <tr>

      <td width="30%">$Caption$<SiteBuilder:ValidationText Display="Static" ID="IsRequired" /></td>

      <td width="70%"><SiteBuilder:Container ID="InputHolder" /></td>

    </tr>

  </FieldTemplate>

  <AlternatingFieldTemplate>

    <tr>

      <td width="30%">

        $Caption$<SiteBuilder:ValidationText Display="Static" ID="IsRequired" />

      </td>

      <td width="70%"><SiteBuilder:Container ID="InputHolder" /></td>

    </tr>

  </AlternatingFieldTemplate>

  <FooterTemplate>

    </table>

  </FooterTemplate>

</SiteBuilder:Form>

In the <HeaderTemplate> tag of this file, you can change the top part of a form. Usually, it contains the start-tag of the TABLE element. You can change the styles through the mod-form class or specify another class.

To configure the design of fields, use the FieldTemplate and AlternatingFieldTemplate tags. These tags are used to set the html-layout of even and odd fields respectively. For example, you can set different backgrounds for even and odd fields.

The $Caption$ variable contains the description of a field. The ValidationText control with ID=IsRequired defines the place where the "is required" asterisk appears on the screen. You can set class or style attributes for this control. Also, you can change the way the validation messages appear on the page: if you set Display="Static", the space for the validation message will be allocated in the page layout. If you set Display="Dynamic", the space for the validation message will be dynamically added to the page.

In the <FooterTemplate> tag of this file, you can change bottom part of a form. Usually, it contains the end-tag of the TABLE element.