3

HTMLを初めて使用するので、左に示す画像を表示したいと思います。

画像を表示しましたが、table rowそのテキストを取得できません（blog.comの下に表示されているIN）。

どうすれば画像に書き込むことができますか？

助けていただければ幸いです。

編集

私は試した

.logoBg
{
    background-image: url('images/logo01.gif');
    background-color: #72c2dd;
}

と

<tr class="logoBg">
    <td colspan=5>IN
    </td>
    </tr>

しかし、私はテキストと背景色だけを取得していますが、背景画像は取得していません。

4

5 に答える 5

10

例として：

これをHTMLとして使用できます。

<tr>
<div class="image">
  <img alt="" src="http://www.YourDomain.com/img/yourImage.jpg" />
  <div class="text">
    <p>This is some demonstration text</p>
    <p>This is some more wonderful text</p>
  </div>
</div>
</tr>

次にこれをCSSとして：

.image {
    position:relative;
}
.image .text {
    position:absolute;
    top:10px;
    left:10px;
    width:300px;
}

これにより、テキストが画像に直接配置されます。

于 2012-07-05T06:46:59.803 に答える
2

画像を背景画像として使用し、テキストを同じ要素に配置します。

HTML：

<table>
 <tr>
  <td id="myTableCell">
   In
  </td>
 </tr>
</table>

CSS：

.myTableCell {
  background-image: url(Images/MyImage.png);
}
于 2012-07-05T06:44:23.170 に答える
1

@Ecnalyrは正しいですが、を使用する場合position:absolute、位置はブラウザの左上隅から計算されます。私はそれがあなたが望むものだとは本当に疑っています。むしろ、position:relative+ veと-veの数字を使用してテキストを使用および配置し、divを配置する場所を基準にしてテキストを画像上に配置します。

于 2013-09-27T13:18:58.233 に答える
0

background-image cssを使用して、このテーブルセルの背景として画像を作成し、そのセルにテキストを書き込むことができます。

于 2012-07-05T06:44:09.647 に答える
0

画像の包含要素に位置：相対が適用されている場合、画像の絶対上に配置される要素を追加できます

于 2012-07-05T06:44:51.177 に答える