HTMLのタグと一般的に使用されるタグの属性
- 24-07-2022
- Trung Minh
- 0 Comments
この記事では、HTMLのタグを使用してWebページにリンク( link )を作成する方法を紹介します。
タグはウェブサイトで非常に重要な役割を果たし、ウェブサイトをリンクするためのリンクを作成するために使用されます。このサイトの構造を見てください。私はたくさんのリンクを作成しました。それぞれのリンクは、freetuts.netサイト自体のレッスンを示しています。
さらに、他のWebサイトへのリンクを作成することもできます。これは、読者にとって役立つリンクです。
Mục lục
HTMLのタグとは何ですか?
htmlのタグは、リンク、つまりインターネット上の特定のWebサイトのリンクを作成するために使用されます。
SEOについて学ぶと、バックリンクに行くときにタグが重要a
役割を果たしていることがわかります。リンクには、内部リンク(内部リンク)と他のWebサイトへのアウトバウンドリンク(外部リンク)の2種類があります。内部リンクはドメイン内のページにのみリンクするリンクであり、アウトバウンドリンクは現在のドメインではないWebサイトを指すリンクです。
タグ付きのリンクを作成するための構文は次のとおりです。
<a href="https://hocvietcode.com">web888.vn</a>
hrefは、ポイントしたいWebサイトへのパスです。
例:リンクhttps://hocvietcode.com/hoc-javascript
を指す、学習javascriptのコンテンツを含むリンクを作成します。
<a href="https://hocvietcode.com/hoc-javascript">học javascript</a>
HTMLのタグの属性
次に、タグで最も一般的に使用される属性のいくつかを紹介します。
.tagのtitle属性
title属性は、リンクの意味を説明するために使用されます。リンクにカーソルを合わせると、タイトル属性に配置したコンテンツであるテキストが表示されます。
<a href="https://hocvietcode.com/hoc-javascript" title="học javascript tại đây">học javascript</a>
.tagのrel属性
平均的な人はこの属性にあまり興味がないでしょう。しかし、あなたがSEOの人なら、注意を払う必要があります。
rel属性は、このリンクを検出するかどうかを検索エンジンに指示するために使用されます。次の2つの値があります:
- フォローはあります
- nofollowは、検出されないことを意味します
例:上記の例のリンクにアクセスしないように検索ボットを宣言します。
<a href="https://hocvietcode.com/hoc-javascript" rel="nofollow">học javascript</a>
.tagのターゲット属性
リンクをクリックすると、ブラウザはすぐに目的のページにリダイレクトされ、現在のタブの右側に移動します。別のタブに移動する場合は、 target属性を使用できます。
- _blank 、リンクを新しいタブに特化します
- _self次に、現在のタブのリンクを切り替えます(デフォルト値)
- _parent次に、現在のタブを開くタブにリンクをリダイレクトします。現在のタブの親タブとも呼ばれます
- _topすると、現在のタブにジャンプし、iframeを終了して元のページに移動するときにiframeでよく使用されます。
.tagのダウンロード属性
リンクをクリックしたときに、そのリンクにアクセスする代わりに、ブラウザがそのリンクのコンテンツをダウンロードする場合は、ダウンロード属性を宣言してください。
<a href="https://hocvietcode.com/hoc-javascript" download>học javascript</a>
HTMLのタグのhref#値
タグを宣言したがリンクをポイントしたくない場合は、 href="#"
値を設定します。
<a href="#">học javascript</a>
また、タグをクリックすると、ブラウザがウェブページの特定の位置に移動しますので、以下を行ってください。
手順1 :移動先の場所のIDを設定します。それがdivタグだとしましょう、そして私はそれのIDを次のように設定します:
<div id="moveto"></div>
ステップ2 :タグをクリックすると、 div#moveto
タグにジャンプし、次のように設定します。
<a href="#moveto" >Đi tới div#moveto</a>
HTMLのタグの状態
タグaには4つの主要な状態があります。
- リンク:リンクに対するアクションはまだありません
- 訪問済み:リンクをクリックして、ランディングページに移動しました
- ホバー:リンク上を移動します
- アクティブ:リンクがアクティブ化されました
通常、CSSと組み合わせて、これら4つの状態をアニメーション化します。この問題は、CSS形式のタグを記事で紹介します。
これで、タグの使用方法の説明が終わりました。これは、Webページの構造を構築するときに非常に重要なタグです。ここでこの記事をやめます。次の投稿でお会いしましょう。