Question

我正在尝试在转发器中使用CSS。当我运行它时，没有格式。但是，当我在中继器中使用css时，它的格式很好。

<style>
   body {
       background-color:lightgray
   }
   .messageBox p  {
        background-color:white;
        width: 25%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
   }
</style>

外部中继器

<div class="messageBox">
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
  <p>The quick brown fox jumped over the lazy dog</p>
</div>

在中继器内部

<asp:Repeater ID="myRepeater" runat="server">
    <ItemTemplate>
        <br />
        <div class="messageBox">
            <p>
                <%# Eval("Message") %>                            
            </p>
        </div>
    </ItemTemplate>
</asp:Repeater>

Answer 1

您需要将<div class="messageBox">移至HeaderTemplate或转发器之前，然后将</div>移至FooterTemplate或转发器末尾。

最终结果应类似于：

<asp:Repeater ID="myRepeater" runat="server">
    <HeaderTemplate>
        <div class="messageBox">
    </HeaderTemplate>
    <ItemTemplate>
        <br />
        <p>
            <%# Eval("Message") %>                            
        </p>
    </ItemTemplate>
    <FooterTemplate>
        </div>
    </FooterTemplate>
</asp:Repeater>

或：

<div class="messageBox">
    <asp:Repeater ID="myRepeater" runat="server">       
        <ItemTemplate>
            <br />
            <p>
                <%# Eval("Message") %>                            
            </p>
        </ItemTemplate>     
    </asp:Repeater>
</div>

我喜欢第一种方法，因为如果没有数据，它将不会留空div元素。

CSS在中继器内未格式化

1 个答案: