0

サイトの新しいテーマを作成するための基本的なテーマとして禅を使用しています。問題は、高さと幅を指定するまで表示されないヘッダーとフッターの背景画像が必要なことです。さらに、#header と #footer 内の CSS で指定された高さと幅は、そうしないと、画像が正しく表示されません (画像の一部が切り取られます)。背景画像が自動調整されるように、サイズの制約なしでヘッダーとフッターの CSS を記述できるソリューション (CSS または PHP のいずれかを使用) はありますか? ヘッダーとフッターにはブロックが含まれていません。CSS の一部は次のとおりです。

#header
{   
          background-image:url(images/header.jpg);
          background-repeat:no-repeat;
          height:
          background-position:center;
}

#footer
{
        margin-top:0px;
        background-image:url(images/footer.jpg);
        height:391px;
        background-position:center;
}

#footer-inner
{
        text-align:center;
        padding:4px 10px 10px 10px;
}
4

3 に答える 3

1

画像を自動的にスケーリングする場合はimg、各画像にタグを使用し、幅/高さを 100% に設定する必要があります。これにより、親コンテナーと同じサイズになるように自動的にスケーリングされます。つまり、ブラウザー ウィンドウのサイズに合わせて画像をスケーリングする場合は、親コンテナーの幅/高さを固定ピクセルの幅/高さではなく、パーセンテージで設定する必要があります。

そのようなことを行うサイトはほとんどありません。固定サイズの画像を再検討して使用することをお勧めします。

于 2009-12-26T22:07:09.517 に答える
0

CSS の背景画像は、それらが配置されている div の背景に表示されるように設計されています。これは、div のサイズによって、表示される画像の範囲が決まることを意味します。あなたの場合、ヘッダー領域にはコンテンツがないため、#header には layout.css で設定されたデフォルトの寸法があります。

発見したように、ヘッダー div にコンテンツがない場合は、最初に投稿した CSS で (推奨)、または正しいサイズの空のブロックを使用して (推奨されません)、ヘッダーのサイズを目的のサイズに明示的に設定する必要があります。まれな状況を除いて）。

于 2010-01-06T13:50:01.443 に答える
0

前処理機能を使用すると、選択した画像に基づいてヘッダーとフッターのクラスを設定できるはずです。ただし、画像に一致するように、さまざまなクラスの CSS を作成する必要があります。

例えば：

前処理機能

function themename_preprocess_page($vars) {
  $classes = array('image1', 'image2', 'image3');

  $vars['header_class'] = array_rand($classes);
}

CSS

#header .image1 {
  background-image: url(path/to/image.jpg);
  height: [imageheight] px;
  width: [imagewidth] px;
}

うまくいけば、これが役に立ちます。

于 2009-12-28T21:11:46.653 に答える