Web自動化を学習するための前提条件：手動テスト（さまざまなテストの知識）、プログラミング言語の学習、Webの基本の学習、自動テストツールの学習、自動テストフレームワークの学習、および言語の学習かフロントエンドかを問わず、フロントエンドの知識を習得する必要があります。エンドナレッジ、すべては次のスクリプトとフレームワークが道を開くためのものです。この記事では、フロントエンドの基本的な知識を紹介します。
Webページの基盤（HTML、CSS）、Webフロントエンドの3つのコアテクノロジー
HTML：Webページアーキテクチャを担当
CSS：Webページのスタイルと美化を担当します
JS：Webページの動作を担当
01
一般的なHTMLタグ
HTMLは、Webページを記述するための言語です。HTMLは
、プログラミング言語ではなく、ハイパーテキスト言語を指します。これは、
HTMがタグを使用してWebページを記述するマークアップ言語です。
ケース：txtテキストからhtml形式
これは最初の段落ファイルです
これは2番目の段落ファイルです
HTMLタグ
タグは、通常はペアで、角に包まれたキーワードです
最初のタグはタグを開始し、最後のタグはタグを終了します例：
HTMLのシングルタグとダブルタグ
シングルラベルの書き込み：
ダブルラベルの書き込み：
HTML属性
HTML属性はタグ属性を参照します
HTMLタグは複数の属性を持つことができます
属性は、属性名=属性値の形式で表示されます
1.HTMLスケルトン
<head>
<meta charset="UTF-8">
<title>码同学教育</title>
</head>
<body>
码同学教育
</body>
html：はWebページで最大のタグであり、ルートタグと呼ばれます
ヘッド：Webページのヘッドと呼ばれ、そのコンテンツは主にWebページのタグとブラウザが表示する情報を定義するために使用されます。
UTF-8：Webページの定義に使用されるエンコーディング標準、国際エンコーディング
タイトル：ウェブページのタイトルタグと呼ばれ、その中のコンテンツはブラウザタブに表示されます
本文：ウェブページの本体タグと呼ばれ、その中のコンテンツはブラウザの白いウィンドウ領域に表示されます
2.基本的なHTMLタグ
のHTMLタイトル
タイトル1
タイトル番号2
タイトル番号6
HTML段落
これは段落です
これは別の段落です
HTMLハイパーリンク
HTML
HTMLスペースとキャリッジリターン
私はテキストコンテナを保持するインライン要素です
3、さまざまなタイプを含むHTMLフォーム
Webページの携帯電話ユーザー入力データ：テキスト入力ボックス、ラジオボックス、チェックボックス、ドロップダウンボックス、送信ボタン
テキスト入力ボックス
firstname: <input type="text" name="fristname">
<br>
lastname: <input type="text" name="lastname">
パスワード入力ボックス
Password: <input type="password" name="pwd">
シングルボタン
<input type ='radio' name =“ sex” value =“ male”"/>男
女性
チェックボックス
読む
音楽を聴く
映画を見る
ドロップダウンボックス
北京上海広州深セン送信ボタン
送信ボタン：
02
一般的なCSSセレクターをよく理解してください
CSS：カスケードスタイルシートを指します
効果：
HTMLのフォントタグや色属性と同じように、HTML要素の表示方法を定義するために使用されます（HTML要素のスタイルを定義します）。
.cssファイルの場合、すべてのページのレイアウトと外観を変更するには、単純なCSSドキュメントを編集するだけで済みます。
セレクター：スタイルを変更するHTML要素を指定するために使用されます。各宣言は属性と値で構成されます
属性：設定するスタイル属性を表し、各属性には値があり、属性と値はコロンで区切られます
CSS：宣言は常にセミコロン（;）で終わり、宣言はHTMLドキュメントでは中括弧（{}）で囲まれ、スタイルはタグで定義できます。
CSSでは、セレクターは、スタイルを設定する必要のある要素を選択するために使用されるパターンです。
一般的に使用されるCSSセレクターは、IDセレクター、クラスセレクター、タグセレクター、属性セレクター、子孫セレクター、要素セレクターです。
1、IDセレクター
IDセレクターは、要素のid属性を介して要素を選択するためのものです。
CSSのIDセレクターは、「＃」で定義されます。例：#test
<head>
<meta charset="utf-8">
<title>CSS</title>
<style>
/*这是一个关于样式注释*/
</style>
「こんにちは世界」
id属性は、HTMLドキュメント全体で一意である必要があります
注：HTMLドキュメントは、id属性が一意であるかどうかを厳密に検証するわけではなく、非標準のHTMLドキュメントでIDが重複する可能性があります。
2.クラスセレクター
クラスセレクターは、要素のクラス属性（クラスセレクターとも呼ばれます）を使用して要素を選択します。クラスセレクターを使用する場合、要素にはクラス属性が必要です。
クラスセレクターは、要素のグループのスタイルを記述するために使用されます。クラスセレクターはIDセレクターとは異なります。クラスは、CSSのクラスセレクターに「。」を付けて複数の要素で定義できます（例：.center）。
<head>
<meta charset="UTF-8">
<title></title>
<style>
.center {text-align: center;}
.center {color: #8A2BE2;}
</style>
</head>
<body>
<p>居中</p>
</body>
3.タグセレクター
タグセレクターは、タグ名で要素を選択するためのもので、要素セレクターとも呼ばれます。
CSSのラベルセレクターは直接です：h、input
<head>
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
センタータイトル
2番目の段落