0

私はここにこのサイトを持っていますhttp://cowelllaserhair.com/index.phpそしてあなたはそのようにそれの周りにdivが巻かれた段落があることに気付くでしょう...

<div style="background-image:url(/images/newLocation.jpg);">
<p style="text-align:center;">
Text here
</p>
</div>

しかし、それは画像を切り取り、私もこのように画像をより高くしたいと思っています

これは可能ですか？どうすればこれを行うことができますか？

背景画像を使用してdiv内の画像の高さを追加することにより、画像が切り取られる問題を解決しました<div style="background-image:url(/images/newLocation.jpg); height:580px;">

現在の唯一のことは、画像内のテキストを取得することです。http://cowelllaserhair.com/index.phpにアクセスして、私が話していることを確認してください。

4

2 に答える 2

1

'p'タグは実際には必要ありません。

divを背景画像と同じ幅と高さに設定し、テキストを中央に揃えるだけです。

次に、テキストが必要な位置になるように、DIVの上部にパディングを設定します（使用する上部のパディングの量をDIVの高さから差し引くようにしてください。

背景画像を繰り返しなしで、左上の位置に設定します。

シンプル。

div {
    width:XXXpx
    height:XXXpx
    padding-top:20px;
    background:url(/images/newLocation.jpg) no-repeat 0 0;
    text-align:center;
}

<div>
    Text here
</div>
于 2012-08-31T16:11:03.787 に答える
0

次の2つのルールを追加することをお勧めします。

  • position: relativeにdiv;

  • position: absolute段落に。

このようにして、段落を親の内部に簡単に移動できます。

このjsFiddletop: 100pxを確認してください：段落を垂直方向の中央に配置するために、段落に適用しましたdiv。

于 2012-08-31T16:05:49.987 に答える