- 締切済み
2カラムのHPを作っているのですがリンク先の指定が出来ず困っています。
2カラムの左側がメニューで、右側がコンテンツ表示といった形をとりたいのですがうまくいきません・・。 ↓の様な形 ------- メ| コ | ニ| ン | ュ| テ | -| ン | | ツ | ------- <div>で囲っているのですが<div>全体に対してリンクを飛ばすといったことは出来ないのでしょうか? 右側でテーブルを作って<name><target>を作っても同じ<div>内にないからかこちらもうまくいきません。 どなたか方法がありましたら教えてください、お願いします。
- みんなの回答 (5)
- 専門家の回答
みんなの回答
普通WEBページではメニューは、ぺーじ毎にありますよ。 index.html aaa.html bbb.htmlとあるならそれぞれにメニュー部分があるのです。同じものをコピペで全ページに配置すればいいです。もちろんリンクの内容も同じでいいです。(frameを使うと検索エンジンがクロールしませんよ。^^) <div id="wrapper"> <div id="header">ヘッダー部</div> <div id="menu"><!--メニュー部は共通--> <ul> <a href="index.html"><li>HOME</li> <a href="aaa.html"><li>AAA</li> <a href="bbb.html"><li>BBB</li> </ul> </div> <div id="contents"> コンテンツ部 </div> <ul id="footer-menu">フッターメニュー部</ul> <p id="footer">コピーライト部</p> </div><!--wrapperの終わり--> CSSでIDとCLASSを定義する。
- bapstash
- ベストアンサー率26% (55/208)
ようするに、左側のメニューは全ページに同じ表示をさせたいけど 1ページごとにメニュー部分のタグを入れるのではなくて、 メニューだけを1つのファイルとして(更新するときに簡単にできるように)、 全ページに読み込ませたい。・・・ということですよね?? 私もあまりよく分かっていないので参考にならないかもしれませんが、 きっと上記のようなことをやりたいのであれば 無料のレンタルサーバーだと不可能だと思います。 PHPやSSIなどが使えるようなサーバーなら可能だと思いますが、 PHPはHTMLとは全く違う構造なので、また違った勉強が必要となります。 では他の方法で上記のような、「メニューを1つのファイルとして 全ページに読み込ませる」ことはできないのかというと、 ちょっと邪道なのかもしれませんが、このようなこともできます。 ≪iframeを使います≫ 1.左側のメニュー部分だけを1つのhtmlファイルとしてつくります。 2.コンテンツのページを作る際に、メニューを設置したい左側に メニュー全体の縦の長さが十分入る大きさのインラインフレーム(iframe)を スクロールバー無しで設置します。 3.その iframe にメニューのHTMLファイルを表示させます。 (メニューファイルのリンクはすべて target="_top" を入れる) これで、なんとなく上記のような事はできるとは思います。
- koke29
- ベストアンサー率58% (114/196)
擬似フレームを使いたいのかな?と思いました 試しに検索して出てきたサイトのURLをつけておきますね 配布サンプルというリンクが下の方にあるので、どういう動作を するものか見て、目的にあうようなら作り方をよく読みながら 作ってみるか、サンプルをDLして好きなようにカスタマイズしてみては。 私は擬似フレームは使わないので、これ以上のアドバイスは出来ません
- salonpath
- ベストアンサー率48% (194/399)
>左メニューでクリックしたリンク先を右コンテンツに反映させる感じです。 >イメージとしてはブログのような感じ ん~?読解力がなくてすみません。。。 1行目と2行目は作りが別モノな感じがします。 1行目のタイプのものは(右コンテンツに反映させるというのは) イラスト関係のサイトや相当古いタイプのサイトによくある フレームを使ったサイトですよね? 2行目のブログタイプは、フレームを使わないです それぞれのページにメニューとヘッダー、フッターがあって ページ毎のコンテンツを読み込んでそれぞれのページにhtmlがあります。 それとnaknoさんが例にあげてる nameは最初に書いたアンカーリンクをさせる方法だし targetはフレーム間のリンクに使うもので divはたんにブロック要素です。 nameとtargetは通常のリンクで使う事はないですけど、どこで覚えてきたんですか? 今現在作成したページ構成を教えてください それにあわせたリンクの仕方を書きます。
- salonpath
- ベストアンサー率48% (194/399)
同じページ内に飛ぶリンクを貼りたいんでしょうか? そうだとしたらアンカーリンクってのを使います http://www.tagindex.com/html_tag/link/a_name.html たとえば、同一ページ内のコンテンツのdivに飛ばしたいなら divにname="contents1"とidを追加 (例:<div name="contents1" id="contents1">内容</div>) すでにdivにidが振ってあるなら、それを使う。 メニュー側にはa href="#contents1"とします (例:<a href="#contents1">コンテンツ1へ</a>) divのnameやidの頭に#をつけただけです(すでにdivにidが振ってあったならそれに#を付けてリンクにする)。
補足
回答ありがとうございます。 同じページ内に飛ぶのではなく、 左メニューでクリックしたリンク先を右コンテンツに反映させる感じです。 イメージとしてはブログのような感じといえば伝わるでしょうか?