0

ページの中央に配置しようとしているロゴがあります。左から右への死点。私が直面している問題は、さまざまなモニターのサイズ/解像度で表示すると、中央に配置されないことです。1 つの解像度/サイズで正しく表示されますが、小さなモニターで作業すると、整列しません。これは、複数のスタイルシートまたは動的テーマで達成する必要がありますか? 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;
}
4

3 に答える 3

1

画像の幅が常に特定の幅、たとえば300pxになる場合は、次のcssを画像に適用できます。

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

ただし、「マージン：0自動」を選択しようと思います。

于 2012-07-17T20:39:50.087 に答える
1

CSSのみを使用してそれを達成できるはずです。

#theCoolestLogoEver{
  margin: auto auto;
}
于 2012-07-17T19:35:31.320 に答える
0

画像に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を使用していることにも気づきましたが、あなたが思っていることをしているとは思いません。コントロールで使用するスキンを設定するので、代わりに

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

試す

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

そしてあなたにCSSを設定してもらいます

.blah { 
   margin: auto auto;
}
于 2012-07-17T19:39:47.100 に答える