プロが教えるわが家の防犯対策術!

こんにちわ、kaituといいます。
最近スライスをもちいて、デザインを勉強しています。

しかし、HPをデザインした場合、
画像をスライスして色数等編集し、そのままDreamweaverに持っていき、
文章の所だけ、画像を削除(白くする)して、文章入れてupします。
すると、やはりブラウザで見た場合デザインがずれてしまい、それを直すのが一苦労なのです。。
グリッドを表示して、それに合わせて構成するとずれなくなるんでしょうか;

他の方法として、1×1の透明GIF画像を画像と画像の間にいれ、
ずれるのを防ぐ為にやっていますが、効果が全然ありません。。;
後、できるだけ画像を少なくするよう、
スライス画像の不要な部分(白い部分等)は、Dreamweaver上で画像を消していっています。

まだまだ勉強中なので、試行錯誤してやっているのですが、やりなおしで時間ばかりがすぎてしまって中々;
デザイン重視なので、スライスが多いのも原因でしょうか。。
皆さん、スライスをどのようにして使っているんでしょうか?
参考になるサイトや、ずれを防ぐアドバイス等あれば回答お願いします。

A 回答 (2件)

こんにちは!



【Web用に保存】の時に、画像のいらない部分のスライス上でダブルクリックします。

【スライスオプション】がでますので、『スライスの種類』を『画像なし』にして設定してみてください。

スライスはあまり複雑にならないように工夫してみてください。
    • good
    • 0
この回答へのお礼

ありがとうございますっ。
これ知らなかったです。。これでずれなくなりました!
いつも1×1スペースでなんとかやってたんですが;(変形させてとか)
簡単でずれなくなりました、ありがとうございましたっ!

お礼日時:2005/05/08 19:57

作り方は人各々、ズレる原因も色々あるので、一例として参考になればと思います。


スライスの入るテーブルの最上段と最右段に1pixelの隠しセルを作り、
各セルのwidthとheightの値を指定します。
(隠し部分の結合セルは全て分割)
これだとズレなく作れると思います。
※作業中は隠しセルが選択しづらいので、テーブルのセル余白を
10pixelくらいにして作業し、終わったら0pixelに戻します。

●意味がわかりにくい場合のために以下、サンプルソースです。
DWにコピペして見てください。

<table width="601" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="120" height="1"><img src="spacer.gif" width="120" height="1"></td>
<td width="180" height="1"><img src="spacer.gif" width="180" height="1"></td>
<td width="130" height="1"><img src="spacer.gif" width="130" height="1"></td>
<td width="170" height="1"><img src="spacer.gif" width="170" height="1"></td>
<td height="1" width="1"><img src="spacer.gif" width="1" height="1"></td>
</tr>
<tr>
<td colspan="2" rowspan="2"><img src="image.gif" width="300" height="110"></td>
<td>text</td>
<td><img src="image.gif" width="170" height="50"></td>
<td width="1" height="50"><img src="spacer.gif" width="1" height="50"></td>
</tr>
<tr>
<td rowspan="2"><img src="image.gif" width="130" height="80"></td>
<td>
<p>text</p>
</td>
<td width="1" height="60"><img src="spacer.gif" width="1" height="60"></td>
</tr>
<tr>
<td>text</td>
<td rowspan="2">text</td>
<td rowspan="2"><img src="image.gif" width="170" height="65"></td>
<td height="20" width="1"><img src="spacer.gif" width="1" height="20"></td>
</tr>
<tr>
<td><img src="image.gif" width="120" height="45"></td>
<td>text</td>
<td height="45" width="1"><img src="spacer.gif" width="1" height="45"></td>
</tr>
</table>
    • good
    • 0
この回答へのお礼

ふむふむ、なるほどぉ。
試してみました~。
少しやりずらいですが、具体的にサンプルソースまでありがとうございますw
やはり隠しセルでずれを防止する方法が主なのですね~。回答ありがとうございましたっ!

お礼日時:2005/05/03 02:28

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!