イラストサイトを作っています!!

このQ&Aのポイント
  • イラストサイトを作り始めました。テンプレートはあるサイト様からお借りしました。メモ帳で順調に編集をしていました。
  • イラストのページでは、右の大きな画面にイラストは記号で選択をし、その選択一覧の下に、選択したイラストが大きく表示されるようにしたいのですが、調べても分かりませんでした。
  • どうすれば、上に書いたような事ができますか?タグ等を知っている方、教えていただければ幸いです。
回答を見る
  • ベストアンサー

イラストサイトを作っています!!

イラストサイトを作り始めました。 テンプレートはあるサイト様からお借りしました。 メモ帳で順調に編集をしていました。 ですが、イラストを展示するにあたって、 悩んだ箇所があります。 左のフレームからメニュー等を選択でき、 選択すると右の大きな画面に表示されるようになっています。 イラストのページでは、右の大きな画面にイラストは記号で選択をし、 その選択一覧の下に、選択したイラストが大きく表示されるようにしたいのですが、 調べても分かりませんでした。 『■』と連続で表示されているのがイラストの一覧です。 あるひとつの■をクリックすると、連続の■の下に大きく表示されるイメージです。 (今表示しているイラストのように、この場所に表示したいです。) ---------イラスト展示のページのタグです。↓↓--------- <html lang="ja" id="back"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <!-- designed by starlit * http://sky.starlit.biz/ 2011/f021 //--> <title></title> <link rel="stylesheet" href="style.css" type="text/css"> </head> <body> <div id="sub"> <!-- メインコンテンツ↓ --> <div id="contents"> <h2>GALLERY</h2> ☆…new<br> &#9825…腐向け<br> ■…普通の絵です <p class="title">イラスト</p> <p> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> <a href="pict.html" target="main">■</a> </p> <img src ="***.jpg"> </div> <!-- メインコンテンツここまで↑ --> </div> </body> </html> ---------…ここまでです。--------- どうすれば、上に書いたような事ができますか? タグ等を知っている方、教えていただければ幸いです。 分かりづらい質問で申し訳ありません!! ご回答よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

できれば使ったテンプレート配布サイトとテンプレート名を表記してくれたら答えやすかったと思うのですが。。。 画像のリンクタグがmainフレームでpict.htmlへ飛ぶ指定になっています。 右フレームも上下(たぶんmainフレーム)に分けたフレームにしたいのに肝心のmainフレームを作っていない、あるいは左の『ILLUST』リンクがフレーム管理htmlにリンクしていないことが原因だと思います。 フレームの作り方は以下のページを参考にどうぞ。 http://www.asahi-net.or.jp/~ax2s-kmtn/ref/html/hp7.html (難しいかもしれませんが。。。) 別の方法もありますけど、尚更混乱させそうなので。。。 ついでに■の下の画像URLが大変なことに・・・これ危ないですし、表示されていませんよ。 ・画像の名前は必ず英数小文字で。 ・できればサイトを作っているhtmlファイルと同じフォルダに入れて一緒に必ずアップロードすること。 ・画像URLは相対パスにしたほうが編集・管理が簡単になります。 ***.jpgをtop_zeus.jpgに名称変更したとして、illust.htmlと同じフォルダに入れた場合の相対パスは ./top_seuko.jpg となり、imgタグは <img src ="./top_zeus.jpg"> となります。 普通、画像はillust.htmlなどが入っているフォルダに新たに「img」フォルダをつくりその中に入れちゃいますが、その場合は <img src ="./img/top_zeus.jpg"> になります。 その場合もフォルダごとアップロードしてあげてください。 ↓参考にどうぞ http://www.dspt.net/bgn/003/005.html http://saru-html.pupu.jp/

makaronipengin
質問者

お礼

詳しくご回答いただきありがとうございました!! 早速直す所は直し、 調べる所は調べたいと思います!! ご回答ありがとうございました!!

その他の回答 (1)

  • susy-xx
  • ベストアンサー率69% (339/485)
回答No.2

pict.htmlはアップロードしてありますか? 或いはフォルダに入っているということはないですか? それと <img src ="***.jpg"> これですけど、あなた以外にイラストは見えません。 ご自分のパソコンの中身を指定しているので閲覧者から見ることは出来ません。 画像ファイルがアップロードされているかも確認してください。 http://ne2mythorogy.web.fc2.com/***.jpg 上記URLでは画像ファイルにアクセスできませんでした。 ファイル名はなるべく半角英数字でつけるようにしたほうがいいですよ。

makaronipengin
質問者

お礼

そうでしたか…!!! 画像をアップロードをしていませんでした!! まずはそこからですね(汗) ご回答ありがとうございました!!

関連するQ&A

  • FC2で画像とHPが表示されない!

    ホームページ作成初心者です。よろしくお願い致します。 ■手順■ (1)XHTML+CSSデザインテンプレートからDL URL→http://pondt.com/con_tpl/standard/ (2)DLサンプルをFC2にて編集 <HTML文> index.htmlというサンプルファイルをそのまま使用 <画像> 表示されている画像をアップロード ※解凍後、端からテンプレートフォルダ内の画像をアップロードしました。 ■エラー■ 画像が表示されず文字のみのページになってしまいます。 ■HTML文■ ====ここから================================================== <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="ja" xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>ホームページのタイトルを入れてください</title> <meta name="keywords" content="ホームページのキーワードを入れてください" /> <meta name="description" content="ホームページの紹介文を入れてください" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="content-style-type" content="text/css" /> <meta http-equiv="imagetoolbar" content="no" /> <link href="default.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="container"> <div id="head"> <h1>キーワードをいれてください</h1> <h2><a href="./">STANDARD 03(タイトルを入れてください)</a></h2> <div id="head_menu"> <ul> <li><a href="./">HOME</a></li> <li class="off" onmouseover="this.className='on'" onmouseout="this.className='off'"><a>コンテンツ</a> <ol class="sub"> <li><a href="contents01.html">ここのメニューは</a></li> <li><a href="contents01.html">コンテンツ01</a></li> </ol> </li> <li><a href="contents01.html">コンテンツ</a></li> </ul> </div> </div> <div id="contents"> <div id="top"> <p class="line"><img src="img/line01.gif" alt="ライン" width="796" height="3" /></p> <div id="main_image"> <p> 文章が入ります。<br /> TEL 00-000-0000<br /> 削除も可能です。 背景の画像は差し替え可能です。<br /> </p> </div> <p><img src="img/line01.gif" alt="ライン" width="796" height="3" /></p> <div id="top_btm"> <div id="left"> <h3><img src="img/top/st_info.gif" alt="インフォメーション" width="440" height="26" /></h3> <div id="info"> <div id="main"> <h4>2009/01/18</h4> <p>検索エンジン対策としてキーワードを入力できるようにしました。</p> <h4>2008/06/01</h4> <p>本テンプレート配布開始</p> </div> </div><!-- info 終わり --> </div><!-- left 終わり --> <div id="right"> <div id="bnr_sps"> <p class="bnr01"><a href="contents01.html">おすすめ!!(画像差し替え可能)</a></p> <p class="bnr02"><a href="contents01.html">コンテンツ01はこちら(画像差し替え可能)</a></p> </div><!-- bnr_sps 終わり --> </div><!-- right 終わり --> </div><!-- top_btm end --> </div><!-- top 終わり --> <div id="foot_up"></div> </div><!-- contents 終わり --> <div id="copy">Copyright (C) <script language="javascript">document.write(new Date().getFullYear())</script> サイト名を入れてください. All Rights Reserved. </div> </div> <!--↓著作権表示※削除しないでください↓--> <div id="p-copy"> <p><a href="http://pondt.com/" target="_blank">ホームページテンプレートのpondt</a></p> </div> </body> </html> ====ここまで================================================== テンプレート(サンプル表示)通り表示するには、自分でカスタマイズする必要があるのでしょうか??ローカルで開くぶんには表示されるのでHTML文的には合っていると思ったのですが・・・。 色々調べたのですが、解決しませんでした。 どなたか分かる方いらっしゃいましたらご助言していただけると助かります。よろしくお願い致します。

  • cssで作ったHP。左のメニューを選んだら右に表示したい。

    ホームページ作りの初心者です。左にあるメニューを選択したら、右のウィンドウ枠に表示されるようにしたいのですが、志向錯誤しても思うようになりません。 フレーム、という構造にしていれば、targetを使ってできるというのは分かったんですが、cssで作っています。これは別ものですよね? それも良く分からなくなっています。 私の下手な説明よりも見ていただく方がいいかと思いますので、例を載せさせてもらいます。やりたいことは、テスト1を押したら、test1.htmがcontents2に表示されるようにしたいのです。 ――――― <div id="wrapper">   <div id="header"></div>   <div id="inner">     <div id="contents1">       <a href="./test1.htm"> ●テスト</a><br><br>       <a href="./test2.htm"> ●テスト2</a><br><br>       <a href="./test3.htm"> ●テスト3</a><br>     </div>     <div id="contents2">        /*ここに表示したい*/     </div>   </div>   <div id="footer"></div>   </div> </div> ―――――――――――― よろしくお願いいたしますm(__)m

  • 以下の内容でhtmlを作成し、文字コードをutf-8からeuc-jpに

    以下の内容でhtmlを作成し、文字コードをutf-8からeuc-jpに変更したところ ヘッダー フッターが崩れてしまいます。ie6.0 ie7.0 にて(ie8.0 firefox3)では問題なく表示されます。 というか、cssが聞かないのです。 utf-8に戻すと直るのですが、なにか設定が必要なのでしょうか。 メールフォームcgiの関係でeuc-8にする必要があるのです。 よろしくお願いいたします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" /> <title>タイトル</title> <meta name="keywords" content="キーワード1,キーワード2,キーワード3" /> <meta name="description" content="テキスト。" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <link rel="stylesheet" href="css/import.css" type="text/css" /> </head> <body> <div id="bodybox"> <div id="container"> <!-- main --> <div id="main"> </div><!-- /main --> <div id="header"> <div class="head-box"> <h1>テキストテキストテキスト</h1> <p class="oooo"><a href="../"></p> <p class="top-inquiry"><a href="../inquiry/"><span>問合せ</span></a></p> <ul class="top-navi"> <li><a href="../">HOME</a></li> <li><a href="../cy/">テキスト</a></li> </ul> </div> </div><!-- /header --> </div><!-- /container --> </div><!-- /bodybox --> <div id="footer"> <div id="footer-in" class="clearfix"> <div class="fnavibox"> <ul class="fnavi clearfix"> <li><a href="../index.html">テキスト</a></li> <li class="last"><a href="../works/">テキスト</a></li> </ul> <ul class="fnavi clearfix"> <li><a href="/">HOME</a></li> </ul> </div> <!-- /fnavibox --> <div class="banerbox"> <p class="fbox"><img src="../common/images/img-tel1.jpg" alt="" /></p> <p class="fbox-r"><a href="../inquiry/"><img src="../common/images/btn-toi.jpg" alt="テキスト" /></a></p> </div><!-- /banerbox" --> </div> <!-- /footer-in --> <div id="footer-in2" class="clearfix"> <div class="addressbox"> <p class="name">テキスト</p></p> </div><!-- /addressbox --> <!-- /footer-in --> <div id="footer-in3"> <p class="copyright">

  • homepage manager編集方法

    homepage managerでテンプレートの編集をしました。 保存し、IEで見ると編集通りになっています。 無料ホームページスペースにUPしたところ、壁紙や画像がなくなっています。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja-JP"> <head> <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-script-Type" content="text/javascript"> <link rel="stylesheet" href="index.css" type="text/css" media="all"> <title>サイトタイトル。</title> </head> <BODY> <H1>サイトタイトル</H1> <DIV id=main> <DIV class=top><IMG alt=パーツ src="img/d.gif" width=1 height=1></DIV> <DIV id=inbox> <DIV class=box><!--mainの中の部分に本文を入れます。--> <H2>テンプレート#68へようこそ!</H2> <P>暑い夏シーズンに最適な、深い海を泳ぐイルカがモチーフの爽やかなテンプレートです。</P> <P>ホームページ作成ソフトやテキストエディタがあれば、簡単に書き換えられるようにシンプルに作ったデザインテンプレートです。知識のある方は、是非色々改造して使って下さい。</P> <P>また、テンプレートの素材だけを抜き出してブログのヘッダ等に使うのもアリだと思います。感性の赴くままに、ご自由に使っていただけると嬉しいです。<BR>貴方のホームページライフに、お役に立てる事を願っています。</P> <P>テンプレートの再配布はご遠慮下さい。<BR>ただし、ご自身で画像を差し替えた場合はその限りではありません。その場合、ソース内のこの素材屋へのリンクを残して下さい。<BR>※このテンプレートで金銭のやりとりをする事は原則禁止します。改造後の販売はご遠慮下さい。</P> <H2>このデザインについて。</H2><IMG style="MARGIN: 4px 14px 4px 6px; FLOAT: left" border=0 src="img/top.jpg" width=280 height=280> <P><BR>スタイルシートでレイアウトしたデザインです。左の画像はおまけですので、良かったら使って下さいね。</P> <P>改造は同一フォルダに「index.css」がありますのでそれを書き換えて下さい。<BR>画像は「img」フォルダに入っています。</P> <P>編集については<A href="http://hide.kanari.info/howtotemp.php" target=_blank>HTMLテンプレートの編集方法。</A>にて解説してます。<BR>基本的にサイト作成のご質問等のサポートはしてません。<A href="http://kanari.info/b/227.html" target=_blank>ホームページを持ちたい方へ。</A>の記事や、初心者をサポートするサイトで調べてみて下さいね。</P><!--ここまで本文。--></DIV></DIV> <DIV class=bottom><IMG alt=パーツ src="img/d.gif" width=1 height=1></DIV></DIV><!--ここはコンテンツの部分です。--> <DIV id=navi> <DIV id=navi_in> <DIV id=home>HOME</DIV> <DIV id=profile><A href="about.html">PROFILE</A></DIV> <DIV id=gallery><A href="gallery.html">GALLERY</A></DIV> <DIV id=bbs>BBS</DIV> <DIV id=diary><A href="diary.html">DIARY</A></DIV> <DIV id=link><A href="link.html">LINK</A></DIV></DIV></DIV><!--ここまでコンテンツの部分です。--> <DIV id=by>This template made by<BR><A href="http://hide.kanari.info/" target=_blank>素材屋</A></DIV> </BODY> </html> ↑これがダウンロードしたテンプレートのものです。 サイトタイトルと本文を書き換えました。 壁紙や画像をそのまま使いたいのですが、消えてしまします。 文字を書き換えただけなのですが、他に何をすればいいのかわかりません。 自分でも現在色々調べていますが、よくわかりません。 わかる方 いましたらよろしくお願いします。

  • CSS : IEとFirefoxの表示差異を改善したい

    grandswellと申します。 よろしくお願いいたします。 サンプルをIE、Firefoxそれぞれで見ていただけると わかっていただけると思うのですが、Firefox側が 意図した通りのレイアウトになっていません。 サンプルをIEで表示したレイアウトを Firefoxでも同じCSSで実現するにはどのような 工夫が必要でしょうか。 ぜひご教示くださいますよう、お願いいたします。 以下、サンプルのCSSとHTMLとなります。 *cssサンプル(style2.css) ---------- div.main { border-style : dashed; width : 100%; } div.main div.contents{ border-style : dashed; width : 75%; float : left; } div.contents div.contentsmain{ border-style : dashed; width : 100%; } div.contentsmain div.sidebar{ border-style : solid; float : left; width : 32%; } div.contentsmain div.entry{ border-style : solid; float : right; width : 66%; } div.main div.subspace { border-style : dashed; float : right; width : 23%; } div.footer { border-style : dashed; } ---------- *htmlサンプル ---------- <html> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" href="./style2.css" type="text/css"> </head> <body> <div class="main"> <p>main</p> <div class="contents"> <p>contents</p> <div class="contentsmain"> <p>contentsmain</p> <div class="sidebar"> <p>sidebar</p> </div> <div class="entry"> <p>entry</p> </div> </div> </div> <div class="subspace"> <p>subspace</p> </div> </div> <div class="footer"> <p>footer</p> </div> <body> </html> ----------

    • ベストアンサー
    • CSS
  • ホームページの作り方

    http://mezyu.chottu.net/ FrontPage ExpressとFFFTPを使っています。 テンプレートをかりてホームページをつくっているのですが、コンテンツ(右の)を増やそうとすると白いわくが消えてしまって About Diary Links Mailform Top と横書きに出てきてしまいます。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=x-sjis"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="GENERATOR" content="Microsoft FrontPage Express 2.0"> <title>*</title> <link rel="stylesheet" type="text/css" href="style.css"> <style type="text/css"> <!-- a:link,a:visited,a:active,a:hover{ color:#000; text-decoration:none; } body{ margin:0px; background-image:url(bg1.jpg); background-position:100% 0%; background-repeat:no-repeat; overflow:hidden; } .m1{ padding:5px 0px; width:100%; background-color:#fff; border-bottom:1px solid #000; filter:alpha(opacity=70); -moz-opacity:0.7; text-align:center; } --> </style> </head> <body> <p><a href="about.html" target="main">About</a> <a href="links.html" target="main">Links</a> <a href="mailform.html" target="main">Mailform</a> <a href="top.html" target="main">Top</a> </p> </body> </html> ↑ここにDiaryを増やしたくて<a href="diary.html" target="diary">Diary</a>と入れてみたのですが。。。 教えてもらえると助かります。

  • WEBサイト作成時ヘッダーで読込が反映されない部分

    ヘッダー部分について質問させていただきます。 一旦、サイトをDW(ドリームウィーバーCS6)やHPB(ホームページビルダー14)で読み込んで、デスクトップに保存後、確認すると、この部分は何故か表示されていませんでした。データとしても、その後は表示されなくなったようです。 この理由が分かりません。 <!-- #BeginLibraryItem "/Library/header.lbi" -->~<!-- #EndLibraryItem -->が原因だとは推測がつきます。詳しい方がいましたら、よろしくお願いします。 念の為に、下記にHTMLとCSSを出来る限り記載しておきます。 HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>タイトル</title> <meta name="Keywords" content="キーワード"> <meta name="Description" content="キーワード"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="base1.css"> <script type="text/javascript" src="util.js"></script> <script src="swfobject_modified.js" type="text/javascript"></script> </head> <body id="home"> <div id="topmess"><p><strong>ストロング</strong></p></div><!-- #BeginLibraryItem "/Library/header.lbi" --><div id="header"> <h1><a href="https://www.google.co.jp/">題名</a></h1> <ul> <li id="top"><a href="https://www.google.co.jp/">1</a></li> <li id="com"><a href="https://www.google.co.jp/">2</a></li> <li id="pro"><a href="https://www.google.co.jp/">3</a></li> <li id="con"><script type="text/javascript">mailwrite()</script></li> </ul> </div><!-- #EndLibraryItem --><div id="main" class="clearfix"> <table> <tbody> <tr> <td style="text-align:left;"><a href="http://www.10.jpg" target="_parent"><img src="side_coupon04.jpg" width="197" height="98" alt="4"></a></td> <td style="text-align:center;"><a href="http://www.20.jpg" target="_parent"><img src="side_coupon05.jpg" width="197" height="98" alt="5"></a></td> <td style="text-align:right;"><a href="http://www.30.jpg" target="_parent"><img src="side_coupon06.jpg" width="197" height="98" alt="6"></a></td> <td style="text-align:right;"><a href="http://www.40.html" target="_parent"><img src="side_coupon07.jpg" width="197" height="98" alt="7"></a></td> </tr> </tbody> </table> <br> <br> <img src="pro_img14.jpg" width="791" height="80" alt="TEL" class="btmgn20"> <p><font color="BLUE" size="10">TEL: 0123-456-789</font></p><br> <img src="pro_img11.jpg" width="791" height="150" alt="8" class="btmgn20"><br> <img src="pro_img9.jpg" width="791" height="367" alt="9" class="btmgn20"><br> <table> <tbody> <tr> <td style="text-align:left;"><a href="https://www.google.co.jp/" target="_parent"><img src="img12.jpg" width="395" height="120" alt="A"></a></td> <td style="text-align:right;"><a href="https://www.google.co.jp/" target="_parent"><img src="img13.jpg" width="395" height="120" alt="B"></a></td> </tr> </tbody> </table> </div> <!-- #BeginLibraryItem "/Library/footer.lbi" --><div id="footer"> <div id="ft"> <div class="leftarea"> <h3>見出し3</h3> <p>住所<br /> TIME 1:30~24:40<br /> ※<br /> TEL:0123-456-789<br /> FAX:0123-456-789 </p> </div> <div class="rightarea"> <ul> <li class="fst"><a href="https://www.google.co.jp/">8</a></li> <li><a href="https://www.google.co.jp/">9</a></li> <li><a href="https://www.google.co.jp/">10</a></li> <li><script type="text/javascript">mailwrite()</script></li> </ul> <address>コピーライト</address> </div> </div> </div><!-- #EndLibraryItem --> <script type="text/javascript"> <!-- swfobject.registerObject("FlashID"); //--> </script> </body> </html> CSS /* ------------------------------------------------------------------------------------------------------------ 1. Normalize (No need to edit) -------------------------------------------------------------------------------------------------------------*/ html, body, div, a, h1, h2, h3, h4, h5, h6, p, blockquote, pre,img, ol, ul, li, dl, dt, dd, span, abbr, acronym, address, cite, code, del, dfn, em, ins, kbd, q, samp, strong, sub, sup, var, form, fieldset, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, applet

  • フッターを固定したい…

    上の写真のようにDivを組んでいるのですが、 Div4のフッタをブラウザに固定して表示したいのですが、どうすればよろしいのでしょうか? Div4はCSSでbackground-imageとして画像(jpg)が指定されています。 ●html <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css"> <title>test</title> <link rel="stylesheet" href="design.css" type="text/css"> <style type="text/css"> </style> </head> <body> <div id="body"> <div id="main"> <div id="div1"> <p class="clip"> <img src="clip.jpg"alt="New clip!"> </p> <p class="b-design"> <a href="design.html"> <img src="b-design.jpg"> </a> </p> <p class="b-photo"> <a href="photo.html"> <img src="b-photo.jpg"> </a> </p> <p class="b-mail"> <a href="mailto:a@com"> <img src="b-mail.jpg"> </a> </p> </div> <div id="div2"> </div> <div id="div3"> </div> </div> <div id="div4"> </div> </div> </body> </html> ●CSS * {margin:0; padding:0} body {background-color:black; width:100%;} img {border-style:none} #body {position:relative; margin: 0 auto; width:800px} #main {} #div1 {float:left; width:330px; height:370px; background-image:url("div1.jpg")} #div2 {float:left; width:470px; height:370px; background-image:url("div2.jpg")} #div3 {float:clear; width:800px; height:800px; background-image:url("div3.jpg")} #div4 {float:clear; width:800px; height:210px; background-image:url("div4.jpg")} .clip {position:absolute; top:30px; left:20px} .b-design {position:absolute; top:290px; left:30px} .b-photo {position:absolute; top:320px; left:30px} .b-mail {position:absolute; top:350px; left:30px}

    • ベストアンサー
    • HTML
  • HTML、CSS

    FC2(無料サーバー)でホームページを作っているのですが、FC2の広告(Powered by…という下に一行だけ出るもの)が私のホームページに表示されなくて困っています。テンプレートを借りて作成したページで、テンプレートのカスタマイズはしていません。広告が表示されないと規約違反になってしまうので、表示させたいのです。何が原因でしょうか? <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <meta http-equiv="content-style-type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link rel="stylesheet" href="st.css" type="text/css"> <title>タイトル</title> </head> <body id="TOP"> <!-- ページ全体  --> <div id="page"> <!-- ヘッダー --> <div id="head"> <h1><a href="index.html">Your Sitename</a></h1> </div> <!-- メニュー --> <div id="menu"> <ul> <li><a href="sample.html">SAMPLE</a> <li><a href="link.html">LINK</a> <li class="on"><a href="text_menu.html">TEXT</a> <li><a href="index.html">INDEX</a> </ul> </div> <!-- コンテンツ --> <div id="contents"> <h2>MENU</h2> <div class="text"> <h3>SHORT STORY</h3> <ul class="sub01"> <li><a href="text.html">STORY01</a> </ul> </div> <div class="text"> <h3>LONG STORY</h3> <h4>TITLE01</h4> <ul class="sub02"> <li><a href="text.html">1</a> <li><a href="text.html">2</a> </ul> </div> <div class="text"> <h4>ILLUST01</h4> <ul class="sub02"> <li><a href="img.html"><img src="img/banner01.gif" width="31" height="31" alt="画像名"></a> <li><a href="img.html"><img src="img/banner01.gif" width="31" height="31" alt="画像名"></a> </ul> </div> <div class="pagetop"><a href="#TOP">▲Top</a></div> </div> <!-- フッター --> <div id="foot"> <ul> <li> </ul> </div> </div> </body> </html>

    • ベストアンサー
    • HTML
  • IE8でCSSハックが効かないです。

    IE8でCSSハックが効かないです。 IE8のCSSハックを使用したくて、下記のように指定したのですが、 IE8で見るとIE8用に記述したCSSハックが効かないです。 ちなみにIE6用のハックとデフォルトで指定したクラスはきちんと表示されます。 記述方法が原因なのでしょうか。それとも他に原因があるのでしょうか。 教えて欲しいです。 ■サンプルソース <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="imagetoolbar" content="no"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta name="keywords" content="キーワード1,キーワード2"> <meta name="description" content="ディスプリクション"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> #main_contents p.test_style { font-weight: bold; color: #000; } /* IE6対策 */ *html #main_contents p.test_style { font-weight: bold; color: #ff0000; } /* IE8対策 */ html>/**/body #main_contents p.test_style { font-weight /*\**/: bold\9; color: #0033ff\9; } </style> <title>IE8表示テスト</title> </head> <body> <div id="main_contents" class="reset"> <p class="test_style">デフォルトのテキスト 黒で表示されます。</p> <p class="test_style">IE6用(css hack)のテキスト IE6で見ると赤で表示されます。</p> <p class="test_style">IE8用(css hack)のテキスト IE8で見ると青で表示されます。</p> <!--/main_contents--></div> </body> </html>