1
00:00:00,630 --> 00:00:04,510
このビデオでは、要素を選択する他の方法についていくつか説明します。

2
00:00:04,590 --> 00:00:07,530
これまで見た3つの主なもののほかに、

3
00:00:08,070 --> 00:00:11,790
 

4
00:00:14,790 --> 00:00:27,450
これらの3つを要約すると、要素セレクターのクラスとIDセレクターは要素がDot

5
00:00:27,450 --> 00:00:36,420
lowのようなAllyクラスのように見え、IDはアートやハッシュ記号であり、内部に置かれたものはIDまたはクラスまたはすべてを対象としますタイプの要素。

6
00:00:36,420 --> 00:00:37,780
 

7
00:00:37,800 --> 00:00:42,290
だから要素を選択するには3つの方法がありますが、もっと多くの方法があります。

8
00:00:42,660 --> 00:00:46,560
ここでは5つに焦点を当てるつもりですが、この5つは最も一般的に最も重要だと思うものです。

9
00:00:46,560 --> 00:00:47,310
 

10
00:00:47,460 --> 00:00:49,020
しかし、もっとたくさんあります。

11
00:00:49,230 --> 00:00:54,300
実際には私がリンクしているこの記事があり、Tutt's Plusの説明は無料の記事です。

12
00:00:54,330 --> 00:00:55,350
それは本当に素晴らしいです。

13
00:00:55,350 --> 00:01:00,990
あなたが覚えておかなければならない30のCSSAセレクターと呼ばれています。あなたが慌てる前に、これらを覚える必要はありません。

14
00:01:00,990 --> 00:01:01,710
 

15
00:01:01,920 --> 00:01:05,700
より重要なものや、私たちが常に使用するものを自然に覚えるでしょう。

16
00:01:05,910 --> 00:01:11,520
しかし、この記事のポイントは、あなたが知るべきである少なくとも30の良いものがあると言うことです。

17
00:01:11,910 --> 00:01:17,030
言いたいことは30だけ残っていることは言うまでもありませんが、まだそれはかなりのことです。

18
00:01:17,130 --> 00:01:20,980
この記事では、あなたが知る必要のないことが示唆されるほど多くのことがあります。

19
00:01:21,120 --> 00:01:23,590
ですから、これを行う方法はたくさんあります。

20
00:01:23,610 --> 00:01:28,680
この記事では30個をハイライトし、もっと重要なもののうち5個または6個を通過するつもりです。

21
00:01:28,680 --> 00:01:29,270
 

22
00:01:29,460 --> 00:01:31,300
だから私はあなたがこれを読んで与えることをお勧めします。

23
00:01:31,320 --> 00:01:36,960
次回のビデオでは、この記事で取り上げられていることのほか、ここで扱う内容とテキストエディタの内容についても説明します。

24
00:01:36,960 --> 00:01:40,340
 

25
00:01:40,770 --> 00:01:43,060
だから私は基本的なHMOを持っています。

26
00:01:43,470 --> 00:01:45,920
私はファイルを作成するプロセスを進めるつもりはありません。

27
00:01:45,960 --> 00:01:51,510
これは、必ずしもコード化する必要があるものではありませんが、H1がある場所では、彼を傷つける基本的なものです。

28
00:01:51,510 --> 00:01:55,190
 

29
00:01:55,650 --> 00:01:57,860
Googleには、Googleへのリンクがあります。

30
00:01:57,960 --> 00:02:00,190
私たちは3人の味方を持つULを持っています。

31
00:02:00,600 --> 00:02:07,350
 

32
00:02:07,350 --> 00:02:14,460
それから、私たちはHを持っていますし、3人の同盟国と別の4人、そしてもう1人は3人の同盟国となりますが、各同盟国は現在リンクを持ち、最初のものもこのリンクのようにGoogleに行きます。

33
00:02:14,460 --> 00:02:15,860
 

34
00:02:16,180 --> 00:02:19,540
それから、もう1人はFacebookに行き、最後の人はそれを読むようになります。

35
00:02:19,590 --> 00:02:20,650
簡単なマークアップ。

36
00:02:20,970 --> 00:02:23,520
そしてセレクタと呼ばれるスタイルシートがあります。

37
00:02:23,540 --> 00:02:30,510
SSここではRC

38
00:02:30,510 --> 00:02:38,360
SSを記入するつもりです。話すつもりの最初のものはD-Starセレクターと呼ばれ、アスタリスクが付いており、ページ上のすべてを選択します。

39
00:02:38,730 --> 00:02:43,930
だから、これは実際にそれをしばしばやりたいことではありませんが、このように見えます。

40
00:02:44,080 --> 00:02:47,930
そして、私たちが何をしても、実際にはすべての要素に適用されます。

41
00:02:48,750 --> 00:02:57,690
ですから、すべてのものに1ピクセルの明るい灰色の要素を与え、ページ上のすべての要素、つまりリンクごとにH-1というボディを見ることができます。

42
00:02:58,260 --> 00:03:02,800
 

43
00:03:02,960 --> 00:03:06,800
すべての人が国境を接するためにHの同盟国。

44
00:03:07,080 --> 00:03:11,260
だから、これはあなたがたくさんする必要があるものではありませんが、時々それを見るでしょう。

45
00:03:11,550 --> 00:03:17,970
次の1つはLechterの子孫です。この1つを使用して、いつでも見ることができます。

46
00:03:18,030 --> 00:03:24,390
だから、子孫セレクターの仕組みは、2つ以上のタグ名か2つ以上のセレクターを取り、それらを連鎖することです。

47
00:03:24,390 --> 00:03:27,150
 

48
00:03:27,150 --> 00:03:36,270
ですから、味方の内部にあるアンカータグをすべて選択したいのであれば、味方の中のアンカータグだけを選択したいのですが、アンカータグはそれだけで表示されます。

49
00:03:36,270 --> 00:03:41,350
 

50
00:03:41,580 --> 00:03:45,860
私は味方の子孫であるすべてのアンカータグを選択したいと思います。

51
00:03:46,170 --> 00:03:53,340
そうするためには、構文はAlly spaceのように見え、次にアンカータグのように見えます。

52
00:03:53,970 --> 00:03:59,590
だから、これは同盟国の中で年齢タグであるすべてを選択し、私たちはこれを続けることができます。

53
00:03:59,610 --> 00:04:05,640
もし私たちがそれ以上持っていれば、このようにこれを書き直すこともできます。これは、ULの内側にある味方のタグの中にあるすべてのタグです。私たちはここにありますが、それは冗長です。

54
00:04:05,700 --> 00:04:10,680
 

55
00:04:11,460 --> 00:04:16,440
そして、私はまた、すべてのアンカーがクラスHelloとすべてのことを言いました。

56
00:04:16,560 --> 00:04:20,070
同盟国の中には、それに合ったマークアップはありません。

57
00:04:20,070 --> 00:04:22,120
すべてのアンカータグは同盟国の内部にあるので。

58
00:04:22,350 --> 00:04:28,720
それに赤の色を付けてリフレッシュしましょう。

59
00:04:29,100 --> 00:04:32,460
これらの3つのアンカータグが赤色であることがわかります。

60
00:04:32,490 --> 00:04:34,690
これは変わらない。

61
00:04:35,580 --> 00:04:38,400
次は隣接するセレクタです。

62
00:04:38,970 --> 00:04:44,490
だから、隣接セレクタは、別の要素の後に来る要素を選択できるようになります。

63
00:04:44,490 --> 00:04:44,980
 

64
00:04:45,030 --> 00:04:49,910
このように内部に入れ子にされていないので、仲間は井戸に入れ子になっています。

65
00:04:50,100 --> 00:04:52,200
兄弟を選ぶことができます。

66
00:04:52,350 --> 00:05:01,140
だから、Hレベルの後に来るすべてのULSを選択するつもりです。

67
00:05:01,200 --> 00:05:07,380
フォークの内側ではなく、同じレベルのHにある兄弟の直後にインデントされていません。

68
00:05:07,380 --> 00:05:07,970
 

69
00:05:07,980 --> 00:05:11,410
これは隣接セレクタと呼ばれ、このように見えます。

70
00:05:11,670 --> 00:05:16,780
私たちはあなたに4歳をプラスすると言います。

71
00:05:16,890 --> 00:05:21,920
だから、これがなければ、私たちはすべて私たちの中にいるでしょう。

72
00:05:21,960 --> 00:05:24,810
私たちは4歳に隣接しています。

73
00:05:24,990 --> 00:05:33,330
そして、私はちょうど国境を与えるつもりだ、4つのピクセル固体赤を行うと私たちはこれらの2つのULが隣接しているのを見てください。

74
00:05:33,330 --> 00:05:34,080
 

75
00:05:34,080 --> 00:05:40,740
彼らは同じレベルでこの年齢4の後に来て、赤い国境を持っています。

76
00:05:40,920 --> 00:05:45,390
もう1つ、これを示したいと思います。これは本当に重要な属性セレクタです。

77
00:05:45,390 --> 00:05:46,170
 

78
00:05:46,410 --> 00:05:51,270
したがって、属性セレクタは、任意の属性に基づいて要素を選択する方法です。

79
00:05:51,660 --> 00:05:56,620
したがって、我々の場合、H ref属性に基づいて選択を行います。

80
00:05:56,970 --> 00:06:01,920
ここでは、HへのすべてのリンクをGoogleに向けることを確認します。 F. Googleドットコムです。

81
00:06:01,920 --> 00:06:07,350
 

82
00:06:07,350 --> 00:06:15,210
1つの色にするつもりですが、特定のソースのすべての画像や、すべてのチェックボックスやすべてのパスワードフィールドなどの特定のタイプのすべての入力を選択することもできます。

83
00:06:15,210 --> 00:06:23,250
したがって、構文ではアンカータグを入力し、次に角カッコを入力して、内部に探している属性を入力します。

84
00:06:23,250 --> 00:06:24,290
 

85
00:06:24,540 --> 00:06:32,850
トレフと同等であれば、Googleへのリンクを作成します。

86
00:06:32,850 --> 00:06:40,470
これは、これと等しいHGFを持つすべてのアンカータグを選択し、次にそれに色を付けて背景に青を付け、これら2つのリンクを見ることができます。

87
00:06:40,650 --> 00:06:41,580
 

88
00:06:44,240 --> 00:06:44,760
 

89
00:06:48,240 --> 00:06:50,530
 

90
00:06:50,520 --> 00:06:53,650
この最初のものはGoogleに、もう1つはGoogleに送られます。

91
00:06:53,820 --> 00:06:54,750
彼らは青です。

92
00:06:54,870 --> 00:06:57,270
しかし、他の2つのリンクはGoogleには行きません。

93
00:06:57,270 --> 00:06:59,340
彼らはFacebookに行き、それを読む。

94
00:06:59,340 --> 00:07:01,030
だから彼らは変わらない。

95
00:07:01,800 --> 00:07:10,680
 

96
00:07:10,680 --> 00:07:18,600
あなたはまた、実際にはこれを多く見たり、すべてのテキスト入力を異なったスタイルにしたい場合は入力タイプをテキストと同じにします。多くの異なる入力色の入力とファイルの写真とパスワードと電子メールと送信ボタンはすべて入力タグです。

97
00:07:19,110 --> 00:07:26,370
 

98
00:07:26,370 --> 00:07:30,170
 

99
00:07:30,420 --> 00:07:34,460
だから、入力で選択するだけで、私たちはすべての異なるタイプの入力を得ることになります。

100
00:07:34,500 --> 00:07:37,580
だから私たちはしばしばタイプによって選択します。

101
00:07:37,620 --> 00:07:42,680
それでは、Googleのrefセレクタに戻りましょう。

102
00:07:43,650 --> 00:07:48,170
ですからここで私がここで話したいのは、タイプの終わりとタイプの終わりの仕方が3〜5のような数字です。

103
00:07:48,270 --> 00:07:51,710
 

104
00:07:51,930 --> 00:07:55,710
そして、特定の要素のすべての終わりを選択します。

105
00:07:55,710 --> 00:08:06,540
だから、私が使うことができるページの5番目のdivまたは1番目の2番目の兄弟か5番目の10番目の段落を選択したい場合は、

106
00:08:06,570 --> 00:08:08,390
 

107
00:08:08,400 --> 00:08:15,120
この場合、Dronaは最終的なULを選択し、最終的に何かを行います。

108
00:08:15,130 --> 00:08:17,570
まあ、第3のもの。

109
00:08:18,210 --> 00:08:29,550
私はそれを別の国境や異なる背景を与えたいとしましょう。私はよくコロンとタイプの3つのような番号を選択します。

110
00:08:30,030 --> 00:08:33,410
 

111
00:08:33,860 --> 00:08:35,750
そして、私は背景を言うつもりです。

112
00:08:36,080 --> 00:08:45,030
紫色のような明白な背景を与えましょう。あなたはよく紫色になっています。

113
00:08:47,400 --> 00:08:51,420
これは、ページの何かを選択したい場合に便利です。

114
00:08:51,420 --> 00:08:59,700
私が注意しなければならないことの1つは、この作品が味方に行き、3度目の嘘を変えるということです。

115
00:08:59,790 --> 00:09:00,370
 

116
00:09:00,480 --> 00:09:04,120
私がそれをする前に、あなたはあなたが思うことが起こると想像して欲しい。

117
00:09:04,170 --> 00:09:08,160
だから、これは第三の味方を選ぶことになっています。

118
00:09:08,400 --> 00:09:10,960
それは私が推測しているこの1つだろう。

119
00:09:11,220 --> 00:09:15,170
しかし、それがリフレッシュされるにつれて、それは実際には3番目の嘘をすべて選択することがわかります

120
00:09:15,390 --> 00:09:19,620
だから、同盟国のすべてのグループから、それは第3のものを選択するつもりです。

121
00:09:20,210 --> 00:09:24,370
そしてもし私が束をもっと持っていたら。

122
00:09:26,520 --> 00:09:32,070
 

123
00:09:32,070 --> 00:09:39,180
 

124
00:09:39,210 --> 00:09:41,790
特定のグループの3番目のグループに似ていることに注意することは重要ですので、アスパラガスをもう一度選択してアスパラガスを選ぶのと同じように3番目にはないので、3番目のアスパラガスグループを選択することになります。

125
00:09:41,790 --> 00:09:48,690
しかし、偶数を選択する方法がありますので、他のすべての同盟国を選択してこのように紫色にすることができます

126
00:09:48,690 --> 00:09:50,370