0

わかりましたので、ここに基本的なページがありますhttp://basic.louisvillemarketing.net/

<html>
<head>

</head>
<body>
<!-- menu -->
<div style="width:100%;height:25px;background-color:red;">
<div style="width:1000px;margin:0 auto;">
<div id="topmenu">
Headers Page     Links Page     Blockquote Page     UL and OL Page     Image Page
</div><!-- //.topmenu -->
</div><!-- //.row -->
</div><!-- //.container -->
<!-- //menu -->
<!-- footer credit -->
<div style="width:100%;height:25px;background-color:black;">
<div style="width:1000px;margin:0 auto;">
<span style="float:right;color:black;">foot credit here</span>
</div>
</div>
<!-- //footer credit -->
</body>
</html>

問題は、画面を小さくすると、たとえば幅が 700 ピクセル未満になると、色の 100% div が拡大されないため、コンテンツのペースは維持されますが、背景は維持されないことです。

このページをワードプレスの外に移動しても問題ありませんが、ワードプレスではレスポンシブになります。テーマは @medias の基本的なテーマです。

4

1 に答える 1

0

幅に % を使用するか、@medias を使用して異なる画面サイズの幅を定義します

<html>
<head>

</head>
<body>
<!-- menu -->
<div style="width:100%;height:25px;background-color:red;">
<div style="width:80%;margin:0 auto;">
<div id="topmenu">
Headers Page     Links Page     Blockquote Page     UL and OL Page     Image Page
</div><!-- //.topmenu -->
</div><!-- //.row -->
</div><!-- //.container -->
<!-- //menu -->
<!-- footer credit -->
<div style="width:100%;height:25px;background-color:black;">
<div style="width:80%;margin:0 auto;">
<span style="float:right;color:black;">foot credit here</span>
</div>
</div>
<!-- //footer credit -->
</body>
</html>

これでうまくいくはずです。幅をパーセントに変更しました。

于 2013-02-01T14:23:11.507 に答える