【HTML入門】#12.リンクを表す要素
HTML-код
- Опубликовано: 8 сен 2024
- 本気で学ぶHTML入門講座12回目は、
リンクを表す要素についてです。
●公式サイトで見る
creatorquest.j...
■目次
・概要と目標 0:12
・リンクを表す要素 0:51
・基本的なリンクを設定してみよう 5:58
・リンク先を新しいウインドウで表示する方法 12:21
・リンク先を新しいウインドウで表示してみよう 12:53
・ページ内の他の場所へのリンク 14:24
・ページ内リンクを使ってみよう 16:28
・a要素の注意点 18:43
・練習問題 20:49
・解答 21:26
・まとめ 24:40
■リンクはa要素で挟む
ハイパーリンクを行うには、
リンクしたい箇所をa要素で挟みます。
aはanchorの略で、錨という意味です。
そして、リンク先は href属性 で指定します。
また、a要素で挟まれたテキストを
アンカーテキストと言います。
●カテゴリ
・フロー・コンテンツ
・フレージング・コンテンツ
・インタラクティブ・コンテンツ
●コンテンツ・モデル
トランスペアレント
■新しいウインドウで表示する
リンク先を新しいウインドウで表示するには、
a要素に、target属性を指定します。
属性値に、「_blank」を指定することで、
新しいウインドウに表示できます。
■ページ内リンク
ページ内リンクを行うには、
まず、ジャンプして来てほしい箇所に、
id属性で、名前を指定します。
そして、リンクを設定するa要素のhref属性に、
「#」を付けてから、そのID名を指定します。
■a要素の注意点
a要素のコンテンツモデルは、
「トランスペアレント」です。
トランスペアレントは、透明という意味で、
親要素のコンテンツモデルを引き継ぐというものです。
HTML5より前のHTMLとは大きな変更点になりますので、
注意しましょう。
■本気で学ぶ！HTML入門講座
• 本気で学ぶ！HTML入門講座
素材
・CV：さとうささら（CeVIO）
cevio.jp/
・CV：タカハシ（CeVIO）
cevio.jp/
・BGM：甘茶の音楽工房
amachamusic.cha...
私は43歳にしてプログラマーを志望している者です。まったくの未経験ですが、最初の#１はチンプンカンぷでしたが、この回の講義は軽く理解できました。私の学習スタイルは、コードをブログで書いて公表してゆきながら自分の理解を深めてゆきたいと思います。
この講座のいいとこは、正式な名称とか読み方を教えてくれるところですね。はheadingの略、はun/ordered listの略で。 エイチレフとか読み方をちゃんと知ってる方が負担少ない感がある。
リンクのところってややこしいですけど一気にwebサイトを作ってる感じがして楽しいです
リンクはHTMLの醍醐味ですので、
できると嬉しくなりますよね。
#1講座からコツコツと学習していますが特に#12 ハイパーリンクの講座から楽しくて時間が過ぎるのも忘れ学んでいます。と いうのもリンク先の指定には以前からたいへん興味があったからです。実際に自分でそれらを入力できることがとても嬉しいです。
この講座に出会えたことで自信に繋がり人生が前向きに好転しています。本当に感謝しています。
ありがとうございます‼️
二人のかけ合いが面白い。
説明が丁寧で分かりやすいです！
aの使い方がやっとすとんと理解できました！！ほんとすごくいい動画！！！！
企業情報の終了タグが無いような…
わざとでしょうか。
と思ったらタグの後にちゃんとありました。
やっぱこの授業ありがたいなぁ、学生時代にもこのレベルがあれば・・
問題の企業情報にが無いのは僕たちがちゃんと気付けるかを確認するためわざと書かなかったんですよね！
いつも分かりやすい教材を作ってくれてありがとうございます！
ちなみに僕は気付きませんでした！
中に配置してあるul要素の後ろにあるので、たしかに見落としやすい箇所ですよね。
@@CreatorQuest 1年前の返信に失礼します。 どうして「企業情報」ではなく、の後ろにあるのでしょうか？
今日初めてやってみてここまで来れました。結構楽しくて全部行けそうとか生意気言っときます。教材も動画も本当にありがとうございます！とてもわかりやすいです。質問なのですが、文字が棒線で消されるような表記になってしまうのは何故でしょうか。一応リンクしたやつには飛べるのですが。
キーボードの「insert」のことでしょうか？
邊吃著消夜邊看的說，馬上按個讚的說
先生かわいい
先生に叱られたい
hrefにURLだと飛ぶんですけど
同じ階層の中で名前指定しても
エラーが起きる。
なぜだろうか。ちなみにWindowsです
名前指定してるファイルが今記述してるhtmlファイルと同じフォルダ内に無いか、ファイル名を間違えているかだと思います。
13:50 ページ内リンクのやり方
最近勉強するのに使わせてもらっています！
リンクがおんなじようにやってもできません！なぜでしょう？
あとAtomもドラッグ&ドロップ使えなくなりました😢原因わかる方いませんか？
外部リンクは出来たのですが、｢~.html｣はリンク出来ません…
相対パスですかね？
@@CreatorQuest そうです！(汗)
@@user-uy6nc5vc9m そのファイルが同じフォルダに無いからだと思います。
htppsのやつはジャンプできたけどhtmlは全くジャンプできん…
これpcの問題なのかな
誰かわかる人いませんか〜
名前指定してるファイルをちゃんと今記述しているhtmlファイルと同じフォルダ内に入れましたか？
練習問題って入ってなくないですか？
入ってませんか？
21:45 企業情報のところです
中に配置したul要素の後ろにあるんです。
全く飛べやん
13行目 企業情報 の後に はいらないのですか。