別ページ途中部分へのリンクについて

Topic summary

別ページの特定箇所へリンクする方法についての質問です。

質問内容:

  • 別ページの途中部分へリンクさせたい
  • id="" を使う方法は見つけたが、コードのどこに挿入すべきか分からない
  • 現在は右クリックでURLをコピーしているが、遷移後に選択箇所が変色(紫の網掛け)してしまう

回答内容:
フルバランスの道家氏が以下の方法を提示:

  • リンク元:<a href="example2.html#abc">ABCの位置へジャンプ</a>
  • リンク先:<h3 id="abc">ここがABCの位置</h3>
  • Chrome DevToolsのElementsで該当要素を探してidを設定することを推奨

現状:

  • id設置と遷移設定は成功
  • しかし遷移後のid設定箇所の変色問題は未解決
  • 質問者は変色の修正方法について追加で質問中
Summarized with AI on November 24. AI used: claude-sonnet-4-5-20250929.

遷移についてのご質問です。別のページの途中部分へリンクさせる方法をお聞きしたいです。

検索したところコード編集にて「id=" "」等を利用する方法がヒットしたのですが、恥ずかしながらコードの知識がなく、コード編集画面上のどこに挿入すれば良いのかがわかりません。

こちらについてご教示いただきたいです。

また、現状では遷移先対象箇所を右クリックして「選択箇所へのリンクをコピー」よりURLを貼り付けているのですが、実際に遷移した先で選択箇所が変色してしまいます。これを防ぐ方法も併せて教えていただければ幸いです!

ご説明不足しておりましたらお知らせくださいませ。

何卒よろしくお願いいたします。

Tk14 様

はじめまして、フルバランスの道家と申します。

ご質問確認いたしました。

別ページへのリンクの仕方は、こちらのページの解説がわかりやすいかと思います。

https://www.tagindex.com/html_tag/link/a_url_id.html

以下の上記URLからの抜粋になります。

リンク元(出発点)

example1.html

ABCの位置へジャンプ

リンク先(到達点)

example2.html

ここがABCの位置

上記のような形で、出発点を

到達点を

とすればよいかと思います。(h3タグでなくても動作します。)

idを設定したい場所は、chrome devtoolsのelementsで該当要素を探していただければと思います。

https://qiita.com/sasao3/items/8ae62bc64fed7913d1b1

なにかヒントになれば幸いです。

私たちの励みにもなりますので、

お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

フルバランス 道家

フルバランス

道家様

ご連絡ありがとうございます!

おかげさまでid設置並びに遷移設定が叶いました。

ただ、この方法でも遷移後id設定箇所が変色する(紫に網がかかる)のですが、こちらについては修正できないものなのでしょうか。

ご質問を重ね申し訳ございませんがご教示いただけますと幸いです。

何卒よろしくお願いいたします。