Question

下面的标记将面板一个显示在另一个下面。我想做的就是将它们紧挨着显示出来。这是标记：

<div>
    <asp:Panel ID="pnlA" runat="server">
        <img src="../images/A.png" /> 
        <asp:Literal ID="litA" runat="server" Text="A"></asp:Literal>
    </asp:Panel>
    <asp:Panel ID="pnlB" runat="server">
        <img src="../images/B.png" /> 
        <asp:Literal ID="litB" runat="server" Text="B"></asp:Literal>
    </asp:Panel>
</div>

以上显示如下：

图片A

图片B

事实上，我希望它像Image A Image B

呈现的HTML与上面几乎相同，但面板呈现为div，因此没有内容的结构是：

<div>
    <div></div>
    <div></div>
<div>

Answer 1

Panel以HTML格式呈现为div。最简单的方法是使用CSS来覆盖div的默认行为。

<asp:Panel ID="pnlA" runat="server" style="display:inline;">
    <img src="App_Themes/TicketDeskTheme/file.gif" /> 
    <asp:Literal ID="litA" runat="server" Text="A"></asp:Literal>
</asp:Panel>
<asp:Panel ID="pnlB" runat="server" style="display:inline;">
    <img src="App_Themes/TicketDeskTheme/file.gif" /> 
    <asp:Literal ID="litB" runat="server" Text="B"></asp:Literal>
</asp:Panel>

此示例使用style属性，该属性直接传递给HTML。如果您更喜欢在可重用的样式表中使用CssClass，那么可以使用它。

Answer 2

asp：Panel将呈现为DIV，查看this answer并查看其是否有效

如何在同一行显示asp：面板？

2 个答案: