简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
ホームページ > ウェブフロントエンド > htmlチュートリアル > 本文

フレームセットの使用法チュートリアルの概要_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 11:24:34
オリジナル
1371 人が閲覧しました

フレームは、Web 開発において習得しなければならない知識です。たとえば、背景のアーキテクチャ、部分的な更新、ページの分割はすべてフレームの使用法であり、特に背景ページの作成はユーザーに非常に快適なエクスペリエンスを提供します。

フレームの知識ポイントには (frameset タグ、frame タグ、iframe タグ) が含まれます。以下に一つずつ紹介していきます。

1. フレームセット

1. プロパティ

①ボーダー

フレームの境界線の太さを設定します。

②bordercolor

枠の枠線の色を設定します。

③frameborder

フレーム枠を表示するかどうかを設定します。設定値は 0 と 1 のみで、0 は境界線なし、1 は境界線を表示することを意味します。

④cols

ページを縦に分割します。数値表現方法は「30%、30(または30px)、*」の3つがあり、値の個数は分割ウィンドウ数を表し、値は「,」で区切られます。 「30%」は、フレーム領域がブラウザ ページ領域全体の 30% を占めることを意味します。「30」は、その領域の横幅が 30 ピクセルであることを意味します。「*」は、この領域が残りのページ領域を占めることを意味します。例:cols="25%,200,*" は、ページを 3 つの部分に分割することを意味します。左側の部分はページの 30% を占め、中央の水平幅は 200 ピクセル、ページの残りの部分は右側です。一部。

⑤行

ページを横に分割します。数値の表現方法や意味はcolsと同じです。

⑥framespacing

フレーム間の予約スペース距離を設定します。

2. ユースケース

注 1:

両方のrows 同じ タグ内で属性を使用しないようにしてください。以下のアーキテクチャを実装するには、コードを記述する正しい方法は次のとおりです:

;

< ;frame src="???" name="mainFrame" id="mainFrame"/>

[つまり、列と行の両方を使用したい場合は、フレームセットのネストを使用できます]

注 2:

は、最初のフレームがブラウザ ウィンドウ全体の 40% を占め、残りのスペースが他の 2 つのフレームに均等に分配されることを意味します。 。

は、ブラウザ ウィンドウが 4 つの部分に分割されることを意味します。

2. フレーム

1. プロパティ

① フレーム名を設定します。このプロパティは設定する必要があります。

②src

このフレームに表示するWebページの名前またはパスを設定します。このプロパティは設定する必要があります。

③スクロール

スクロールバーを表示するかどうかを設定します。設定値はauto、yes、noです。

④bordercolor

枠の枠線の色を設定します。

⑤フレームボーダー

コマ枠を表示するかどうかを設定します。設定値は 0 と 1 のみで、0 は境界線なし、1 は境界線を表示することを意味します。

⑥noresize

フレームサイズを手動で調整できるかどうかを設定します。

⑦marginwidth

枠線とその中のコンテンツとの間の幅を設定します。

⑧marginhight

枠線とその中のコンテンツとの間の高さを設定します。

⑨幅

フレームの幅を設定します。

⑩高さ

フレームの高さを設定します。

2. 使用例

3. iframe

の他の主な属性は次のとおりです (同じものはありません)。

1. プロパティ

①align

垂直方向または水平方向の配置を設定します

②allowTransparency

オブジェクトを透明にできるかどうかを設定または取得します。

2. 使用例

注:

iframe タグの検証方法は、frameset や Frame タグとは異なり、

XHTML 1.0 Transitional です。そして、iframe は body タグ内に配置され、frameset と Frame は body タグの外側に配置されます。

IV. 総合的な例

総合的な例 > ;

<フレームセット列= " 25%,*">

</p> <p class="sycode"> <body> </p> <p class="sycode"> <p> 申し訳ありませんが、お使いのブラウザは「フレーム」をサポートしていません。 </p> </p> </body> <p class="sycode">

t;フラグこのペアは、フレームをサポートしていないブラウザでテキストまたは画像情報を表示するために使用される、

フラグ ペアの間にも配置されます。このタグのペアの直後に、おなじみのタグを使用する前に、 タグのペアが続きます。 最後に、上記のようにコードを書くときにエラーが報告されている場合は、次のようにコードを記述するとき、

ソリューションは次のとおりです。

ツール→ オプション → テキスト エディター → HTML → 検証 → Internet Explorer 6.0

さて、上記の内容を通じて、もっと練習すれば、フレームの関連知識が徐々に慣れてきて、うまく使えば、それが本当に良いものであることがわかるでしょう。フレーム系タグのイベントメソッドについては、一般的にはあまり使用されませんので、必要に応じてご自身で確認してください。 [はは、実はまだ使ってないんです]

関連ラベル：
Frameset使用教程 小结
ソース：php.cn
前の記事：Yan Shiba と一緒に HTML の最初のレッスンを学びましょう、div レイアウト css_html/css_WEB-ITnose 次の記事：iframe クロスドメイン高さadaptive_html/css_WEB-ITnose
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
要素が画面上にある場合でも、要素が表示される前に「waitForSelector」がタイムアウトします。 チェックアウト ボットを構築していますが、ボットにクリックするよう指示した要素が画面上に表示されるにもかかわらず、ボットがクリックしない、愚かな「テキスト メッセージを受信するには...
から 2024-04-04 18:31:08
0
1
1416
質問は同じですが、タイトルは次のように書き換えられています: Javascript のランダム関数が有効な応答を生成できません JSとHTMLを使用して簡単な乱数生成ゲームを作成しています。このゲームでは乱数の最小値と最大値を設定できます。しかし、変数を設定して結果を記録すると、ありえない数値が表示されます...
から 2024-04-03 22:03:14
0
1
275
PHP チュートリアル: PHP を使用して Linkedin にテキストと画像をアップロードするには? LinkedinsRestAPI (https://learn.microsoft.com/en-us/linkedin/consumer/integrations/self-se...
から 2024-04-03 18:42:29
0
1
420
WooCommerce Checkout - ユーザーの役割とカートの内容を検証する WooCommerce のチェックアウト プロセスで問題が発生しています。通常商品とB2B商品を区別するために「B2BforWooCommerce」プラグインを使用しています。シナ...
から 2024-04-03 11:58:52
0
1
475
div を使用せずに複数のスパンクラスを同じ行に置くことは可能ですか? 各テキストに異なる色を付けたかったので、複数のスパンクラスを使用して CSS で色を設定しました。また、テキストに改行を入れたかったので、div を使用しました。このフィドルは私が...
から 2024-04-03 11:17:18
0
1
360
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！