How to display it out without using the Mouse to highlight it?

Question

Here is my designer code

 <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
            <asp:Repeater ID="Repeater1" runat="server">
                <ItemTemplate>
                    </br>Product Name:<%#DataBinder.Eval(Container.DataItem,"ProductName") %>
                    </br>Quantity:<%#DataBinder.Eval(Container.DataItem,"Quantity") %>
                </ItemTemplate>
            </asp:Repeater>
        </asp:Content>

When I run the program, the repeater details like product name and Quantity details will hidden it and only display when I use the mouse to highlight it.

Answer 1

Since you have set the background color of the body of the HTML document, then the repeater is just inserting text on top of that background, thus it is inheriting the background color of the body.

To control the background color of the Product Name and Quantity, put them inside of ASP.NET Label controls and then use CssClass to control their background color, like this:

<ItemTemplate>
    <br/>
    <asp:Label id="Label1" runat="server" CssClass="WhiteBackground" 
        Text="Product Name: " />
    <asp:Label id="LabelProductName" runat="server" CssClass="WhiteBackground"
        Text='<%#DataBinder.Eval(Container.DataItem,"ProductName") %>' />
    <br/>
    <asp:Label id="Label2" runat="server" CssClass="WhiteBackground" 
        Text="Quantity: " />
    <asp:Label id="LabelQuantity" runat="server" CssClass="WhiteBackground"
        Text='<%#DataBinder.Eval(Container.DataItem,"Quantity") %>'
</ItemTemplate>

CSS:

.WhiteBackground {
    background-color: white;
}