リンクの飛ばし方とその位置について
- 一枚の縦に長いウェブサイトを作っていて、アンカータグを使って同じページ内のリンクを作りたいです。しかし、ページのトップに固定されたメニューがあり、リンク先の位置をトップから200px下にしたいです。
- ウェブサイトを作っていて、アンカータグを使って同じページ内のリンクを設定したいです。しかし、固定されたメニューがあるため、リンク先の位置をトップから200px下にしたいです。
- ウェブサイトの作成中において、同じページ内のリンクを設定したいのですが、上部に固定されたメニューがあるため、リンク先の位置をトップから200px下にしたいです。
- ベストアンサー
リンクの飛ばし方とその位置について
リンクの飛ばし方とその位置について 似たような質問を見つけましたが、分からなかったので質問します。 一枚の縦に長いウェブサイトを作っています。 アンカータグをつけて同じページ内のリンク先に到達するようにしたいのですが、、 ページのトップにメニューを固定しているので、ページの先頭ではなく トップから200pxの位置をに持ってきたいのですが どうしたらよいでしょうか。 メニューには5項目で、下に文章や画像等が5項目ならんでいます。 たとえば2項目目にメニューからリンクした際に、上や下の項目が見えていてかまいません。 ウェブ作成初心者です。 分かりやすく教えていただけると助かりますm(__)m
- 41500
- お礼率87% (130/149)
- HTML
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
fixedでメニューを固定されているということでしょうか？ であれば、それぞれの記事に関して、padding-topで余白を取りましょう。 paddingはボックス内の余白なので、marginと違って余白を含めた位置にページ移動ができるようになります。 <html> <head> <style type="text/css"> .article{ padding-top:200px; } </style> </head> <body> <div id="Hoge1" class="article"> <p>記事1の内容</p> </div> <div id="Hoge2" class="article"> <p>記事2の内容</p> </div> <a href="#Hoge1">記事1へ</a> <a href="#Hoge2">記事2へ</a> </body> </html>
その他の回答 (1)
- rurino
- ベストアンサー率55% (38/68)
HTMLタグだけだとpx指定は難しいですね。 （タグ以外で方法があるのかもしれませんがJavaScriptなどは詳しくないので 完全にないとは自分は断言できません） この場合通常ですと この行から見せたい というところに id="hogehoge" を入れます。 （hogehoge には半角アルファベットで始まる好きな名前（半角英数字）を入れてください。） リンクには <a href="#hogehoge"> と書きます。 （a name="hogehoge"でもOKですが おそらくアンカーリンクのname属性は近いうちに非推奨になると思われますので idのほうがいいとおもいます）
お礼
ありがとうございます！ a nameは非推奨になるんですね。Dreamweaverのリンクは あたりまえのようにa nameになっていました。 ソフトまかせではいけませんね！
関連するQ&A
- トップに最初に表示されるエリアの位置について。
トップに最初に表示されるエリアの位置について。 一枚の縦に長いウェブサイトを作っています。 メニューは5項目でトップに固定してあり、 下に文章や画像等が5項目ならんでいます。 サイトに初めに来た時に、1項目目でなく4項目目が見えるように したいのです。 また、もし素人レベルで可能であれば、 メニューを選んだ際に、ユーザーが同じページのスクロールだと 分かるようにゆっくりと上下するにしたいです。 ウェブ作成初心者です。 分かりやすく教えていただけると助かりますm(__)m
- ベストアンサー
- HTML
- あるページのあらかじめ定めた位置へリンクさせたい
色々なホームページを見ていると、同じページ内の定められた位置へリンクされている場合が見られます。 例えば、ページの一番下にある「先頭へもどる」ボタンのようなイメージです。「先頭へもどる」ボタンではページの先頭へ戻りますが、ページの真ん中にリンクさせたい場合や微妙な位置にリンクさせる場合どのように記述すればよいでしょうか？ 以前、pxで調整できると聞いたことがあるのですが具体的な記述方法が分かりません。よろしくお願いします。
- ベストアンサー
- CSS
- リンク先から元の位置に戻る方法教えて！
例えば、サイトのトップページがあり、そこにはリンクが三箇所張られて います。ページは縦に長く上段に１リンクがあり、中段に１リンクが あり、下段に１リンクがあります。上段、中段、下段の位置はスクロールさせなければ ならない程縦長のページです。 その場合で、例えば、トップページ下段のリンクからリンク先に移動したとします。 その後、そのリンク先から再度、画面左上の「戻る」ボタン、若しくは <INPUT type="button" value="前面に戻る" onclick="pageBack()">のボタン を押して、トップページに戻った場合なんですが、どうしてもトップページ の上段に戻ります。 最初リンクした、下段の元の位置に戻る方法は無いのでしょうか？ 詳しい方、居られましたら宜しくお願いします。
- ベストアンサー
- その他([技術者向] コンピューター)
- BIGLOBEのホームページのリンクの一部が左クリックで開かない
BIGLOBEのホームページのTOPページ、上から少し下に 縦に書いた「知って得する」という項目があります。その中に、５つのリンクがあります。 そのリンクが左クリックで開かないのですが、 これは、私のパソコンだけのどこかの設定がおかしいなのでしょうか？ それともこれは、いわゆるHPのバグというものなのでしょうか？ 右クリックのメニューの、「新しいウィンドウで開く」では開けるのですが… http://www.biglobe.ne.jp/ 試していただいた方のご報告をお待ちしています。
- 締切済み
- ブラウザ
- リンクをクリック出来ない。
http://www.1sshindo.com/ このページを作ったのですが、topページで その他のページというリンクにカーソルを合わせても 指のマークが出ません。 （MACでですが。 windowsを持っていません。） なぜでしょうか。 この要素をtable_top7と指定して cssで.table_top7 { border: thin solid #FF6600; position: absolute; width: 70px; top: 1705px; left: 70px; margin: 1px; } となっていますが、 要素を下に移動させたかったので top:1615px; から top: 1705px; としたらこのようになってしまいました。 1680pxぐらいまでならリンクが出るようです。 なぜでしょうか。 他の要素が影響しているんでしょうか。 初歩的すぎて 怒られそうですが。 お願い致します。
- ベストアンサー
- HTML
- リンク文字を好きな位置に表示したい
お忙しいところすいません。 ホームページ（トップページ）上において、リンク文字を好きな位置に表示したいのですがどのようにしたらうまく表示できますか？。 現在、以下のように記述していますが、これだと改行して表示するだけなので、ランダム配置させたいと思っています。 これは可能でしょうか？。 また、そのようなサンプルサイトがあれば教えていただきますでしょうか？。 よろしくお願いいたします。 ＜html記述＞ <div id="menu"> <a href="test1.html" title="トップ" class="moji1">トップ</a> <a href="test2.html" title="テスト" class="moji2">テスト</a> </div> ＜css記述＞ .moji1{ margin : 100px 10px 50px 60px; font-family : Arial,'ＭＳ Ｐゴシック',sans-serif; font-weight : bold; font-size : 48px; } .moji2{ margin : 50px 10px 80px 260px; font-family : Arial,'ＭＳ Ｐゴシック,sans-serif; font-weight : bold; font-size : 48px; }
- ベストアンサー
- HTML
- ページ内ハイパーリンクの表示位置指定
エクセルで、ページの上部にメニュー・下部にメニューの説明を書き、上部メニューを押すと下部メニューに飛ぶようにハイパーリンクを作成しています。 メニュー欄をウィンドウ枠で固定していますが、リンク先へ飛ぶ際、そのリンク先のセルが常のハイパーリンクのすぐ下に表示されるようにしたいんです。 ふつうにハイパーリンクを貼ると、そのセルがページの一番下に表示されてしまいますよね？そうはしたくないんです。 マクロで、リンク先が常にページのトップに来るようなものがあると思いますが、ウィンドウ枠の固定をしているので、それは使えません。 説明が下手ですみませんが、どうすればいいか教えてください。 よろしくお願いします。
- 締切済み
- Excel（エクセル）
- 左メニューをCSSで固定したい
左メニューを固定しスクロールはメイン部分のみするページをHTMLとCSSで作っています。 固定自体はできたのですが、私が作っているページのメニューの項目が多すぎて、メニュー部分を固定するとブラウザ内に入らない下の方の項目が見えなくなってしまいます。 これをフレームを使わずに作ることはできないでしょうか？ できればカクカクしないようなメニューが作りたいです。 ■■■■■■■■■■■■■ ■menu ■ main ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■■■■■■■■■■■■■ ・メニュー部分は固定だが、一番下の項目が見えるまではスクロールできる ・メニューが一番下までいったらメニューはそこで固定してメイン部分だけスクロール 【HTML】 <div id="main"> メインの内容 </div> <div id="menu"> <ul> <li>メニュー1</li> <li>メニュー2</li> <li>メニュー3</li> <li>メニュー4</li> ・・・・（26項目） </ul> </div> 【css】 #main{ float:right; } #menu{ width:160px; position:fixed; _position:absolute; top:30px; left:0px; }
- ベストアンサー
- HTML
- ページ内リンクについて
ページ内リンクについて質問です。 以下のプログラム内容で、実行するとＴopにはいくのですが、 微妙に少しだけTopより下の位置にジャンプします。 完全にTopにいきません・・・ なぜでしょうか？ リンク到着地点のタグの位置が不適切なんでしょうか？ 色々挑戦したんですが、どこがいけないのかわかりません。 回答よろしくお願いします。 【HTML】 <body id="center"> <a name="container" id="container"></a> <div id="rogo"> 会社のロゴ </div> <div class="UD-msg"> 本文 <a href="#container"><img src="images/page_top.GIF" alt="Page Top" title="Page Top" width="58px" height="12.5px"></a> </div> </body> 【css】 #center{ width: 770px; margin-top: 0px; margin-left: auto; margin-right: auto; } #rogo{ margin-top: 6.6px; } .UD-msg{ margin-top: 20px; margin-left: 30px; }
- ベストアンサー
- HTML
- 同一ページの先頭へのリンク
縦長のページの下に ▲topへ というリンクを作って、ページの先頭に戻れるようにしたいと思っています。 <a href="#top">▲topへ</a>としていますが、IE以外ではページの頭に飛んでくれません。 ▲topへ の文字の指定や枠を作るため<div><span>で囲んでいますが、それが影響しているのでしょうか？ 本文はHTML4.01です。 色々見て、考えているのですが、どうしても分りません。 どうしたらページ先頭へ飛ぶように直せるでしょうか。 教えてください。よろしくお願いします。
- ベストアンサー
- HTML
お礼
キレイにできました！ わかりやすくとても助かりました。 本当にありがとうございますm(__)m