• 締切済み

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> ↑これがダウンロードしたテンプレートのものです。 サイトタイトルと本文を書き換えました。 壁紙や画像をそのまま使いたいのですが、消えてしまします。 文字を書き換えただけなのですが、他に何をすればいいのかわかりません。 自分でも現在色々調べていますが、よくわかりません。 わかる方 いましたらよろしくお願いします。

みんなの回答

  • naokita
  • ベストアンサー率57% (1008/1745)
回答No.1

編集したテンプレート.htmlファイルだけアップロードしたのはわかるが、 index.css と 画像  何処に仕舞ったの? 切り離しちゃダメ・・・ 一緒にしてあげましょうね。

関連するQ&A

  • ホームページの位置が、、

    教えていただきたいです。現在ホームページを作成中なのですが、、、 http://homepage.decoweb.jp/template/view/H200051 のテンプレートを使っていますが、、インターネットエクスプローラで表示すると、右に寄ってしまい、真ん中に位置がきません。 ちょうど真ん中にくるようにすればどのようにすればよいか教えてもらえないでしょうか? 参考までにソースを記載しておきます。よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 12.0.4.0 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <title>decoウェブ</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="wrapper"> <div id="header"> <!-- ▼ここからサイト名 --> <h1><FONT size="+3" style="font-size : 200%;"><a href="index.html"><U><I>fate type A</I></U><BR> </a></FONT></h1> <!-- ▲ここまでサイト名 --> </div> <div id="main" class="clearfix"> <div id="side"> <div id="photo"> <!-- ▼ここからメニュー上部画像 --> <img src="images/photo.jpg" /> <!-- ▲ここまでメニュー上部画像 --> </div> <div id="menu"> <ul> <!-- ▼ここからメニュー --> <li><a href="index.html">top</a></li> <li><a href="sub.html">profile</a></li> <li><a href="sub.html">gallaly</a></li> <li><a href="sub.html">links</a></li> <li><a href="sub.html">bbs</a></li> <!-- ▲ここまでメニュー --> </ul> </div> </div> <div id="contents"> <div id="news"> <div>NEWS</div> <!-- ▼ここからニュース -->2008 1 30</div> <BR> <h2>2008 1 30</h2> <!-- ▲ここまで見出し --> <!-- ▼ここから本文 --> <p>今日から総合エンターテイメントな(というかゲームとか、アニメとか)なページを目指して発信いたします。ページは簡素に、深く情報発信的なページを目指していきたいと思います!</p> <br /> <!-- ▲ここまで本文 --> </div> </div> <div id="footer" class="clearfix"> <div id="copyright">copyright&copy;&nbsp;2008 fate type A &nbsp;All&nbsp;Rights&nbsp;Reserved.</div> <div id="deco_banner"><a href="http://homepage.decoweb.jp/" target="_blank" title="無料テンプレートのdecoweb - ホームページデザインのテンプレート"><img src="images/decoweb.gif" alt="無料テンプレートのdecoweb - ホームページデザインのテンプレート" title="無料テンプレートのdecoweb - ホームページデザインのテンプレート" /></a></div> </div><!-- [FC2 Analyzer] http://analyzer.fc2.com/ --> <script language="javascript" src="http://analyzer52.fc2.com/ana/processor.php?uid=434228" type="text/javascript"></script> <noscript><div align="right"><img src="http://analyzer52.fc2.com/ana/icon.php?uid=434228&ref=&href=&wid=0&hei=0&&col=0" /><a href="http://bbs.fc2.com/">掲示板</a></div></noscript> <!-- [FC2 Analyzer] --> </div> </body> </html>

  • 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文的には合っていると思ったのですが・・・。 色々調べたのですが、解決しませんでした。 どなたか分かる方いらっしゃいましたらご助言していただけると助かります。よろしくお願い致します。

  • ホームページの作り方

    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>と入れてみたのですが。。。 教えてもらえると助かります。

  • スマートフォンで見れるようにするには?

    ホームページを作ってるのですがスマートフォンで見ると真っ白になってしまいます。何が原因なのかさっぱり分りません。 分る方教えて貰えたら幸いです。 今、サーバー側がメンテナンスしてるのでここにタグ書きます。 訂正箇所ありましたら教えてくださいm(__)mお願いします。 ホームページも見ることは可能なんですがHTMLが少し違うのでこのHTMLで質問します。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <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"> <title>bit-home</title> <link href="style1.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript">google.load('jquery','1');</script> <script type="text/javascript"> $().ready ( function() { $('#information').load ( 'information.html' ); $('#information2').load ( 'information2.html' ); }); </script> </head> <body> <div id="flame"> <!--ヘッダ--> <div id="head"> <h1><a href="http://www.bit-home.jp/">bit-home</a></h1> </div> <!--ヘッダ終わり--> <!--右のブロック--> <div id="right"> <div class="main"> 広告:劇場版イナズマイレブンGo 究極の絆グリフォン <a href="http://www.inazuma-movie.jp/"><img src="http://bit-home.jp/img/top/top.jpg"></a><br> <br> <h2>bit-homeの内容</h2> <p>僕なりに頑張って作ってみました。<br> ゆっくり見ていってください。<br> </p> </div> <div class="main"> <h2>更新履歴</h2> <p> 2012/04/26 集会撮影→<a href="http://www.bit-home.jp/syukai/img/001.jpg">001.jpg</a><br> 2012/06/11 BBSを報告掲示板として使うことにしました。<br> 2012/06/10 ゲーム日記を更新しました<br> 2012/05/28 プロフィールを更新しました<br> 2012/04/21 LINKを更新しました<br> </p> <br> </div> </div> <!--右のブロック終わり--> <!--左のブロック--> <div id="left"> <div class="leftmain"> <div class="pic"> <div id="information"></div> <br> </div> </div> <div class="leftmain"> <ul> <li><a href="profile.htm">PROFILE</a></li> <li><a href="blog.htm">BLOG</a></li> <li><a href="link.htm">LINK</a></li> <li><a href="http://bit-home.bbs.fc2.com/">BBS</a></li> <li><a href="http://www.bit-home.jp/game_diary/index.html">ゲーム日記</a></li> </ul> </div> </div> <!--左のブロック終わり--> <!--フッタ--> <div id="foot"> <div id="information2"></div> </div> <!--フッタ終わり--> </div> </div> </body> </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
  • ホームページ作成中。画像の表示

    初めてホームページを作成している者です。 Webサイトから商用のホームページのテンプレートをダウンロードして、HTMLとCSSで作成している途中です。(IEで確認。) 画像をテンプレートのものから自作の画像に切り替えようとしたのですが、表示されません。 画像はテンプレートの画像と同じディレクトリに入っているし、相対パスや拡張子は間違ってはないと思います。 元の画像はGIFの2.54KBで大きさは290×65です。 切り替える画像はGIFの4.67KBで大きさは290×65です。 HTML文は↓になっています。 <!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" /> <link rel="stylesheet" href="base.css" type="text/css" /> <title>あなたのサイト名などお書きください</title> </head> <body> ・ ・(省略) ・ <div id="header"><h1><a href="index.html"><img src="images/logo.gif" alt="" /></a></h1></div > CSS文で関係ありそうなのは↓です。 <冒頭の関係ありそうな部分> @charset "Shift_JIS"; body { margin:0; padding:0; line-height:1.6; letter-spacing:1px; } a { color:#98534B; text-decoration:none; } a:hover { text-decoration:underline; } img { border:0; vertical-align:bottom; } <この画像の部分> div#header h1 { margin:0; padding:10px 0; font-size:2em; color:#333; } div#header h1 a { color:#9B0000; } div#header h1 a:hover { color:#D30000; text-decoration:none; } 何が表示されない原因となっているのでしょうか?

    • ベストアンサー
    • HTML
  • フッターを固定したい…

    上の写真のように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
  • コンテンツとコンテンツの詰まり

    Windows XP あるいは8 HTML 4.01 コピー ~ TOP.html copyTOP.css あああああ と  いいいいいの間隔はあいているのに いいいいい と  うううううの間隔はなぜか詰ってしまっています。 間隔を空けるにはどうしたらいいでしょうか? コードは以下の通りです。 [ HTML 側 ] <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/Transitional.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" Content="text/html;charset=Shift_JIS"> <META HTTP-EQUIV="CONTENT-STYLE-TYPE" CONTENT="~"> <title>aaaaaaaaaa</title> <link rel="stylesheet" href="copyTOP.css" type="text/css"> </head> <body> <div id="zentai"> <div id="part"> <p class="title">あああああ</p> <div id="partnerwaku"> <div id="partnerimage"> <a href="" alt="のロゴ" class=""></a> <a href="" alt="のロゴ" class=""></a> <a href=""><img src=".gif" alt="のロゴ" class=""></a> <a href=""><img src=".jpg" alt="のロゴ" class="A"></a> <a href=""><img src=".jpg" alt="のロゴ" class=""></a> </div> </div> </div> <div id="PR"> &lt;PR&gt; <br> <div id="PRsection"> <br> <a href=""> <img src="" alt="" class="PRimage01"></a> </div> </div> <div id="PR2"> <br> &lt;PR&gt; <br> <div id="PRsection2"> <br> <a href=""> <img src="" alt="" class="PRimage02"></a> </div> </div> <div id="columnwaku"> <div id="columnbun"> <p class="title">いいいいい</p> <div id="columncontents"> <p><a href=""><img src =".jpg" class="columnarticle01"></a></p> </div> </div> </div> <br> <br> <br> <br> <div id="PR3"> <br> &lt;PR&gt; <br> <div id="PRsection3"> <br> <a href=""><img src="" alt="" class="PRimage03"></a> </div> </div> <br> <br> <br> <br> <br> <div id="questionnairesection"> <div id="questionnaire"> <p class="title">ううううう</p> <div id="questionnairecontents">えええええ</div> </div> </div> <div id="PR4"> <br> &lt;ddd&gt; <br> <div id="PRsection4"> <br> <a href=""> <img src="" alt="" class="PRimage04"></a> </div> </div> <div id="pagetop"> <br> <br> <a href="#logoimage">ページの先頭へ▲</a> </div> <hr class="beforefooter"> <div id="aboutus"> <div id="aboutussection"> <p class="aboutustitle">管理会社</p> <p><a href="Aboutus.html"><img src ="Aboutus.jpg" class="aboutusimage"></a></p> </div> </div> <br> <br> <hr class="beforefooter"> </div> <!--全体のdiv--> </body> </html> [ css側] @charset "Shift_Jis"; body { overflow-y:auto overflow-x:auto text-align:center; cursor:url("images/.png"); } #allitem{ cursor:url("images/.png"); } #zentai{ width:1000px; margin-left:auto; margin-right:auto; } .title{ margin-top:0px; margin-bottom:0px; font-size : 20px; border-style:solid; width:592px; background-color:#FFFF99; padding:3px; } #part{ clear:left; float:left; height:180px; width:642px; padding-right:147px; font-size : 20px; } #partnerwaku{ height:140px; width:600px; border-style:solid; border-color: #000099; } #PR{ float:left; width:180px; height:120px; } #PRsection{ border-style:solid; border-color: #000099; } #PR2{ float:left; width:185px; height:150px; } #PRsection2{ border-style:solid; border-color: #000099; } .PRimage01{ width:170px; height:80px; } .PRimage02{ width:165px; height:100px; } #kuhaku{ clear:left; height:20px; } #columnwaku{ float:left; clear:left; height:130px; width:790px; } #columnbun{ height:120px; width:600px; } #columncontents{ height:140px; width:600px; border-style:solid; border-color: #000099; } .columnarticle01{ height:70px; width:400px; background-color:#CC99CC; } #PR3{ float:left; width:185px; height:150px; } #PRsection3{ border-style:solid; border-color: #000099; } .PRimage03{ width:165px; height:100px; } #questionnairesection{ clear:left; float:left; height:130px; width:1050px; } #questionnaire{ width:600px; border-radius: 20px; } #questionnairecontents{ height:140px; width:600px; border-style:solid; border-color: #000099; } #PR4{ float:left; width:185px; height:150px; } #PRsection4{ border-style:solid; border-color: #000099; } .PRimage04{ width:165px; height:100px; } 文字制限のため省略

    • ベストアンサー
    • HTML
  • ホームページビルダー15 メニュー作成について

    いつもお世話になっております。 以下のような、どなたかのご回答をもとに、ホームページビルダー15で同じような折りたたみ式のメニューを作成したいと考えおります。 参考にしたいメニューはこちらです↓ http://okwave.xrea.jp/jquery/test6797636/e.html ですが、自分の作ろうとしているメニューはCSSプロフェッショナルテンプレートの「企業」から作ったものであり、なかなかうまくいきません。 以下、自分の記述を記載いたしますが、以下のようにしたいと思います。 通常は、 メニューA メニューB メニューC というように、なっており、メニューBをクリックしたときにだけ メニューA メニューB   B-1   B-2   B-3 メニューC と、サブメニューが表れ、メニューBをクリックするまでサブメニューも表示されたままにしておきたいと思います。(もちろん、メニューA~Cも、どのページでも表示されるようにする) どこに、どのように記述を入れれば、ボタンのデザインなども崩さず、思い通りのメニューになるのか、ご教示いただければと思います。 どうぞよろしくお願いいたします。 *********自分の記述(ヘッダー情報も含まれていますが無視してください)*********** <!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"> <meta name="GENERATOR" content="JustSystems Homepage Builder Version 15.0.8.0 for Windows"> <title>TOP</title> <link rel="stylesheet" href="hpbparts.css" type="text/css" id="hpbparts"> <link rel="stylesheet" href="container_1A_2c_left.css" type="text/css" id="hpbcontainer"> <link rel="stylesheet" href="main_1A_2c.css" type="text/css" id="hpbmain"> <link rel="stylesheet" href="user.css" type="text/css" id="hpbuser"> </head> <body id="hpb-template-01-01-02" class="hpb-layoutset-02" bgcolor="#ffffff" background="blue_p7b.gif"> <div style="top : 2px;left : 100px; position : absolute; z-index : 1; visibility : visible; " id="Layer1"> <div id="hpb-container"> <!-- header --><br> <!-- header end --><!-- inner --> <div id="hpb-inner"> <!-- wrapper --> <div id="hpb-wrapper"><!-- main end --> </div> <!-- wrapper end --><!-- navi --> <div id="hpb-nav"> <h3 class="hpb-c-index"></h3> <ul> <li id="nav-toppage"><a href="a.html"><span class="ja">メニューA</span><span class="en">TOP&nbsp;PAGE</span></a> <li id="nav-concept"><a href="b.html"><span class="ja">メニューB</span><span class="en">CONCEPT</span></a> <li id="nav-service"><a href="c.html"><span class="ja">メニューC</span><span class="en">SERVICE&amp;PRODUCTS</span></a> </ul> </div> </div> </div> </div> </body> </html>

  • ホームページ製作中ですが3カラムの体裁崩れに付いて

    3カラムのホームページで画像を挿入して、img { float: left; }を使いテキストの回りこみをすると全体の体裁が崩れます。なにぶん初心者なので、解りやすくお願いします。 SCCは @charset "shift_jis"; body { background-image: url(gif/kabe.gif); margin-top: 25ot; margin-left: 50pt; font-family: Osaka, "ヒラノギ角ゴ Pro W3","小塚ゴシック Std B","MS P ゴシック",; } h1 { font-size: 32pt; color: #006600; text-align: center; } h2 { font-size: 24pt; color: #ff3300; text-align: center; } p { color: #0000cc; } img { float: left; } p.kesu { clear: both; } div.box_a { width: 700px; margin-left: auto; margin-right: auto; } div.box_b1 { width: 10%; height: 480px; float: left; } div.box_b { width: 70%; height: 480px; overflow: auto; float: left; } div.box_b2 { width : 20%; height: 480px; float: left; } div.box_c { width: 100%; text-align: center; clear: both; } これです。 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 xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>ガラスの世界</title> <link rel="stylesheet" href="style1.css" type="text/css" /> </head> <body> <div class="box_a">   <img src="gif/tatoru.gif"> </div> <hr /> <div class="box_b1"> <a href="#saisiyo">最初</a><br /> <a href="#kansei">完成</a> </div> <div class="box_b"> <h1>ガラス細工製作です</h1><br /> <h2>簡単な物から</h2> <img src="siyasin/hajimenoitupo.jpg" width="250" height="250" /> <p><a id="saisiyo">熱帯魚は簡単なので、まずガラス玉を作ります。</a></p><p class="kesu"></p> <img src="siyasin/moyoumae.jpg" width="250" height="250" /> <p>黄色のガラスを縦に4本付けます。</p><p class="kesu"></p> <img src="siyasin/yojiru.jpg" width="250" height="250" /> <p>ねじるとこうなります。</p><p class="kesu"></p> <img src="siyasin/tubusu.jpg" width="250" height="250" /> <p>それを潰すとこうなります。</p><p class="kesu"></p> <img src="siyasin/ohire.jpg" width="250" height="250" /> <p>尾ひれを付けます。</p><p class="kesu"></p> <img src="siyasin/sebire.jpg" width="250" height="250" /> <p>背びれを付けます。</p><p class="kesu"></p> <img src="siyasin/kanseitemae1.jpg" width="250" height="250" /> <p>ムナビレを付けます。</p><p class="kesu"></p> <img src="siyasin/kansei1.jpg" width="250" height="250" /> <p>前のガラスを溶かし取って、目を付けて完成です。</p><p class="kesu"></p> <img src="siyasin/netutaigiyo.jpg" width="300" height="250" /> <p><a id="kansei">熱帯魚完成</a></p> </div> <div class="box_b2"> <a href="index.html">TOPページへ戻る</a><br /> <a href="kougu.html">工具</a><br /> <a href="sagiyou.html">作業</a><br /> </div> <div class="box_c"><hr /> (c) 2011 ガラスの世界</div> </body> </html> これです。 img { vertical-align: bottom; }は使えない文法のようです。 宜しくお願いします。

    • ベストアンサー
    • CSS