Web ページ制作の初心者: HTML ハイパーリンク A タグ_HTML/Xhtml_Web ページ制作の使い方を学ぶ
ハイパーリンクaタグはリンクポイントを表し、英語のアンカーの略称です。その機能は、現在の位置にあるテキストまたは画像を他のページ、テキスト、または画像に接続することです。これはよく知られていますが、その文法構造はあまり知られていないため、効果的に使用するには、その文法構造を理解する必要があります。 ハイパーリンクタグはリンクポイントを表し、英語のアンカーの略称です。その機能は、現在の位置にあるテキストまたは画像を他のページ、テキスト、または画像に接続することです。これはよく知られていますが、その文法構造はあまり知られていないため、効果的に使用するには、その文法構造を理解する必要があります。 タグの基本的な構文構造は次のとおりです。
class=type
id=value
href=reference
name=value
rel=same|next|親| 前の
rev=value
target=window
style=value
title=title
onclick=function
onmouseout=function
onMouseOver=function>
タグの文法構造から、ハイパーリンクを設定してさまざまなリンク効果を実現するために選択できるパラメーターが多数あることがわかります。これは少し予想外でしょうか。 !
class および id オプション: リンク ポイントのタイプと割り当てられた ID 番号を設定するために使用されます。通常は設定されません。最も一般的に使用される 2 つのパラメータは、href と name です。 href はハイパーテキスト リファレンスの略で、リンク アドレスを設定するために使用されます。リンク アドレスは URL アドレスである必要があります。特定のパスが指定されていない場合、デフォルトのパスは現在のページのパスと同じになります。 リンク先のファイルもいくつかの状況に分けられます。HTML ファイルの場合は、現在のブラウザで直接開かれます。実行可能ファイル (.exe ファイル) の場合は、ファイルが直接実行またはダウンロードされます。この機能は、Word形式などのテキストファイルであれば、ブラウザ上で開いて編集・加工することができます。
rel: リンク関係の設定を示します。rel=same はリンク先のファイルがこのファイルと同じであることを示し、rel=next はリンク先のファイルが次のページであることを示し、rel=parent はこのファイルであることを示しますは、リンクされるファイルの親です。rel=previous は、リンクされるファイルが前のページであることを意味します。
rev: 逆リンクの設定に使用されます。
target: フレーム ウィンドウを使用するときにリンクするウィンドウを設定します。target="_bank" は、新しいウィンドウを開いて Web ページを開くことを意味します。
title: リンクポイントが選択されたときに表示されるタイトルを設定するために使用されます。
onclick: イベントに対応します。リンク ポイントがクリックされると、このイベントがトリガーされ、対応するサブルーチンが実行されます。
onmouseover: onclick と同様に、マウスがリンク ポイント上に移動すると、対応するイベントがトリガーされます。
onmouseout: マウスが町の連絡先から出た後に、対応するイベントがトリガーされます。
いくつかの例: ホームページに戻る
音声ファイルを再生する
対応するプログラムを実行する
開く対応するプログラム 文書の処理
アプリケーションスキル
1. ダウンロードファイルの提供
多くのネチズンがダウンロード効果を提供する方法を尋ねる書き込みをしています。実際には、これはまだハイパーリンクですが、ダウンロード用のファイルを Web サイトにアップロードする必要があります。例: ダウンロード用の「Web ページ スキル」ファイル パッケージがあり、ファイル名は「homepagejq.zip」で、Web サイトにアップロードされています。このリンクのコードは次のように記述できます。 ダウンロードするにはここをクリックしてください。 「Web ページ スキル」ファイル パッケージ 。
2. リンク先のWebページを新しいウィンドウで開きます
「target」の値を「_blank」に設定します。例: Web ページ「aboutme.htm」を新しいウィンドウで開きます。この効果を生成するコードは次のとおりです: About me...。
3. リンクにマウスを移動し、説明テキストの行を表示します。
この効果を得るには、「title」パラメーターの値を設定します。例:リンク「スクリプトホーム」にマウスを移動すると、「ホームページ制作のテクニックを紹介する専門サイトです」という説明が表示されます。このリンクのコードは次のとおりです: Web ページ制作 スキルを紹介する専門 Web サイトです">Script House。
4. リンクにマウスを移動すると、ウィンドウがポップアップします。
これは、onmouseover パラメーターを設定することによって得られる効果です。例: マウスをリンク上に移動すると、ウィンドウがポップアップし、ウィンドウ内に「マウス ホバー効果のデモンストレーション!」と表示されます。このリンクのコードは次のようになります: Link。同様の方法を使用して、マウスを押すとプロンプト ウィンドウがポップアップし、マウスを離すとプロンプト ウィンドウがポップアップする効果を作成できます。
5. このページの指定されたコンテンツへのリンク
このページのコンテンツの特定の部分へのリンク (つまり、「ファイル内でジャンプ」) を実現するには、リンク ポイントの名前をパラメータ名で指定する必要があります。テキストの一部を選択し、リンク用の name パラメーターを使用して名前を付けます。いわゆる同じファイル内でのジャンプとは、読者が非常に長いファイルを読んでいるときに、コンテンツの特定の部分だけに興味がある場合は、ジャンプ読書方法を使用できることを意味します。基本的な形式は次のとおりです:
パート 2パート 1 の内容...
................................................. ...................
後半の実際の内容...
.... .. ...................
「パート2」をクリックするとこうなります このハイパーリンクの後、自動的に転送されます「第 2 部実際のコンテンツ」の場所。 「name」パラメータで定義されるリンクポイント名は任意に選択できますが、リンクの「href」パラメータのリンクポイント名と一致している必要があります。先頭に「#」を追加することを忘れないでください。
6. 他のページの指定されたコンテンツの場所へのリンク
方法は上記の例と似ていますが、Web ページのファイル名をリンクポイント名の前に追加する必要があります。 「href」パラメータ。例: page1.htm と page2.htm という 2 つの Web ページがあり、各ページにはコンテンツの 2 つの部分があります。リンクをクリックすると、page1.htm の 2 番目の部分に移動します。 page2.htm より優れています。まず、page2.htm の 2 番目の部分の先頭に次のコードを記述します。 ; このようなリンク コードを page1.htm に記述します。 page2 の 2 番目の部分 部分的なコンテンツ。
7. E_mail へのリンク
ハイパーリンクをクリックすると、クライアント コンピューター上の電子メール管理ソフトウェアが起動して、レターを送信します。次のコード行を考えてみましょう: 私に手紙を書いてください。 「書き込みをお願いします」のリンクをクリックすると、メール管理ソフト(OEなど)の書き込み機能が自動的に起動し、受信者のアドレスバーにメールアドレスが追加されます。
リンクはテキストをキャリアとして使用するだけでなく、画像をキャリアとして使用することもでき、また、画像の特定の部分をキャリアとして使用することもでき、方法も同様であり、唯一の効果を達成できます。違いはキャリア、つまりリンクです。2 つの角括弧で囲まれた部分です。別の例は示しません。

HTMLコードは、オンラインバリデーター、統合ツール、自動化されたプロセスを使用するとクリーンになります。 1)w3cmarkupvalidationserviceを使用して、HTMLコードをオンラインで確認します。 2)リアルタイム検証のためにVisualStudiocodeにhtmlhint拡張機能をインストールして構成します。 3)HTMLTIDYを使用して、建設プロセスでHTMLファイルを自動的に検証およびクリーニングします。

HTML、CSS、およびJavaScriptは、最新のWebページを構築するためのコアテクノロジーです。1。HTMLはWebページ構造を定義します。2。CSSはWebページの外観に責任があります。

HTMLの機能は、Webページの構造とコンテンツを定義することであり、その目的は、情報を表示するための標準化された方法を提供することです。 1)HTMLは、タイトルやパラグラフなどのタグや属性を使用して、Webページのさまざまな部分を整理しています。 2)コンテンツとパフォーマンスの分離をサポートし、メンテナンス効率を向上させます。 3)HTMLは拡張可能であり、カスタムタグがSEOを強化できるようにします。

HTMLの将来の傾向はセマンティクスとWebコンポーネントであり、CSSの将来の傾向はCSS-in-JSとCSShoudiniであり、JavaScriptの将来の傾向はWebAssemblyとServerLessです。 1。HTMLセマンティクスはアクセシビリティとSEO効果を改善し、Webコンポーネントは開発効率を向上させますが、ブラウザの互換性に注意を払う必要があります。 2。CSS-in-JSは、スタイル管理の柔軟性を高めますが、ファイルサイズを増やす可能性があります。 CSShoudiniは、CSSレンダリングの直接操作を可能にします。 3. Webassemblyブラウザーアプリケーションのパフォーマンスを最適化しますが、急な学習曲線があり、サーバーレスは開発を簡素化しますが、コールドスタートの問題の最適化が必要です。

Web開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。1。HTMLは、Webページ構造を定義し、2。CSSはWebページスタイルを制御し、3。JavaScriptは動的な動作を追加します。一緒に、彼らは最新のウェブサイトのフレームワーク、美学、および相互作用を構築します。

HTMLの将来は、無限の可能性に満ちています。 1)新機能と標準には、より多くのセマンティックタグとWebComponentsの人気が含まれます。 2)Webデザインのトレンドは、レスポンシブでアクセス可能なデザインに向けて発展し続けます。 3)パフォーマンスの最適化により、応答性の高い画像読み込みと怠zyなロードテクノロジーを通じてユーザーエクスペリエンスが向上します。

Web開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。HTMLはコンテンツ構造を担当し、CSSはスタイルを担当し、JavaScriptは動的な動作を担当します。 1。HTMLは、セマンティクスを確保するためにタグを使用してWebページの構造とコンテンツを定義します。 2。CSSは、セレクターと属性を介してWebページスタイルを制御して、美しく読みやすくします。 3。JavaScriptは、動的でインタラクティブな関数を実現するために、スクリプトを通じてWebページの動作を制御します。

htmlisnotaprogramminglanguage; itisamarkuplanguage.1)htmlStructuresandformatswebcontentusingtags.2)ItworkswithcsssssssssdjavascriptforInteractivity、強化を促進します。


ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

MantisBT
Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。

SecLists
SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

SublimeText3 中国語版
中国語版、とても使いやすい

MinGW - Minimalist GNU for Windows
このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。
