フォームとは何ですか? - 形式は形式ではありません。
ユーザーが特定のデータ、情報、またはオプションを提供できる一部の HTML 要素。通常、フォームには「送信」ボタンがあり、このボタンにより、このデータ/情報/オプションがサーバー上のプログラムに提供されて使用されます (データ処理)。
—フォームの中核はデータです。
フォームタグの構成と形式:
フォーム項目とは何ですか?
単一行のテキスト ボックス:
その他の属性:
値: 初期テキストを設定します
size: 入力ボックスの幅を設定します (単位は「文字幅」) - この数の文字を入力ボックスに配置できます
maxlength: この入力ボックスに入力できる最大文字数を設定します
readonly: これは「valueless」属性であり、「読み取り専用」を意味します。書き込み方法は次のとおりです: readonly="readonly"
disable: 入力ボックスを「無効」に設定します。つまり、データは無効です。
パスワードボックス:
その他の属性:
値: 初期テキストを設定します
size: 入力ボックスの幅を設定します (単位は「文字幅」) - この数の文字を入力ボックスに配置できます
maxlength: この入力ボックスに入力できる最大文字数を設定します
単一オプション:
その他の属性:
可能性があります。それは「価値のない属性」でもあります
名前の特別な指示：単一のオプションのグループでは、名前の値が同じでなければならないことが必要です。
複数のオプション:
通 説明: 通常、複数のオプションには値
が必要です。その他の属性:
可能性があります。それは「価値のない属性」でもあります
送信ボタン:
説明: 送信ボタンをクリックすると、フォームが「送信」されます。つまり、フォームのフォームで設定されたファイルにデータが送信されます。画像ボタン:
️の機能画像ボタンは実際には「送信」ですが、表示される効果は画像です。これはページを美しくするのに役立ちます。
リセット ボタン:
单 説明: フォームのすべてのユーザーが初期状態に入力または選択するデータ通常のボタン:
説明: フォームには影響しませんが、他の要件 (JS プログラム) を達成するためにフォームから「アクション」を生成できます& ファイルドメイン: & lt; 入力タイプ = "ファイル" 名前 = "n9" /& gt; 説明: ユーザーがローカル ファイルを選択 (およびサーバーに送信) できるようにします。ファイルもデータです。
隠しフィールド:
送信済みプログラミングに必要な「隠しデータ」としてサーバーに送信します。
E 選択を引き出す: Select タグと Option タグを連携させます。ただし、これを「フォーム項目」として扱います～ ～ ～ ～
️ withselected 属性をオプション タグで使用して、select 要素のデフォルトの選択項目 (デフォルトでは最初の項目が選択されます) を示すことができます。
️複数の属性を使用できます。 select タグで使用すると、select 要素が「複数選択」できるようになります (つまり、デフォルトでは 1 つだけ選択できます)複数行オプション (リスト オプションとも呼ばれます): 複数行オプションは、実際にはドロップダウン選択の「変形」にすぎません。サイズ値をそれ以上に設定すると、複数行になります。
～ ～
_
️複数行のテキスト ボックス:
with ROWSで設定する行数は数値であり、複数行のテキストボックスで表示できるテキストの数を示します
COLSで設定する列数は数値であり、複数行のテキストボックスで表示できるテキストの数を示します
このタグには value 属性がありません。ただし、実際の「値」は、このタグの中央に配置されるものです。
サーバーによって取得されます。
フレームタグ
最初のコンセプト: 開いている「ウィンドウ」には常に 1 つの Web ページのみが表示されます。
しかし:
実際、本質は依然として 1 つのウィンドウに Web ページを表示することですが、特定のタグ (フレームセット) を使用して「大きなウィンドウ」をいくつかの「」に分割します。小さな窓「」。
まず最初に明確にしておきます:
1. フレームタグ(frameset)を使用する場合、bodyタグは使用できません。つまり、bodyタグの代わりにframesetタグを使用します
2. フレームセットタグを使用するには、フレームセットドキュメントタイプを使用する必要があります
具体的なセグメンテーション コードは次のとおりです:
F & lt; Frameset Cols = "現在のウィンドウを列で分割して設定します" rows = "行に従って現在のウィンドウを設定します" & gt; ～ ～。 。 。 。 。 。 。 。 。 。 。 。
COL の値は、連続的に表す列の幅の数またはパーセンテージであり、互いに区切られています (,)。ここで、「*」は「残り」の幅を示します。例:
” Cols = 100,800 ": 大きなウィンドウが列に従って 2 つの小さなウィンドウに分割されていることを示します。1 つ目は幅 100、2 つ目は幅 800 to’s's s s s s s s s n d - 1 ft 〜3 dを使用し、残りは3番目から3番目のものを使用しています。cols=”15%, *”
ROWS の値は、互いに分離された連続指数線 (,) の幅の数値またはパーセンテージです。「*」は「残り」の幅を示します。例:rows=”100,200,*”
row=”20%, *”
CSSの紹介
CSS: カスケード スタイル シート
CSS を使用すると、次の 2 つの側面から Web ページの外観を制御できます:
1. Web ページの外観をバッチで制御し、労力を節約できます。
2. Web ページの外観をピクセルレベルまで正確に制御します。
CSSの基本構文形式:
セレクター { css 属性名 1: 値 1; css 属性名 2: 値 2;
例:フォント{色:赤; フォントサイズ:18px;}
dt{
font-size:14px;
️フォントの太さ: 太字。🌜
}2 つの属性を区別する方法
html 属性: タグ内に次の形式で記述されます: 属性名 = "属性値" - この引用符は省略できますが、壁の亀裂の場合は省略しないことをお勧めします
—「ラベル属性」とも呼ばれます
—HTML 属性は通常「各タグの独自の属性であり、通常は異なります」
——同じ HTML 属性を使用するタグはほとんどありません
css 属性: セレクターの中括弧内に次の形式で記述されます: 属性名: 属性値 - 特に注意してください。値は引用符で囲むことができません
—「スタイル属性」とも呼ばれます
—CSS プロパティは通常「すべてのタグで利用可能」であり、一般的には同じです
——同じ CSS 属性を使用しないタグはほとんどありません
セレクターの分類
タグセレクター:
形式: タグ名 { …….. }
（意味: (対応する) Web ページ内のすべてのラベルの属性設定を指します。
クラスセレクター:
形式: .クラス名 { …… }
（意味: (対応する) Web ページのクラスの値は、このタイプの名前のすべてのラベルに属性設定が適用されます。例:
～
IDセレクター:
形式: #idname{…… （：該当する）WebページのIDの値が、その名前を表すラベルが属性設定に設定されることを意味します。
注: ID 自体は「のみ」を意味するため、通常、Web ページ内の ID 名は同じであってはなりません。例:
～
ユニバーサルセレクター:
形式: *{ ….. } ——ユニバーサルセレクターはこの形式(記号)のみを持ちます
意味: 自動的に「すべてのタグ」を参照します。つまり、すべてのタグがこの属性設定を適用します
器 注: 一般的な選択デバイスは注意して使用されます。通常は、テキストの色、テキスト サイズ、パディング、マージンなどのいくつかの基本的な属性を設定するためにのみ使用されます疑似クラスセレクター:
形式: :疑似クラス名 {……}
注: 実際には、システム内で規定されている疑似クラス名はいくつかしかありません。リンク、訪問済み、ホバー、アクティブなどです。それらの意味も固有です。通常、上記の疑似クラスはタグにのみ使用され、その形式と意味は通常次のとおりです:
{A: Link {...}: Webページが初期のときのリンクラベルの状態(初期リンク状態)を意味します
a:visited{…..} ：表示一个a链接标签在点击（访问）过之后的时候的状态（访问后状态）
a:hover{….} ：表示一个a链接标签在鼠标放上去的时候的状态（悬停状态）
a:active{….} ：表示一个a链接标签在鼠标摁住但还没有抬起的状态（活动状态）。
不过，最新的浏览器中，出于安全考虑，a的hover和visited效果有些属性不能用了。
复合选择器之：层级选择器
形式： 选择器1 选择器2 { ……… }
含义： 在选择器1所对应的标签中由选择器2所对应的那些标签。。。。。其中，选择器1和选择器2可以是前面所学的任意某种选择器，而且这种层级关系还可以多层次，比如：
#d1 div{…}
.cc1 p span{…..}
p .cc2 img{…..}
#d1 p a:hover{….}
举例：
段落1
複合セレクター: グループセレクター
フォーム: セレクター 1、セレクター 2 {………… }
意味: これは、両方のセレクターが同じ属性設定を使用することを意味します。実際には、これは単純化されたコードを記述する方法にすぎません。そうでない場合は、2 つのセレクターを使用して記述する必要があります。
.a {color:red; font-size:15px;}
.b{ color:red; font-size:15px;}
è
.a, .b{ color:red;}
その他の複合形式 (例):
div.cc1{…} : クラス値 cc1 を持つ div タグを表します。これは div .cc1{…} とはまったく異なります。
p
フレーム:
フレームタグは、「現在のウィンドウ」を小さなウィンドウに分割するために使用される技術です。 framseset は body タグを置き換えて、フレーム ドキュメント タイプを使用します。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
