ページ内で、リンクをするとき、hrefに飛ばしたい場所を#で指定すれば、name属性のところに
ページ移動させれることは知っているのですが、
外部ページから、指定の場所に飛ばすことはできないでしょうか?
==========内部ページ内でリンクを作成する時(link.html)=============
<h1>リンクテスト</h1>
<h2>サンプル</h2>
<h3><a name="menu" id="menu">メニュー</a></h3>
<ul>
<li><a href="#section1">メニュー1</a></li>
<li><a href="#section2">メニュー2</a></li>
<li><a href="#section3">メニュー3</a></li>
</ul>
<h3><a name="section1" id="section1">セクション1</a></h3>
<p>メニュー1の内容。 ...</p>
<h3><a name="section2" id="section2">セクション2</a></h3>
<p>メニュー2の内容。 ...</p>
<h3><a name="section3" id="section3">セクション3</a></h3>
<p>メニュー3の内容。 ...</p>
<p><a href="#menu">メニューに戻る</a></p>
上記ソースのメニュー部分を別ページ(top.html)に作成し、
リンクページの指定部分をメインで映るようにしたいのです。
例えば、下のメニュー3がクリックされたとき、
link.htmlのsection3の内容部分(link.htmlの下にある、セクション3)が画面中央に来るようにしたいのです。
ご教授お願いします。
===top.hmtml(メニュー部分抜粋)==================
<h1>リンクテスト</h1>
<h2>サンプル</h2>
<h3><a name="menu" id="menu">メニュー</a></h3>
<ul>
<li><a href="#section1">メニュー1</a></li>
<li><a href="#section2">メニュー2</a></li>
<li><a href="#section3">メニュー3</a></li>
</ul>
No.1ベストアンサー
- 回答日時:
> link.htmlのsection3の内容部分(link.htmlの下にある、セクション3)が画面中央に来るようにしたいのです。
「画面中央」というのがわかりませんが・・・
hrefの値をパス付き(絶対URL、相対URLのどちらでも)で書けばいいんじゃないですか。
<a href="./link.html#section1">メニュー1</a>
<a href="./link.html#section2">メニュー2</a>
<a href="./link.html#section3">メニュー3</a>
No.2
- 回答日時:
【引用】____________ここから
name = cdata [CS]
この属性は、他のリンクからの終点となり得るよう、当該アンカーに名前をつける。この属性値は固有のアンカー名でなければならない。 この名前の有効範囲は、当該文書内に限られる。 この属性が、id属性と同じ名前空間を共有することに注意されたい。
href = uri [CT]
この属性は、Webリソースの所在を指定する。これによって当該要素(始点側アンカー)と、この属性が定める終点側アンカーとの間のリンクが定まる。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Links in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
すなわち、href="[URI]#ページ内アンカー" と記述するということです。
[URI]の部分には、リンク先のページへのURI--http://**** , ../****, など
#以降は、サーバーには送られませんが、ブラウザはそのページのname/idで特定される要素を探すことになります。
href="#アンカー" は、href="[自信のURI]#" と言う意味です。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS htmlについて質問です! 写真のように写真の部分が?になってしまいます。 ファイルもしっかり選べて 1 2023/07/09 21:17
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- HTML・CSS cssの display: flex;で横並びにならずに困ってます 1 2022/12/04 13:18
- Perl RSSにdiv,ul classを付けたいのですがどのようにつけるのかわからないです 2 2022/03/28 01:53
- HTML・CSS FC2カートのテンプレートでの商品表示について 1 2023/03/02 18:05
- HTML・CSS CSSが上手く反映されないみたいです 2 2022/11/21 16:19
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- その他(プログラミング・Web制作) pythonのWebスクレイピングでfind_allだとurlがNoneに 4 2022/04/17 18:21
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
form action="#"
-
画面を開いたときに指定位置ま...
-
フラグメント識別子によるジャ...
-
ページの途中にリンクするとそ...
-
リンク先からリンク元の、同じ...
-
ブラウザ依存?<a name="#xxx" ...
-
HTML-lintでのエラーについて(...
-
【docomoガラケー】ページ内リ...
-
Preタグ内URLからリンクは張れ...
-
リンク色とVリンク色を同じペー...
-
うまくリンク先に飛ばないです…
-
httpdで接続が拒否される
-
<a target="_top" href="***.ht...
-
Excelで、社外秘(閲覧のみ)と...
-
HTMLからフォルダを開きたい
-
iPadの標準ブラウザでローカルH...
-
ホームページでファイルをダウ...
-
HTMLページが勝手にダウンロー...
-
googleドライブで、PDFファイル...
-
POSTしたデータの文字コードがu...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
form action="#"
-
リンク先からリンク元の、同じ...
-
googleサーチコンソールで、重...
-
<a href="/">トップへ</a> こ...
-
ページの途中にリンクするとそ...
-
画面を開いたときに指定位置ま...
-
httpdで接続が拒否される
-
a:linkのスタイルのインライン指定
-
iframe内の特定の場所にジャン...
-
Preタグ内URLからリンクは張れ...
-
<a target="_top" href="***.ht...
-
リンクの文字とリンクの文字を...
-
ポップアップ画面にアンカーを...
-
マップを使ってページをリンク...
-
WEBページのヘッダーフッターを...
-
DREAMWEAVER アンカーポイント...
-
ページ内の画像だけを一定時間...
-
インラインフレーム内のアンカ...
-
CSS で a hover を個別に適用し...
-
Excel VBAを使ってHTML生成をし...
おすすめ情報