コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
目次
フレームの構文
HTML のさまざまなタイプのフレーム
フレームタグの種類
タグ属性
フレームとブラウザのサポート
結論
ホームページ ウェブフロントエンド htmlチュートリアル HTMLフレーム

HTMLフレーム

王林
王林
Sep 04, 2024 pm 04:15 PM
html html5 HTML Tutorial HTML Properties HTML tags

HTML フレームは、Web ページまたは Web ブラウザを複数のセクションに分割するのに役立ちます。セクションを分割すると、異なる方法でロードされます。

A フレームは、コンテナから独立してコンテンツを表示します。複数のフレームはコレクションを形成し、フレームセットと呼ばれます。この配置は、表の行と列の方向に似ていると考えることができます。 Frame タグは HTML5 では非推奨になりました。

各フレームには、それを示すフレームタグがあります。 HTML文書では、横枠はframeタグのrow属性で定義され、縦枠はframeタグのcolumn属性で定義されます。 1 つのフレーム内の同じウィンドウに、静的なバナーや 2 番目のナビゲーション メニューなどが表示される場合があります。

フレームの構文

HTML には の終了タグがありません。タグ。 Web ページでフレームを使用するときは、 を使用します。 の代わりにタグを使用します。タグ。 <フレームセット>の使用これは、Web ページをフレームに分割するように指示する方法です。タグは、どの HTML ドキュメントをフレームとして開くかを定義します。

属性 Cols はピクセル単位の値を受け取り、フレームセット内の列の数とサイズを指定するのに役立ちます。

<cols ="10%,80%,10%">
ログイン後にコピー

同様に、上で見たように、属性行はピクセル単位の値を受け取り、フレームセット内の行の数とサイズを指定するのに役立ちます。

<rows ="10%,80%,10%">
ログイン後にコピー

ただし、 はタグは HTML5 で非推奨となり、使用されなくなりました。

HTML のさまざまなタイプのフレーム

フレームの使用法の 1 つは常に、ナビゲーション バーを 1 つのフレームにロードし、メイン ページを別のフレームにロードすることでした。 A-frame タグは、 内の 1 つのウィンドウ フレームを定義します。

Chrome、Internet Explorer、Mozilla、Safari、Opera Mini のブラウザをサポートしています。

フレーム内でよく使用されるさまざまな属性は、border、scrolling、src、name などの属性です。

フレームタグの種類

次に、さまざまなタイプのフレーム タグを示します:

タグ属性

には 5 つの重要な属性があり、ここで説明します:

1. Col: Col 属性は垂直フレームを与えます。ただし、幅は 4 つの方法で指定できます。

  • ピクセル: 絶対値をピクセル単位で指定できます。 3 つの垂直フレームを作成する必要がある場合は、次の値を指定できます:cols=”100,50,100”.
  • パーセンテージ: ブラウザウィンドウのパーセンテージを指定できます。 3 つの垂直フレームを作成する必要がある場合は、次の値を指定できます:cols=”40%,20%,40%”

ここでワイルドカード (*) を使用して、言及されていない残りのウィンドウをワイルドカードに取らせることもできます。

cols=”30%,*,30%”

HTMLフレーム

出力:

HTMLフレーム

2. Rows: row 属性は水平フレームを与えます。フレームセット内の行を指定します。 3 つの水平フレームを作成する必要がある場合は、次を使用します:

例: 行=”10%,80%,10%'.

以前に列の場合に行ったように、各行の高さを設定することもできます。

HTMLフレーム

出力:

HTMLフレーム

3. Border: 各フレームの境界線の幅をピクセル単位で指定します。

例: border=”4”。 border=”0” の場合、境界線がないことを意味します。

4. Frameborder: フレーム間に 3 次元の境界線を表示する必要がある場合は、この属性を使用します。属性が取る値は 1 または 0 (Yes または No) です。

例: Frameborder=”0” は境界線なしを意味します。

5. Framespacing: この属性は、フレームセット内のフレーム間のスペースの量を指定します。この属性には任意の整数値をここで指定できます。

例: Framepacing=”12” は、フレーム間に 12 ピクセルの間隔があることを意味します。

タグ属性

このセクションでは 8 つの属性をリストできます。

1. src: フレームにロードされるファイル名をこの属性に指定します。この属性の値には任意の URL を指定できます。

例: src= www.facebook.com

2. name: この属性はフレームに名前を提供します。ドキュメントをどのフレームにロードするかを定義します。 1 つのフレームに複数のリンクがあり、それが別のフレームに読み込まれる場合は、この属性を使用します。次に、2 番目のフレームには、リンクのターゲットとしてそれ自体を識別するための名前が必要です。

例: name=”abc.htm.”

3. Frameborder: この属性は、境界線を表示するかどうかを示すために指定されます。値は 1 または 0 (Yes または No) です。

4. marginwidth: この属性は、フレームの境界線の左右の間のスペースの幅や、フレームのコンテンツを指定するのに役立ちます。値はピクセル単位で指定されます。

例: marginwidth=”10”.

5. marginheight: この属性は、フレームの境界線の上部と下部の間のスペースの高さだけでなく、フレームのコンテンツも指定するのに役立ちます。値はピクセル単位で指定されます。

例: marginheight=”10”.

6. noresize: この属性は基本的に、ユーザーが既存のフレームに変更を加えるのを防ぎます。この属性がない場合、どのフレームでもサイズを変更できます。

例: noresize=”noresize.”

7. Scrolling: この属性は、フレーム上に存在するスクロール バーの外観を制御します。値は「はい」、「いいえ」、「自動」のいずれかです。

例:scroll=” no” は、スクロール バーを含めないことを意味します。

8. longdesc: この属性を使用すると、フレームのコンテンツの長い説明を含む別のページへのリンクを提供できます。

例: longdesc=”framedesc.htm.”

フレームとブラウザのサポート

古いブラウザはフレームをサポートしていないため、要素はユーザーに表示される必要があります。</p> <p>実際には、<body>要素は <noframes> 内に配置する必要があります。 <frameset> 要素なので、要素は <body> を置き換えることになっています。要素。ブラウザが <frameset> を理解できない場合は、 </p> 要素の内容を理解します。 <noframes> に含まれる要素要素。 <p>古いブラウザを使用しているユーザーに対して、このようなシナリオでメッセージを表示するのは良いアプローチです。 「ごめんなさい！」のようなメッセージお使いのブラウザはフレームをサポートしていません。」通知します。</p> <h3 id="結論">結論</h3> <p>最近では、フレーム テクノロジが多くのブラウザでサポートされていません。小型デバイスでは Web ページのコンテンツが適切に表示されないことがよくあります。いずれにしても、新しいテクノロジーと互換性のあるより良いモデルを開発できるように、既存の知識を持っておくことは良いことです。</p>

以上がHTMLフレームの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

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

もっと見る

人気の記事

KB5055523を修正する方法Windows 11にインストールできませんか？
3週間前 By DDD
KB5055518を修正する方法Windows 10にインストールできませんか？
3週間前 By DDD
R.E.P.O.のすべての敵とモンスターの強度レベル
3週間前 By 尊渡假赌尊渡假赌尊渡假赌
<🎜>：死んだレール - オオカミの飼い主
3週間前 By DDD
ブループリンス：地下室への行き方
3週間前 By DDD
もっと見る

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Java チュートリアル
1653
14
CakePHP チュートリアル
1413
52
Laravel チュートリアル
1306
25
PHP チュートリアル
1251
29
C# チュートリアル
1224
24
もっと見る
Related knowledge
HTMLの表の境界線 HTMLの表の境界線 Sep 04, 2024 pm 04:49 PM

HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。

HTML のネストされたテーブル HTML のネストされたテーブル Sep 04, 2024 pm 04:49 PM

これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。

HTML 左マージン HTML 左マージン Sep 04, 2024 pm 04:48 PM

HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。

HTML テーブルのレイアウト HTML テーブルのレイアウト Sep 04, 2024 pm 04:54 PM

HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。

HTML入力プレースホルダー HTML入力プレースホルダー Sep 04, 2024 pm 04:54 PM

HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。

HTML 順序付きリスト HTML 順序付きリスト Sep 04, 2024 pm 04:43 PM

HTML 順序付きリストのガイド。ここでは、HTML 順序付きリストと型の導入とその例についても説明します。

HTML の onclick ボタン HTML の onclick ボタン Sep 04, 2024 pm 04:49 PM

HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。

HTML 内のテキストの移動 HTML 内のテキストの移動 Sep 04, 2024 pm 04:45 PM

HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。

See all articles