0

私は画像を含むハイパーリンクを持っていますが、特別なことは何もありません-このように。

添付ファイル1に従ってテキストを画像の右側に配置したいのですが、結果は添付ファイル2に従って作成されます。長方形(幅と高さ)を埋めるようにハイパーリンクもブロックする必要があります

添付資料1

スクリーンショット

誰もがこれを達成する方法を知っていますか?

4

3 に答える 3

1

これを行う方法の束:

<div>の使用

<div style="width: 200px;">
<div style="float: left; width: 70px;">
<img src="http://a0.twimg.com/profile_images/749158551/Ry_reasonably_small.jpg" width="64" height="64" />
</div>
<div style="float: right; width: 130px;">
<p><strong><a href="#">This is a really really over sized title for a link to neverland</a></strong></p><p>Some other text</p>
</div>
<div style="clear: both;">
</div>

を使って<table>

<table width="200">
  <tr>
   <td rowspan="2"><img src="http://a0.twimg.com/profile_images/749158551/Ry_reasonably_small.jpg" width="64" height="64" /></td>
   <td><strong><a href="#">This is a really really over sized title for a link to neverland</a></strong></td>
 </tr>
  <tr>
   <td>Some other text</td>
 </tr>
</table>
于 2012-09-07T17:25:08.563 に答える
1

これをあなたのページに置いて、何が起こっているか見てください。乾杯

<div style="width:500px;height:250px; padding:10px; padding-left:250px; border:solid 1px black; background-repeat:no-repeat; background-position:left center; background-image:url('https://lh4.googleusercontent.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAlUA/EHduo3GhTDs/s250-c-k/photo.jpg')">
        Google – 52 minutes ago – September 8 marks the anniversary of Star Trek's first broadcast, and naturally ... Amit Singhal originally shared this post: OK, I admit it, I am a die-hard Trekkie. I grew up watching endless ...
        Google – 18 hours ago – By now, you may know that when you search for [define] followed by a word, Google will show you the definition. But did you know that there's a Dictionary mode ...
</div>
于 2012-09-07T17:25:32.043 に答える
1

@njkに似ていますがa、ブロック要素としてを使用します。 http://jsfiddle.net/scrimothy/r6TKz/

于 2012-09-07T17:28:18.240 に答える