[WordPress] 余白を追加する/背景をパディング: カバーですか?

スポンサーリンク

質問

フルスクリーン画像

background: cover

を使用して

body

クラスに追加する新しいウェブサイトに取り組んで

それはうまく動作しますが、現時点では、背景画像のによって隠されるヘッダーおよびフッターとしてそれを変更したいです。上部の余白を追加することについて考えたが、これは働かなかった。

誰も助けることができるか?参考のためのリンクです: http://charlyanderson.co.uk/MixSingh/ingredients/

事前のおかげで:-)

答え

1 つの可能な解決策は、

background-image

を追加すること、

<div>

/

<section>

/

<main>

にあなたのコンテンツを含む

コースのことを行う場合があることを確認する:

  • <header>

    の間に余白がないと

    <main>

    または

    <main>

    の間と

    <footer>
  • <footer>

    はあなたに重要であるあなたの背景イメージの一部と重複しない

  • <main>

    は十分な背の高い

  • <main>

    はフル幅

また、あなたの

<header>

の高さがわかっている場合をもありますあなたの

background-image

を置くことができる:

header {
    height:100px;
}
body {
    background-repeat: no-repeat;
    background-position: center 100px;
}

答え

<div id="section-content">

<body>

からあなたの背景を移動する必要があります

答え

バック グラウンド カバー イメージ #section コンテンツ div に移動可能性があります、が重なってからヘッダーだけを停止します。

.Sixteen クラスは 100 % であなたのケースでは常に、フッターの下でそれを強制的に設定されている高さ

レイアウトは少し再考する必要があります

私の経験で、調節可能なを使用してサイズの背景イメージとこのような箱私は終わる jQuery を使用して div を動的にサイズ変更する

ここで例に示します: http://www.weloveteachers.org/

http://stackoverflow.com/questions/29123621/adding-margin-padding-to-background-cover

スポンサーリンク

Leave a Reply