如何将作为 ASP.NET 图像控件提供的图像居中？答案

【问题标题】：How do I center an image provided as an ASP.NET image control?如何将作为 ASP.NET 图像控件提供的图像居中？
【发布时间】：2010-11-17 10:15:28
【问题描述】：

这个问题很简单。我有一个<asp:Image>，它住在<asp:Panel>。我的目标是提供一个非常基本的“打印预览”，可以选择左对齐、居中对齐或右对齐。面板代表整个打印区域（一张 8.5" x 11" 的纸），里面的图像是实际打印的区域。完整代码如下：

<asp:Panel ID="Panel2" runat="server"
    BackColor="Black"
    BorderStyle="Inset" 
    Width="425px"
    Height="550px" >
    <asp:Image runat="server" Height="425px" ImageAlign="" />
</asp:Panel>

我在后面的代码中设置了ImageUrl 属性，没有问题。如果我想将图像一直向左或向右对齐，我可以指定ImageAlign="[Left|Right]"。但是，我一直无法找到一种方法来将面板中的图像居中。我已经尝试了所有不同的 ImageAlign 值，但它们似乎都没有做我想要的。我在这里吗？如果必须，我可以更改图像或面板的 CSS 类，但我也无法用这种方法找到任何成功的方法。

【问题讨论】：

标签： asp.net css image panel

【解决方案1】：

如果你使用面板 HorizontalAlign="Center" 属性会怎样......

<asp:Panel runat="server" ID="Panel2" HorizontalAlign="Center">
</asp:Panel>

【讨论】：

【解决方案2】：

在您的面板标签（成为 div 客户端）中添加此属性：

CssStyle="text-align:center;"

虽然这会将所有内容都集中在该面板中。

也许只是将图像的 CssStyle 设置为硬编码的左边距？如果您的目标是固定宽度的打印预览，这应该没问题。

【讨论】：

只有一种方法可以找出答案 ;) ...我认为您只需将 ImageAlign 属性排除在外。

【解决方案3】：

面板 CSS 属性：

CssStyle="alignCenter"

CSS：

.alignCenter
{
    margin: 0 auto;
}

【讨论】：

【解决方案4】：

您可以使用内联样式表或外部样式表来完成此操作并在其中添加您的 css 代码

【讨论】：