1

Web テンプレート (Photoshop で作成) を準備し、サーバーにアップロードするように設定しました。ただし、ユーザーが画像を非表示/無効にすると、すべてのテキストが画像上にあるため、Web サイトは空白になります。

CSS レイアウトを作成し、Web サイトのテキスト バージョンを作成したいのですが、テキストが画像に重ならないようにするにはどうすればよいですか?? ユーザーがブラウザで画像を無効にした場合でも、テキスト バージョンの Web サイトが表示されるようにしたいと考えています。

HTML コード:

<div id="main_divs_container">
    <div id="left_div"><img src="images/left_div.jpg" width="249" height="622" alt=""></div>
    <div id="index_middle_div"><img src="images/index_middle_div.jpg" width="488" height="622" alt=""></div>
    <div id="right_div"><img src="images/right_div.jpg" width="253" height="622" alt=""></div>
</div>
4

3 に答える 3

4

alt=タグにテキストを配置します。

画像がブロックされているときにテキストが表示されるはずです。
(何らかの方法で画像にアクセスできない場合にコンテンツを表すことが alt タグの目的です)

ただし、大量のテキストが含まれていると、まったくレンダリングされない場合はきれいではありません。
最良のオプションは、画像 (テキストなし) を背景として使用し、HTML を介してその上にテキストを追加することです。

于 2012-12-14T08:41:41.600 に答える
0

CSS画像置換（http://css-tricks.com/css-image-replacement/）を使用して、HTMLに同じ時間にテキストと画像を含めることができます（テキストは表示されません）。

あなたはCSSスタイルを書かなければなりません。それは画像を表示してテキストを非表示にし、次に反対を行います。

次に、JSを使用して正しいスタイルを適用し、ユーザーが画像をブロックしたかどうかを検出します:)

于 2013-01-27T11:43:27.267 に答える
0

ウェブサイトの html バージョンを 1 つ作成する必要があります。Photoshop では、参照用またはクライアント レビュー用 (視覚的な目的のみ) にテンプレートを作成します。それは最終的な出力ではありません。

于 2012-12-14T08:47:05.437 に答える