HTML の基本的な使用法には、リンク、スタイルシート、span、div などが含まれます。

HTML の基本的な使用法には、リンク、スタイルシート、span、div などが含まれます。
1. リンク
ハイパーテキスト リンクは HTML において非常に重要です。基本的な形式は次のとおりです。

<A HREF="リソース アドレス">リンク テキスト</A>

1. ローカルリンク ① 絶対パス:
<A HREF="C:\images\article.jpg">ローカル画像への絶対パスリンク</A>
②相対的な道路強度
<A HREF ="article2.jpg"> ローカル画像への相対パスリンク</A>
③前のディレクトリへのリンク

<A HREF="../test.htm">前のディレクトリへのリンク</A>

2. URL リンク形式: プロトコル名://ホスト.ドメイン名/パス/ファイル名 プロトコルには以下が含まれます。
ファイル ローカルシステムファイル
http www サーバー
ftp ftpサーバー
telnetはTELNETプロトコルに基づいています
mailto メール
ニュース Usenet ニュースグループ
ゴーファー GOPHER サーバー
wais WAIS サーバー

例: <A HREF="http://www.baidu.com"> Baidu 検索</A>

3. ディレクトリリンク まず、リンクの場所として段落を設定します。形式は次のとおりです。
<A NAME="リンク先の名前"></A>
次に、このリンク部分のファイルを呼び出してリンクを定義します。
<A HREF="ファイル名#リンク先名">リンクテキスト</A>
もちろん、ファイル内でジャンプする場合はファイル名を省略できます。

2. マルチウィンドウフレーム
FRAMES 構造を使用して設計された HTML ファイルは、ウィンドウ全体をいくつかの独立した小さなウィンドウに分割できます。各小さなウィンドウは、異なるファイルを個別に読み込み、互いに通信できます。
1. 基本構造:
<HTML>
<ヘッド>
<タイトル></タイトル>
</HEAD>
<フレームセット>
<フレームSRC="url">
<フレームSRC="url">
...
</フレームセット>
</HTML>
2. 各ウィンドウのサイズ設定 ウィンドウをROWS属性を水平方向に、COLS属性を垂直方向に使用して、いくつかの部分に分割します。 各部分のサイズは、この2つの属性の値によって実現できます。
<フレームセット列数=#>
<フレームセット行数=#>
# の値は、引用符で囲まれた文字列のペアです。文字列内の数字は、コンマで区切られた各ウィンドウのサイズを表します。数字は「*」に置き換えることもできます。これは、ブラウザが自動的にサイズを割り当てることを示します。のように
<フレームセット列="100,200,300">
<フレームセット行数="10%,20%,70%">
<frameset cols="100,*,*"> ウィンドウを100ピクセル外側に均等に分散します
3. ウィンドウ間の連携 ①frameのsrc属性はリンク先のコンテンツを指定するために使用され、name属性はウィンドウの名前を指定するために使用され、target属性はリンクされたファイルがどのウィンドウに表示されるかを指定するために使用されます。その値はnameで定義された名前、または次の4つの値のいずれかになります。
<a href=url target=_blank> は新しいウィンドウを表示します
<a href=url target=_self> 同じウィンドウに表示
<a href=url target=_parent> フレームセット内の前のドキュメントのウィンドウを表示します
<a href=url target=_top> ブラウザウィンドウ全体に表示される②フレームのその他の属性
<frame frameborder=#> #=はい、いいえ
frameborderは各ウィンドウの境界の設定を指定します。yesは境界があることを意味し、noは境界がないことを意味します。

<フレームの余白幅=# 余白の高さ=#>
# の値はピクセル単位です。この属性は、ウィンドウの上、下、左、右の境界の幅を設定するために使用されます。設定されていない場合は、ブラウザによって自動的に決定されます。

<フレームスクロール=#>#=はい、いいえ、自動
スクロール バーの設定。yes ははい、no はいいえ、auto はブラウザーによって自動的に設定されることを意味します。デフォルト値は auto です。

<フレーム noresize="noresize">
noresize 属性は、ユーザーがフレームのサイズを変更できないことを指定します。デフォルトでは、フレーム間の「壁」をドラッグしてフレームのサイズを変更できますが、このプロパティはフレームのサイズをロックします。

3. スタイルシート
1. スタイルシートの最も重要な機能は、すべての Web ページのスタイルの一貫性を保つ方法を提供することです。
スタイルシートの 3 つのレベルは、低いレベルから高いレベルの順に次のようになります。
①. インラインスタイルシート:単一要素の内容に適用 ②. ドキュメントレベルスタイルシート:文書全体の本文に適用 ③. 外部スタイルシート:複数の文書の本文に適用可能。使用時に競合が発生した場合は、下位レベルのスタイルシートが優先されます。
2. CSS を使用する際に注意すべき点:
①ブラウザによっては、特定の属性値をサポートしていない場合があります。この場合、ブラウザはこれらの属性値を無視するか、オプションの値に置き換えます。
② 組み込みスタイルは単一の要素にのみ適用可能であり、実際にはスタイルシートの本来の設計意図に反するため、注意して使用する必要があります。
③ドキュメントレベルのスタイル記述はドキュメントのヘッダーに表示され、ドキュメントの本文全体に適用されます。このようにして、Web サイト構築の全体的なスタイルの一貫性を保つことができます。
④ 外部スタイルシートは、それを使用する文書の一部ではありません。外部スタイルシートは別途保存する必要があり、使用時に記述する必要があります。外部スタイルシートは、MIME タイプ text/css を使用してテキスト ファイルとして記述できます。インターネット上の任意のコンピューターに保存でき、ブラウザーはドキュメントを取得するのと同じように外部スタイルシートを取得できます。 Web ページの上部にある <link> 要素を使用して、外部スタイル シートを指定することもできます。<link> では、rel 属性を使用してリンク先のドキュメントとリンクを含むドキュメントの関係を指定し、href 属性を使用してスタイル シート ドキュメントの URL アドレスを指定します。のように
<link rel=スタイルシート type="text/css" href="themes/AutoTheme/style.css"></link>

4. span と div
場合によっては、<span> では、単語やフレーズを別のフォントや背景に設定するなど、段落全体のテキストの一部にのみ特定の特殊なフォント プロパティを適用する必要があります。ここで <span> 要素を使用できます。例:
<p>私は本当に<span style="font-size:24pt;font-family:黑体;color:red">プログラミング</span>が好きです。とても楽しいことです。 </p>

<div> の使用は、Web ページでは非常に一般的です。セクションは複数の段落で構成されます。デザイン時に、各段落だけでなく、Web ページのセクションにもスタイルを設定する必要があります。このとき、<div> を使用できます。その主な目的は、Web ページ内のセクションまたは領域の外観表示の詳細を指定することです。

<<:  MySQL8.0.18 複数マスターと 1 スレーブの構成

>>:  CSS オーバーフローラップの新しいプロパティ値をどこでも使用

推薦する

GolangでMySQLデータベースを操作するための実装コード

序文Golang は、SQL データベースにアクセスするための database/sql パッケージ...

jQueryメソッド属性の詳細な説明

目次1. jQueryの紹介2. jQueryセレクター2.1 5つの基本セレクタ2.2 4種類の関...

床スクロール効果を実現する js

この記事ではjQueryを使用して、階段のスライド効果を実装し、フロアをスクロールし、フロアボタンを...

jconsole を使用してリモート Tomcat サービスを監視する方法

JConsoleとはJConsole は Java 5 で導入されました。 JConsole は、コ...

Dockerでリモートアクセスを有効にする方法

DockerデーモンソケットDocker デーモンは、 unix 、 tcp 、 fdの 3 種類の...

Jenkins の docker-compose デプロイメントと構成に関する詳細なチュートリアル

Docker-compose デプロイメント構成 Jenkins 1. Docker-compose...

CSS のインライン スタイルに変換するソリューション (css-inline)

シーンについて話すメールを送信サードパーティのウェブサイトにHTMLを埋め込む他の編集者の記事をコピ...

vue.js 動的コンポーネントの詳細な説明

:動的コンポーネントv-bind:is="component name" を使用...

ページスピードの最適化の概要

インターネットは人々の生活にますます欠かせないものになってきていると思います。 Ajax や fle...

CentOS IP接続ネットワーク実装プロセス図

1. システムにログインし、ディレクトリに入ります: cd /etc/sysconfig/netwo...

HTML をホームページとして設定し、お気に入りに追加_Powernode Java Academy

IE ブラウザで「ホームページとして設定」および「お気に入りに追加」機能を実装する方法解決:指定さ...

IDEA で Linux コマンドを使用する方法

Windows システムと比較して、Linux システムは多数の豊富なコマンドライン ツールを提供し...

HTML要素のID属性とName属性の違い

今日、私は <a href="#13"></a> につい...

Linux の総合システム監視ツール dstat の詳細な例

オールラウンドなシステム監視ツール dstat dstat は、vmstat、iostat、nets...

MySQL シリーズ: MySQL リレーショナル データベースの基本概念

目次1. 基本概念2. データベース管理技術の開発3. リレーショナルデータベース(RDBMS)の概...