Question

我有一个徽标，我试图以页面为中心。死亡中心从左到右。我遇到的问题是当我在不同的显示器尺寸/分辨率上查看它时，它从不排列在中心。我在一个分辨率/大小上得到它，然后当我在我的小型显示器上工作时它没有排队。这是否需要使用多个样式表或动态主题来完成？我正在使用ASP.NET编写网站并设置主题。如果需要，可以更改。

<body>
<div class="wrap_1">
    <form id="form1"  runat="server">
    <!-- LOGO WRAP STARTS HERE-->

        <asp:Image SkinID="DefaultLogo" runat="server"/>

  <div style="background-color: #c5e8ea;"  >
  <!-- TITLE WRAP STARTS HERE-->
    <div class="wrap">
<div>
    <h1 style="padding-left:2em;">BLAH BLAH BLAH </h1>
    <h2 style="padding-left:5em;">BLAH BLAH BLAH </h2>
    <div>
 <!--CONTROLS -->
 <ul id="home-menu">
    <li>
        <asp:Button SkinID="Button1" runat="server" PostBackUrl="~/Reinstall.aspx"/>
    </li>
    <li>
        <asp:Button SkinID="Button2" runat="server" PostBackUrl="~/Registration.aspx" />
    </li>
</ul>


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

CSS

.DefaultLogo {
     margin: auto auto;
}

.wrap_1 {
    margin: 0 auto;
}

.wrap {
    margin: auto auto;
}

Answer 1

您应该只能使用CSS实现这一目标。

#theCoolestLogoEver{
  margin: auto auto;
}

Answer 2

如果你的图像宽度总是一定的宽度，让我们说300px，那么你可以将这个css应用到它：

#Logo {
    width: 300px;
    height: 110px;
    position: relative;
    left: 50%;
    margin-left: -150px;
}

我会尝试选择“margin：0 auto”选项。

Answer 3

您可以为您的图片提供ID或类，并在css中设置或仅将样式设置为内嵌

<img src="blah" style="margin: auto auto;"/>

或在CSS

中

<img src="blah" name="moo"/>

#blah { 
    margin: auto auto;
}

或使用类

的CSS

<img src="blah" class="moo"/>

.blah { 
   margin: auto auto;
}

我也注意到你在配件中使用了SkinID，我认为它不会像你认为的那样。它设置了应该在控件上使用的Skin，而不是

<asp:Image SkinID="DefaultLogo" runat="server"/>

尝试

<asp:Image runat="server" CssClass="moo"/>

并将CSS设置为

.blah { 
   margin: auto auto;
}

跨多个分辨率居中徽标

3 个答案: