Question

asp.net repeater交替模板各行变色，点击，悬浮变色，不要复制粘贴

Answer 1

Repeater控件中的模板有五种

1. HeaderTemplate：头部模板

2. FooterTemplate：尾部模板

3. ItemTemplate：元素模板

4. AlternatingItemTemplate：交替元素模板

5. SeperatorTemplate：分隔模板
   

不复制代码给你看你是不会明白滴，请看大屏幕：

使用Repeater生成表格，交替行使用不同的颜色：

<asp:Repeater ID="Repeater1" runat="server">
    <HeaderTemplate><!--header不会重复-->
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Gender</th>
                    <th>Age</th>
                    <th>Company</th>
                    <th>Phone</th>
                </tr>
            </thead>
            <tbody>
    </HeaderTemplate>
    <ItemTemplate><!--模板是重复滴-->
        <tr class="white">
            <td><%#Eval("name") %></td>
            <td><%#Eval("gender") %></td>
            <td><%#Eval("age") %></td>
            <td><%#Eval("company") %></td>
            <td><%#Eval("Phone") %></td>
        </tr>
    </ItemTemplate>
    <AlternatingItemTemplate><!--顾名思义：交替行和上面的ItemTemplate交替出现-->
        <tr class="bisque">
            <td><%#Eval("name") %></td>
            <td><%#Eval("gender") %></td>
            <td><%#Eval("age") %></td>
            <td><%#Eval("company") %></td>
            <td><%#Eval("Phone") %></td>
        </tr>
    </AlternatingItemTemplate>
    <FooterTemplate><!--footer不会重复-->
            </tbody>
        </table>
    </FooterTemplate>
</asp:Repeater>

普通模板和交替模板中的行用css控制，显示不同的颜色，悬浮变色也是css的伪类实现。

table tr.white {
    background-color: white;
}
table tr.bisque {
    background-color: bisque;
}
table tbody tr:hover {
    background-color: #eee;
}

以上给出的不是全部代码，数据怎样绑定，表格的字体、高度、边框相信楼主自己会搞定吧？

这是运行过后的截图，还满意吧？

有一行是灰色的，因为鼠标悬停在上面，但是鼠标不出现在截图中。这一行的颜色本身是白色的，希望不会给楼主带来困扰。