CSS Repeater 交错显示行背景色 table行鼠标进入事件特效 禁止文本换行

 1. 禁止文本换行的CSS: white-space:nowrap;
    strict mode下在IE7和FF中都正常，以前IE用的word-break、word-wrap属性对FF无效。

    2. Repeater控件，交替显示table行的背景颜色，鼠标移动到某一行时用特殊背景显示。
    方法purecss给出了很多种，看了一下现在新浪邮箱，使用的也是文章中选择的方法。
    repeater控件:

<asp:Repeater ID="Repeater1" runat="server">
    <HeaderTemplate>
        <table class="list" cellpadding="0" cellspacing="0">
            <tr class="listheader">
                <th>&nbsp;</th>
                <th>查看</th>
                <th>编辑</th>
                <th>模板ID</th>
                <th>用户编号</th>
                <th>描述</th>
                <th>状态</th>
                <th>控制类</th>
                <th>模板内容</th>  
            </tr> 
    </HeaderTemplate>
    <ItemTemplate>
        <tr class="listitem1" onmouseover="this.className='over'" onmouseout="this.className='listitem1'">
            <td class="cmdtd">
                <asp:CheckBox ID="CheckBox1" runat="server" />
               <asp:HiddenField ID="templateID" runat="server" Value='<%# DataBinder.Eval(Container.DataItem, "ID")%>'/>
            </td> 
            <td class="cmdtd">
               <asp:ImageButton ID="cmdView" runat="server" ImageUrl="../../Skin/default/icon_view.gif" CausesValidation="False"
                   OnCommand="cmdView_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
               </asp:ImageButton>
            </td> 
            <td class="cmdtd">
               <asp:ImageButton ID="cmdEdit" runat="server" ImageUrl="../../Skin/default/icon_edit.gif" CausesValidation="False"
                   OnCommand="cmdEdit_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
               </asp:ImageButton>
            </td> 
            <td><%# DataBinder.Eval(Container.DataItem, "ID")%></td> 
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "ShortName"))%></td> 
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "LongDescription"))%></td> 
            <td><%# DataBinder.Eval(Container.DataItem, "State")%></td>  
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "AttributeProvider"))%></td> 
            <td>
                <textarea id="Textarea1" rows="3" class="textbox" readonly="readonly" cols="20" style="400px;">
                    <%# DataBinder.Eval(Container.DataItem, "Content.Content")%>
                </textarea>
            </td> 
        </tr>
    </ItemTemplate>
    <AlternatingItemTemplate>
        <tr class="listitem2" onmouseover="this.className='over'" onmouseout="this.className='listitem2'">
            <td class="cmdtd">
                <asp:CheckBox ID="CheckBox1" runat="server" />
               <asp:HiddenField ID="templateID" runat="server" Value='<%# DataBinder.Eval(Container.DataItem, "ID")%>'/>
            </td> 
            <td class="cmdtd">
               <asp:ImageButton ID="cmdView" runat="server" ImageUrl="../../Skin/default/icon_view.gif" CausesValidation="False"
                   OnCommand="cmdView_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
               </asp:ImageButton>
            </td> 
            <td class="cmdtd">
               <asp:ImageButton ID="cmdEdit" runat="server" ImageUrl="../../Skin/default/icon_edit.gif" CausesValidation="False"
                   OnCommand="cmdEdit_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
               </asp:ImageButton>
            </td> 
            <td><%# DataBinder.Eval(Container.DataItem, "ID")%></td> 
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "ShortName"))%></td> 
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "LongDescription"))%></td> 
            <td><%# DataBinder.Eval(Container.DataItem, "State")%></td>  
            <td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "AttributeProvider"))%></td> 
            <td>
                <textarea id="Textarea1" rows="3" class="textbox" readonly="readonly" cols="20" style="400px;">
                    <%# DataBinder.Eval(Container.DataItem, "Content.Content")%>
                </textarea>
            </td> 
        </tr>
    </AlternatingItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

    CSS:

.list
{
    border-right:solid 1px #888888;
    border-top:solid 1px #888888;
}
tr.listheader td,th
{
    border-left:solid 1px #BBBBBB;
    border-bottom:solid 1px #BBBBBB;
    background-color:#E6F6F6;
    color:#444444;
    white-space:nowrap;
    padding:1px 1px 1px 1px;
    font-weight:bold;
}
tr.listitem1 td
{
    border-left:solid 1px #BBBBBB;
    border-bottom:solid 1px #BBBBBB;
    background-color:#FFFFFF;
    padding:1px 1px 1px 1px;
    text-indent:1px;
}
tr.listitem2 td
{
    border-left:solid 1px #BBBBBB;
    border-bottom:solid 1px #BBBBBB;
    background-color:#F6F6F6;
    padding:1px 1px 1px 1px;
    text-indent:1px;
}
tr.over td
{
    border-left:solid 1px #BBBBBB;
    border-bottom:solid 1px #BBBBBB;
    background-color:#FEE6BA;
    padding:1px 1px 1px 1px;
    text-indent:1px;
}
.cmdtd
{
    text-align:center;
}

    服务器event handler:

protected void cmdView_Click(object sender, CommandEventArgs e)
{
    this.Response.Redirect("TemplateEdit.aspx?op=view&" + "id=" + e.CommandArgument.ToString());
}
protected void cmdEdit_Click(object sender, CommandEventArgs e)
{
    this.Response.Redirect("TemplateEdit.aspx?op=edit&" + "id=" + e.CommandArgument.ToString());
}

    效果（第4行为鼠标所在的行）: