1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:04,500 >> [音楽再生] 3 00:00:04,500 --> 00:00:10,099 4 00:00:10,099 --> 00:00:12,224 ALLISON BUCHHOLTZ-AU：だから 我々は基本的にはちょうどつもりだ 5 00:00:12,224 --> 00:00:14,629 あなたの荒廃を与えるために CSSの、私たちが知っているので 6 00:00:14,629 --> 00:00:16,420 それがカバーされていなかったことを すべてのセクションで。 7 00:00:16,420 --> 00:00:20,090 そして、私たちは本当に確認していることを確認したい みんな、あなたの処分で、このツールを持っている 8 00:00:20,090 --> 00:00:24,790 そのようにする能力を有するため あなたのウェブサイトは非常にきれいに見える。 9 00:00:24,790 --> 00:00:28,660 >> そして、あなたはその後、ウェブサイトを構築している場合 おそらくそれはかなり作りたい。 10 00:00:28,660 --> 00:00:31,372 私が意味する、あなたがする必要はありません、 が、私はそれをお勧めしたい。 （笑） 11 00:00:31,372 --> 00:00:35,430 あなたは、ユーザーがそれを使用したい場合は、かもしれない それは少し[聞こえない]にしたい。 12 00:00:35,430 --> 00:00:39,130 だから我々はあなたを試してみて、与えるつもりだ いくつかの基本的なツールと理解、 13 00:00:39,130 --> 00:00:42,340 そのため、あなたは外に出て、あなたがいるとき CSSについての事を研究し、 14 00:00:42,340 --> 00:00:45,902 それは完全なちんぷんかんぷんではありません、 CSSのように時々であると。 15 00:00:45,902 --> 00:00:47,240 >> TOMAS Reimersの：うん。 16 00:00:47,240 --> 00:00:49,930 アリソンはかなりよくそれを言った。 17 00:00:49,930 --> 00:00:53,250 だから私は最初に私達を推測 で始まる必要があり、CSSとは何かありますか？ 18 00:00:53,250 --> 00:00:55,750 だから、CSSは素晴らしいです。 19 00:00:55,750 --> 00:00:56,250 CSS-- 20 00:00:56,250 --> 00:00:58,320 >> ALLISON BUCHHOLTZ-AU：それは 私たちのゼミの名前。 21 00:00:58,320 --> 00:00:58,434 >> TOMAS Reimersの：うん。 22 00:00:58,434 --> 00:01:00,130 それは、その本当に重要です あなたはそれまでにそれを理解しています。 23 00:01:00,130 --> 00:01:03,090 あなただけの1を奪う場合 素晴らしいた場合の事は、それはそのCSSです。 24 00:01:03,090 --> 00:01:06,180 二つは、CSSの略です カスケードスタイルシート。 25 00:01:06,180 --> 00:01:10,380 だから、その中核に、CSSがある スタイルシートは、意味 26 00:01:10,380 --> 00:01:13,200 それはあなたがWebページのスタイルを設定することができます。 27 00:01:13,200 --> 00:01:16,609 そして、それが何を意味するのか、それはだ あなたのウェブサイトにスタイルを追加する方法。 28 00:01:16,609 --> 00:01:18,900 だからスタイルで、我々はすべてを意味する それではありませんstructural-- 29 00:01:18,900 --> 00:01:24,350 色、背景のようなものはそう 画像、ボーダー、のように、パディング、 30 00:01:24,350 --> 00:01:25,040 余白。 31 00:01:25,040 --> 00:01:27,310 私たちは何について話します すべてのことは少し意味する。 32 00:01:27,310 --> 00:01:30,110 >> だから我々はちょうど先に行ってきたと geditの中でそれらの最大の両方をオープンしました。 33 00:01:30,110 --> 00:01:32,680 だから、これはindex.HTMLをです。 34 00:01:32,680 --> 00:01:34,800 そして、これはmain.cssがある。 35 00:01:34,800 --> 00:01:36,829 だから、main.cssが何もしています。 36 00:01:36,829 --> 00:01:38,412 ALLISON BUCHHOLTZ-AU：今のところありませんスタイル。 37 00:01:38,412 --> 00:01:39,245 TOMAS Reimersの：なし。 38 00:01:39,245 --> 00:01:42,577 あなたが表示されますように、それはだ 本当に醜いサイト。 39 00:01:42,577 --> 00:01:44,160 ALLISON BUCHHOLTZ-AU：それはちょうど明白だ。 40 00:01:44,160 --> 00:01:45,820 TOMAS Reimersの：うん。 41 00:01:45,820 --> 00:01:49,150 ええ、それは、醜いではありません それだけでミニマリストです。 42 00:01:49,150 --> 00:01:53,430 そして、ここではindex.htmlを持っている。 43 00:01:53,430 --> 00:01:55,729 そしてそう迅速なため HTML、アリソンの要約、 44 00:01:55,729 --> 00:01:57,270 あなただけのページについての話をしたい？ 45 00:01:57,270 --> 00:01:58,395 >> ALLISON BUCHHOLTZ-AU：うん。 46 00:01:58,395 --> 00:02:01,100 だから、明らかに、私たちは私たちのHTMLを持っている タグ、名前だけのHTMLファイル。 47 00:02:01,100 --> 00:02:07,080 私たちは、CSSで、ここに私たちのヘッダを持っている 素晴らしさ、which--前に戻った場合。 48 00:02:07,080 --> 00:02:07,720 それはどこですか？ 49 00:02:07,720 --> 00:02:09,136 >> TOMAS Reimersの：ああ。 50 00:02:09,136 --> 00:02:10,301 ええ、あなたが見ることができます。 51 00:02:10,301 --> 00:02:12,092 ALLISON BUCHHOLTZ-AU： そして、ヘッダに気付く 52 00:02:12,092 --> 00:02:14,120 このタブヘッダは、右ここまでです。 53 00:02:14,120 --> 00:02:17,130 そして、 "こんにちは、世界！"ある 私たちはただ持っているテキスト 54 00:02:17,130 --> 00:02:19,620 ウェブ上で表示する 戻るis--ページ、。 55 00:02:19,620 --> 00:02:21,290 戻る。 56 00:02:21,290 --> 00:02:24,287 ちょうど私たちの体にどのです プレーンテキストをhere--。 57 00:02:24,287 --> 00:02:26,120 また、一つのことに 予告、あなたがここに見れば、 58 00:02:26,120 --> 00:02:29,410 トーマスは、これらを切り替える 私たちのスライドから2。 59 00:02:29,410 --> 00:02:32,035 だから、限り、あなたはすべて持っているように これらの3は、あなたがいいですよ。 60 00:02:32,035 --> 00:02:34,044 彼らは、彼らが好きな順序にすることができます。 61 00:02:34,044 --> 00:02:39,368 どのような最も重要なのはそういうことだ あなたはこれらの3つの事のそれぞれを持っている。 62 00:02:39,368 --> 00:02:40,340 >> TOMAS Reimersの：クール。 63 00:02:40,340 --> 00:02:41,111 ドキュメントの種類を追加しますか？ 64 00:02:41,111 --> 00:02:42,235 ALLISON BUCHHOLTZ-AU：うん。 65 00:02:42,235 --> 00:02:43,068 TOMAS Reimersの：うん。 66 00:02:43,068 --> 00:02:43,769 クール。 67 00:02:43,769 --> 00:02:46,102 ALLISON BUCHHOLTZ-AU：どうやら、 私のマイクは私を好きではない。 68 00:02:46,102 --> 00:02:49,650 TOMAS Reimersの：ああ、ちょうど私達に秒を与える アリソンは、彼女のマイクを切り替えるながら。 69 00:02:49,650 --> 00:02:50,500 そうそう。 70 00:02:50,500 --> 00:02:52,030 だから我々は我々のメインページを持っている。 71 00:02:52,030 --> 00:02:53,890 それはスタイルなしのようなものだ。 72 00:02:53,890 --> 00:02:54,780 我々は多くを持っていない。 73 00:02:54,780 --> 00:02:57,110 私達はちょうど基本的にテキストを持っている。 74 00:02:57,110 --> 00:02:59,470 私たちは、スタイルシートを持っている。 75 00:02:59,470 --> 00:03:00,220 我々はタイトルを持っている。 76 00:03:00,220 --> 00:03:04,020 だから裸の骨太 コンポーネントは、ウェブサイトを作る。 77 00:03:04,020 --> 00:03:08,880 >> だから、そこから、してみましょう CSSとは何かについて話す 78 00:03:08,880 --> 00:03:11,270 とそれがのように見え、すべてのこと。 79 00:03:11,270 --> 00:03:12,047 だからthat--用 80 00:03:12,047 --> 00:03:13,755 ALLISON BUCHHOLTZ-AU： バックスライドへ。 81 00:03:13,755 --> 00:03:15,200 TOMAS Reimersの：スライドに戻る。 82 00:03:15,200 --> 00:03:17,240 そして、アリソンは引き継ぐことができます。 83 00:03:17,240 --> 00:03:18,720 >> ALLISON BUCHHOLTZ-AU：ウー。 84 00:03:18,720 --> 00:03:19,220 OK。 85 00:03:19,220 --> 00:03:22,360 だからあなたのCSSファイルで、 あなたが必要があるとしている 86 00:03:22,360 --> 00:03:25,010 これらのものの多くは、セレクタと呼ばれる。 87 00:03:25,010 --> 00:03:27,420 それはちょうどになります あなたのCSSファイルの基礎。 88 00:03:27,420 --> 00:03:29,480 それはちょうどになるだろう たくさんのこれらの多く。 89 00:03:29,480 --> 00:03:30,780 だから、セレクタ。 90 00:03:30,780 --> 00:03:32,649 これは単に一般的な解剖学です。 91 00:03:32,649 --> 00:03:35,190 私たちは、通過するつもりだ 例、もし君たちは決して理由 92 00:03:35,190 --> 00:03:38,400 私が感じる、私のセクションを見て 抽象的で物事のような 93 00:03:38,400 --> 00:03:39,400 本当に意味がありません。 94 00:03:39,400 --> 00:03:41,110 それは、常に例を参照するのに役立ちます。 95 00:03:41,110 --> 00:03:42,420 >> だから我々はいくつかのセレクタを持っている。 96 00:03:42,420 --> 00:03:49,120 それはのためにいくつかの識別子になるだろう 我々は、スタイルが適用したいもの。 97 00:03:49,120 --> 00:03:52,220 そして、我々は、いずれかを有することができる ルールと値のセット。 98 00:03:52,220 --> 00:03:55,680 あなたが表示される場合がありますので、セレクタ 体のようなものかもしれませんが、 99 00:03:55,680 --> 00:04:00,262 またはPとの段落、 またはヘッダー、または何、 100 00:04:00,262 --> 00:04:02,000 何でも、あなたのHTMLタグになりたい。 101 00:04:02,000 --> 00:04:03,570 >> したがって、この場合には、本体を有している。 102 00:04:03,570 --> 00:04:06,985 そして、我々はいくつかのルールを持っている、 これは、この対応 103 00:04:06,985 --> 00:04:09,610 あなたのスタイルが適用されるものに。 104 00:04:09,610 --> 00:04:12,720 したがって、この場合には、我々は 背景色とフォント重量。 105 00:04:12,720 --> 00:04:16,200 だから、これは変更する予定です 何の背景 106 00:04:16,200 --> 00:04:19,640 私たちのHTMLファイルのいずれかのbodyタグ内。 107 00:04:19,640 --> 00:04:22,810 そして、それは与えるために起こっている それこのライトブルー値。 108 00:04:22,810 --> 00:04:24,820 >> だから、作るために起こっている 背景水色。 109 00:04:24,820 --> 00:04:28,660 そして、本体内のものがある ボールドフォントの太さを持っているつもり。 110 00:04:28,660 --> 00:04:31,142 だから、それだけに起こっている 私たちのすべてのテキストを太字。 111 00:04:31,142 --> 00:04:32,970 そして、これはただ1つのセレクタである。 112 00:04:32,970 --> 00:04:34,680 しかし、あなたはこれらの非常に多くの可能性があります。 113 00:04:34,680 --> 00:04:38,730 そして、我々は表示するようになるだろうとして、 後で、もう少しどのように 114 00:04:38,730 --> 00:04:40,709 それが動作し、そこより多くの例。 115 00:04:40,709 --> 00:04:41,750 追加するには？ 116 00:04:41,750 --> 00:04:42,499 >> TOMAS Reimersの：いいえ。 117 00:04:42,499 --> 00:04:43,500 アリソンはそれを得た。 118 00:04:43,500 --> 00:04:46,144 私達はちょうどカットアップするつもりだ ここに私たちの例サイトの例。 119 00:04:46,144 --> 00:04:47,310 それでは、実際にこれをみましょう。 120 00:04:47,310 --> 00:04:48,620 それは完璧だ。 121 00:04:48,620 --> 00:04:54,460 だから、僕はコピー＆ペーストするつもりです 私たちのmain.cssファイルにその権利。 122 00:04:54,460 --> 00:04:56,530 そして、私はそれを保存するつもりです。 123 00:04:56,530 --> 00:04:59,190 そして、我々はそれを実行します。 124 00:04:59,190 --> 00:05:01,600 だから、サイドノート、の1 最もイライラするもの 125 00:05:01,600 --> 00:05:04,490 ファイルを保存しない場合で、 あなたは、のように、ページをリロードし、 126 00:05:04,490 --> 00:05:07,450 などが、理由はない 変更が起こっている？ 127 00:05:07,450 --> 00:05:07,950 それが起こる。 128 00:05:07,950 --> 00:05:14,230 そこでここでは私達が私達を作ったことを見た ライトブルーの背景ウェブサイト 129 00:05:14,230 --> 00:05:16,560 といくつかの太字のテキスト。 130 00:05:16,560 --> 00:05:20,730 >> あなた場合、私はまた、言及する必要があります 人は何か疑問を持っている 131 00:05:20,730 --> 00:05:23,622 我々がやっている、感じてください 私たちを停止し、私たちを尋ねること自由に。 132 00:05:23,622 --> 00:05:25,330 私たちは完全に喜んでいる フィールドの質問へ。 133 00:05:25,330 --> 00:05:27,951 134 00:05:27,951 --> 00:05:31,930 >> ALLISON BUCHHOLTZ-AU：明らかに、と CSSは、すべてがそれ自体の上に構築されています。 135 00:05:31,930 --> 00:05:34,107 一つのことにはないのであれば 今意味が、我々 136 00:05:34,107 --> 00:05:35,690 それが後であなたを行き詰まらしたくない。 137 00:05:35,690 --> 00:05:38,390 138 00:05:38,390 --> 00:05:41,930 >> TOMAS Reimersの：だからしてみましょう 種類のこのを分析。 139 00:05:41,930 --> 00:05:44,210 だから、開始しますか ここでセレクタと？ 140 00:05:44,210 --> 00:05:45,979 >> ALLISON BUCHHOLTZ-AU：うん。 141 00:05:45,979 --> 00:05:48,270 私が前に言っていたとおり、ボディ ちょうど私たちのセレクタはこちらです。 142 00:05:48,270 --> 00:05:50,950 だから私たちは私たちのindex--ああに戻っオーバー行けば。 143 00:05:50,950 --> 00:05:53,245 >> TOMAS Reimersの：私はちょうど閉じた。 144 00:05:53,245 --> 00:05:54,530 私に第二を与えます。 145 00:05:54,530 --> 00:05:58,286 だから、オープン、index.htmlをファイル。 146 00:05:58,286 --> 00:05:59,410 ALLISON BUCHHOLTZ-AU：クール。 147 00:05:59,410 --> 00:06:02,710 ですから、ここに気づいた場合、我々 これらのボディタグを持っている、右？ 148 00:06:02,710 --> 00:06:06,270 だから、セレクタはちょうどに対応 我々が話しているタグ。 149 00:06:06,270 --> 00:06:07,670 右ここにボディだから。 150 00:06:07,670 --> 00:06:10,315 だから我々は何であるかを言っている everything--我々は戻って行くことができますか？ 151 00:06:10,315 --> 00:06:12,065 私はちょうどことがしたい のような画面をタッチします。 152 00:06:12,065 --> 00:06:14,410 それはそんなにクーラーになるだろう。 153 00:06:14,410 --> 00:06:17,150 >> それらの中でそのように何でも 我々が見たbodyタグ、 154 00:06:17,150 --> 00:06:19,637 テキスト、のように、ちょうどだった、 そして、一般的にボディ 155 00:06:19,637 --> 00:06:20,970 背景のようにいう。 156 00:06:20,970 --> 00:06:22,720 あなたは今までにしたい場合 背景を変更、 157 00:06:22,720 --> 00:06:25,090 つまり、bodyタグ内になるだろう。 158 00:06:25,090 --> 00:06:27,120 ちょうどそれらに適用されるこれらのルールを持っています。 159 00:06:27,120 --> 00:06:32,040 >> だから我々はに行くした場合 、実際にindex.htmlをand-- 160 00:06:32,040 --> 00:06:33,840 私たちは何かを持つことができます 体外？ 161 00:06:33,840 --> 00:06:37,340 我々が持っていた場合は、同様に、フッタまたは 何か、これに適用されない。 162 00:06:37,340 --> 00:06:40,900 しかし、中には何も これらのボディタグが起こっている 163 00:06:40,900 --> 00:06:44,960 この体によって影響される 私たちが作ったセレクタ。 164 00:06:44,960 --> 00:06:47,405 だから、あなたが入力した場合 何か他のものthere-- 165 00:06:47,405 --> 00:06:49,400 >> TOMAS Reimersのは：のは、その家をドライブしてみましょう。 166 00:06:49,400 --> 00:06:55,330 だから、ですので、我々はdiv--があった場合 あなたが持つことができるだけで、別のタグ。 167 00:06:55,330 --> 00:06:56,350 私はそれを閉じますつもりです。 168 00:06:56,350 --> 00:06:58,280 またはのは、この段落してみましょう。 169 00:06:58,280 --> 00:07:01,430 だから、pは段落の略です。 170 00:07:01,430 --> 00:07:02,560 そして、その段落内。 171 00:07:02,560 --> 00:07:05,650 そして私は「これはテキストです。」と言う 172 00:07:05,650 --> 00:07:06,369 クール。 173 00:07:06,369 --> 00:07:09,160 そして私は、このルールが適用した 代わりにボディの段落。 174 00:07:09,160 --> 00:07:12,390 175 00:07:12,390 --> 00:07:17,320 あなたはそれが唯一に適用される方法を見ていきます 新たに形成された段落、右 176 00:07:17,320 --> 00:07:18,892 全体ではなく事。 177 00:07:18,892 --> 00:07:20,090 それは理にかなっていますか？ 178 00:07:20,090 --> 00:07:21,840 >> ALLISON BUCHHOLTZ-AU： だから、これはすべての体であり、 179 00:07:21,840 --> 00:07:24,450 しかし、今私たちのセレクタだけ 段落に対応している。 180 00:07:24,450 --> 00:07:27,050 だから我々はちょうど大胆と青を持っている この特定のパラグラフのために、 181 00:07:27,050 --> 00:07:30,760 これが唯一のものであるため、 そのはpタグで囲まれている。 182 00:07:30,760 --> 00:07:35,349 >> TOMAS Reimersの：ないソート意味をなす 物事が他のものをカプセル化する方法の？ 183 00:07:35,349 --> 00:07:38,140 ALLISON BUCHHOLTZ-AU：また、ちょうど 最善の方法の一つ、のように、言って 184 00:07:38,140 --> 00:07:40,889 本当にCSSに慣れて取得する ちょうどこのようなことを行うことです、 185 00:07:40,889 --> 00:07:42,050 ちょうどそれを試してみてください。 186 00:07:42,050 --> 00:07:46,700 それは何かを入力することは非常に簡単です アウト、最新の情報に更新をヒットし、何が起こるかを参照してください。 187 00:07:46,700 --> 00:07:48,940 そして、ほとんどのCSと同様に、 実験は、多くの場合することができます 188 00:07:48,940 --> 00:07:51,790 はるかに良いにつながる 直感的な理解。 189 00:07:51,790 --> 00:07:54,432 それ以上に私たちよりちょうど、 あなたに話し、のような。 190 00:07:54,432 --> 00:07:58,350 >> TOMAS Reimersの：絶対に 100％が、その点については同意します。 191 00:07:58,350 --> 00:08:02,430 我々は戻って、これに行けばそれでは、始めましょう これら二つが何まさに解剖。 192 00:08:02,430 --> 00:08:04,550 だから我々は、この上に2つのルールがあります。 193 00:08:04,550 --> 00:08:07,420 したがって、最初の一つの背景色である。 194 00:08:07,420 --> 00:08:10,590 そして、あなたは私たちがそれを設定したことを参照してください。 値、水色に等しい。 195 00:08:10,590 --> 00:08:15,009 >> だから、CSSで、CSSはソートです 方法についての非常に緩い 196 00:08:15,009 --> 00:08:16,300 あなたは色を定義することが許可されています。 197 00:08:16,300 --> 00:08:17,800 だから、名前でそれらを定義することができます。 198 00:08:17,800 --> 00:08:20,650 また、のような何かを行うことができ、「赤」 199 00:08:20,650 --> 00:08:25,270 そして、私たちはこれに戻った後も、 あなたは背景が赤であることがわかります。 200 00:08:25,270 --> 00:08:29,040 また、私はあなたを思うreally--得ることができます これでかなり創造的な取得することができ、 201 00:08:29,040 --> 00:08:29,540 あなたがすることはできません？ 202 00:08:29,540 --> 00:08:31,170 >> ALLISON BUCHHOLTZ-AU：I あなたが進を使うことができると思います。 203 00:08:31,170 --> 00:08:31,250 あなたことができませんか？ 204 00:08:31,250 --> 00:08:32,083 >> TOMAS Reimersの：うん。 205 00:08:32,083 --> 00:08:32,969 だから、六角を使用することができます。 206 00:08:32,969 --> 00:08:34,490 しかし、私は名前ワイズ考えています。 207 00:08:34,490 --> 00:08:35,385 そこではないか？ 208 00:08:35,385 --> 00:08:37,260 ALLISON BUCHHOLTZ-AU： あなたはかなりの数を行うことができます。 209 00:08:37,260 --> 00:08:43,350 ほとんどの色のような、かなりそのあなた のようにname--でき、私は鮭が一つだと思います。 210 00:08:43,350 --> 00:08:45,322 >> TOMAS Reimersの：私たちはつもりのtryサーモンだ。 211 00:08:45,322 --> 00:08:47,530 ALLISON BUCHHOLTZ-AU：I シャルトルーズがそこにあると思います。 212 00:08:47,530 --> 00:08:48,050 TOMAS Reimersの：うん。 213 00:08:48,050 --> 00:08:48,550 参照してください？ 214 00:08:48,550 --> 00:08:50,080 だから、かなり創造的な取得することができます。 215 00:08:50,080 --> 00:08:52,246 >> ALLISON BUCHHOLTZ-AU：あなた かなり創造的得ることができる。 216 00:08:52,246 --> 00:08:55,750 同様に、あなたが考えることができる場合 色名は、それがそこにおそらく。 217 00:08:55,750 --> 00:08:57,840 あなたが本当に細かいたい場合 詳細は、ヘックスに行くことができます。 218 00:08:57,840 --> 00:08:58,673 >> TOMAS Reimersの：うん。 219 00:08:58,673 --> 00:08:59,390 だから、進。 220 00:08:59,390 --> 00:09:05,280 あなたたちは、このバックを覚えている場合は 古いPSETから、イメージ回復、 221 00:09:05,280 --> 00:09:08,300 あなたたちは、対処しなければならなかった これらの進値を持つ。 222 00:09:08,300 --> 00:09:15,280 そして、ソートのことが何であるかを要約すると、 六角はそれに格納されている3つの値があります。 223 00:09:15,280 --> 00:09:17,250 だから、2ずつのグループであります。 224 00:09:17,250 --> 00:09:19,300 最初の二つは赤の値を表します。 225 00:09:19,300 --> 00:09:22,420 もう一つは表し 緑の値。 226 00:09:22,420 --> 00:09:25,020 そして、最後の1は青です？ 227 00:09:25,020 --> 00:09:30,050 >> だから、FFは表現するために起こる 進255。 228 00:09:30,050 --> 00:09:35,480 だから、255赤、255を持っている 緑、および青の0。 229 00:09:35,480 --> 00:09:37,670 と値は0から255の範囲である。 230 00:09:37,670 --> 00:09:38,350 >> 聴衆：右。 231 00:09:38,350 --> 00:09:41,472 だから、基本的に、私たちは検索できます 私たちが望む任意の色のために、インターネット、 232 00:09:41,472 --> 00:09:43,912 そして実際に知られてを識別 カラースペクトルコンボ、 233 00:09:43,912 --> 00:09:45,130 その後、我々はそれを置くことができる？ 234 00:09:45,130 --> 00:09:46,380 ALLISON BUCHHOLTZ-AU：その通り。 235 00:09:46,380 --> 00:09:52,900 だから、ほとんど完全な制御を持っている 色の上には、CSS内で欲しい。 236 00:09:52,900 --> 00:09:55,069 我々はについて話をするつもりですか 背景画像後で？ 237 00:09:55,069 --> 00:09:56,110 それとも私たちはそれをしたいですか？ 238 00:09:56,110 --> 00:09:56,240 >> TOMAS Reimersの：うん。 239 00:09:56,240 --> 00:09:57,010 絶対に。 240 00:09:57,010 --> 00:10:00,830 ちょうどことを示すこと、したがって、最初の 赤と緑は黄色です。 241 00:10:00,830 --> 00:10:03,120 そして、あなたは、いくつかが必要な場合 このを見つける助け、あなた 242 00:10:03,120 --> 00:10:05,575 Googleの何かをすることができます 「カラーピッカー。」のように 243 00:10:05,575 --> 00:10:07,200 ALLISON BUCHHOLTZ-AU：ああ、それはとても良いことだ。 244 00:10:07,200 --> 00:10:09,090 私は、カラーピッカーが大好きです。 245 00:10:09,090 --> 00:10:11,360 >> TOMAS Reimersの：colorpicker.com 良い例です。 246 00:10:11,360 --> 00:10:14,580 そしてここで、あなたが持っていることがわかります フルPhotoshopのようなカラーピッカー。 247 00:10:14,580 --> 00:10:14,920 >> ALLISON BUCHHOLTZ-AU：MM-HM。 248 00:10:14,920 --> 00:10:16,980 また、クールなものはあなたです カラースキームを生成することができます 249 00:10:16,980 --> 00:10:18,896 あなたが持っていないように、 のように、色を衝突。 250 00:10:18,896 --> 00:10:22,780 TOMAS Reimersの：そして、 ここでは、ここ16進値アップです。 251 00:10:22,780 --> 00:10:27,800 だから、常に基本的にオンラインで見つけることができます から進値を取得するための場所。 252 00:10:27,800 --> 00:10:31,667 それは、のように、単にソートすることの私達ではありません 数字で世界の色を見る。 253 00:10:31,667 --> 00:10:34,000 それは我々がオンラインで行くことがよりだ そして、私たちが欲しいものを色見つける 254 00:10:34,000 --> 00:10:36,850 その後数をダウン。 255 00:10:36,850 --> 00:10:39,590 それは本当に簡単なので CSで物事を参照する方法。 256 00:10:39,590 --> 00:10:40,350 >> ALLISON BUCHHOLTZ-AU： そしてalso--あります 257 00:10:40,350 --> 00:10:41,630 私は、サイトの正確な名前を忘れてしまった。 258 00:10:41,630 --> 00:10:43,838 しかし、私は、間違いなくあります 、アドビシステムズ社から何かを考える 259 00:10:43,838 --> 00:10:48,350 それはあなたのためのカラースキームを生成し、 これは、本当にクールですあなたなぜなら 260 00:10:48,350 --> 00:10:50,580 それは時々だdefinitely-- 把握するのは難しい、 261 00:10:50,580 --> 00:10:53,729 ああ、私はこの色を使用したい場合は、 何別の有用な1かもしれない 262 00:10:53,729 --> 00:10:56,395 に自分のサイト上の他の場所に使用するには、 のような、それはいいと凝集する。 263 00:10:56,395 --> 00:11:00,430 264 00:11:00,430 --> 00:11:04,260 >> TOMAS Reimersの：アリソンのが何について話 アドビによる1は、私が思う、Kulerのと呼ばれる。 265 00:11:04,260 --> 00:11:04,885 これは、K-U-L-E-Rです。 266 00:11:04,885 --> 00:11:06,259 ALLISON BUCHHOLTZ-AU：私はそう思う。 267 00:11:06,259 --> 00:11:07,610 私はそれは一つだかなり確信している。 268 00:11:07,610 --> 00:11:11,050 >> TOMAS Reimersの：私のお気に入りが持っている 常にカラースキームデザイナーなって。 269 00:11:11,050 --> 00:11:13,998 >> ALLISON BUCHHOLTZ-AU：ああ。 270 00:11:13,998 --> 00:11:16,010 >> TOMAS Reimersの：now--です 271 00:11:16,010 --> 00:11:16,860 >> ALLISON BUCHHOLTZ-AU： ああ、これは美しいです。 272 00:11:16,860 --> 00:11:18,818 >> TOMAS Reimersの：そして、あなた 基本的には、のように、言うことができます 273 00:11:18,818 --> 00:11:21,700 Iは、互いに3色次たい。 274 00:11:21,700 --> 00:11:25,030 そしてのはいい何かをやらせる。 275 00:11:25,030 --> 00:11:29,210 そして、あなたは一例を得ることができます それがどのように見えるかの。 276 00:11:29,210 --> 00:11:32,470 そして、あなたは、任意の上にマウスを移動した場合 彼らは、それはあなたの進値を与える。 277 00:11:32,470 --> 00:11:35,010 >> だから開始するには良い方法として、 カラースキームを考える 278 00:11:35,010 --> 00:11:39,570 またはウェブサイトでどのような色 一緒にうまく行くかもしれない。 279 00:11:39,570 --> 00:11:45,655 それは驚くほど可能性があるため あなたが思うほど簡単ではありませピックアップする。 280 00:11:45,655 --> 00:11:48,280 そして、他のクールなもの 私はいつもこのサイトについて見つけた 281 00:11:48,280 --> 00:11:51,480 あなたが例にヒットした場合、それはよです 何例のウェブサイトを表示 282 00:11:51,480 --> 00:11:54,800 そのカラースキームを使用してのようになります。 283 00:11:54,800 --> 00:11:56,270 とにかく。 284 00:11:56,270 --> 00:11:57,863 >> 戻る実際のCSSに。 285 00:11:57,863 --> 00:12:01,112 ALLISON BUCHHOLTZ-AU：しかし、明らかに、我々 これらの参照は役に立つかもしれません知っている。 286 00:12:01,112 --> 00:12:03,195 TOMAS Reimersの：いいえ、彼ら 間違いなく役立ちます。 287 00:12:03,195 --> 00:12:04,720 だから、二番目のルール、アリソン？ 288 00:12:04,720 --> 00:12:05,844 >> ALLISON BUCHHOLTZ-AU：うん。 289 00:12:05,844 --> 00:12:08,280 二番目のルールはただである 我々のフォントに対応する。 290 00:12:08,280 --> 00:12:11,520 だから、フォントの太さはちょうど一種である of--ので重量はでしょう 291 00:12:11,520 --> 00:12:15,220 あなたのような、ちょうどしたい場合も、 正常または、シンナーフォント、のような、 292 00:12:15,220 --> 00:12:17,251 あるいは、この場合、太字、等。 293 00:12:17,251 --> 00:12:17,750 私は忘れる。 294 00:12:17,750 --> 00:12:21,557 あなたがしたい場合it--がある何 通常の、のような、単によりも薄い1？ 295 00:12:21,557 --> 00:12:24,140 TOMAS Reimersの：私は実際にはない シンナー1があるかどうか知っている。 296 00:12:24,140 --> 00:12:24,680 ALLISON BUCHHOLTZ-AU：私は忘れている。 297 00:12:24,680 --> 00:12:26,300 だから、フォント重量一般的に我々 ちょうど大胆に使用。 298 00:12:26,300 --> 00:12:29,010 あなたがに本当に取得したい場合 それは、私たちはあなたを表示するつもりだ。 299 00:12:29,010 --> 00:12:34,317 W3Schoolsのは、すべての異なるを持って あなたがフォントのためにできること。 300 00:12:34,317 --> 00:12:36,900 しかし、基本的に、あなたがしたい場合 フォントについては何も変更するには、 301 00:12:36,900 --> 00:12:39,330 それは常にになるだろう、 フォント何か、などである。 302 00:12:39,330 --> 00:12:43,450 あなたがしているのであれば、それは、フォントファミリのようになるだろう 実際の型を変更しよう。 303 00:12:43,450 --> 00:12:47,390 それはあなたの場合、フォント·スタイルになるでしょう 筆記体のようにそれを作りたい、 304 00:12:47,390 --> 00:12:49,710 や斜体、またはその他もろもろ。 305 00:12:49,710 --> 00:12:53,570 あるいは、フォント色、場合 我々はそれを変更するようだった。 306 00:12:53,570 --> 00:12:55,621 >> TOMAS Reimersの：うん。 307 00:12:55,621 --> 00:12:56,925 だから、それを変更することができます。 308 00:12:56,925 --> 00:12:59,360 そして、ソートのちょうどに 今要約、あなたができるので、 309 00:12:59,360 --> 00:13:01,400 私たちはここにセレクタを持っていることがわかります。 310 00:13:01,400 --> 00:13:03,000 我々は、これらの中括弧を持っている。 311 00:13:03,000 --> 00:13:06,735 そして、我々はルールがあります セミコロンで区切られた。 312 00:13:06,735 --> 00:13:08,100 それは理にかなっていますか？ 313 00:13:08,100 --> 00:13:09,130 うん？ 314 00:13:09,130 --> 00:13:10,500 クール。 315 00:13:10,500 --> 00:13:13,200 だから、good--ある場合 316 00:13:13,200 --> 00:13:14,424 >> ALLISON BUCHHOLTZ-AU：バック。 317 00:13:14,424 --> 00:13:17,590 TOMAS Reimersの：のは、具体的に話をしましょう 我々が持っているセレクタの種類を約。 318 00:13:17,590 --> 00:13:19,790 「今、私たちがした原因 ちょうど示すタグの一種。 319 00:13:19,790 --> 00:13:21,696 しかし、あなたたちはそれがもっともらしい見ることができました。 320 00:13:21,696 --> 00:13:23,570 次の2つの段落を持っていると言う ページ上のあなた 321 00:13:23,570 --> 00:13:26,087 スタイルにできるようにしたい 1が、他のではない、 322 00:13:26,087 --> 00:13:29,170 あなただけの自分を制限しない 別の実際のHTMLを使用する必要がありますする 323 00:13:29,170 --> 00:13:33,410 タグは、それらに異なるスタイルを得た。 324 00:13:33,410 --> 00:13:35,995 >> だから我々は、3つの基本的なを持っている セレクタの種類。 325 00:13:35,995 --> 00:13:37,120 ALLISON BUCHHOLTZ-AU：うん。 326 00:13:37,120 --> 00:13:39,828 だから我々は何であるタグを持っている 私たちは、今の話をしてきました。 327 00:13:39,828 --> 00:13:42,430 だから、一種のあなたの体またはpのようなものだ。 328 00:13:42,430 --> 00:13:46,280 そして、我々はある、クラスを持っている 我々はCSSファイルでそれを定義するときに、 329 00:13:46,280 --> 00:13:49,907 それは常にドットになるだろう、何でも あなたはあなたのクラスの名前になりたい。 330 00:13:49,907 --> 00:13:51,490 そして、これは複数のものに適用することができます。 331 00:13:51,490 --> 00:13:54,610 332 00:13:54,610 --> 00:13:57,610 >> あなたが5段落があるとし それらの3の2 333 00:13:57,610 --> 00:14:00,580 同じスタイルをする必要がある、 あなたはそれにクラスを適用する。 334 00:14:00,580 --> 00:14:03,040 そして、これは私たちがそれを行うだけの方法です。 335 00:14:03,040 --> 00:14:05,600 私たちはあなたの例をあげる どこにこれは実際に表示されます。 336 00:14:05,600 --> 00:14:11,030 しかし、あなたはおそらくいくつかのタグを持っていた場合 pは、それの後に、次のように記述し、 337 00:14:11,030 --> 00:14:14,170 クラスは、どんなクラスに等しい あなたはそれに適用する。 338 00:14:14,170 --> 00:14:19,280 私たちが望むので、どんなクラスセレクタ この特定の段落に適用する、 339 00:14:19,280 --> 00:14:21,300 私たちは次のように書くことができます。 340 00:14:21,300 --> 00:14:24,080 もちろん、私は例を考える それがはるか​​に具体的なようになります。 341 00:14:24,080 --> 00:14:27,270 >> 私たちが持っている他の1 私たちが示してidは、ある 342 00:14:27,270 --> 00:14:29,707 ハッシュ、またはシャープ、またはハッシュタグ付き。 343 00:14:29,707 --> 00:14:30,790 TOMAS Reimersの：シャープ。 344 00:14:30,790 --> 00:14:32,430 ALLISON BUCHHOLTZ-AU：シャープ。 345 00:14:32,430 --> 00:14:34,550 それも、動作します。 346 00:14:34,550 --> 00:14:36,640 そして、これは本当にユニークである必要があります。 347 00:14:36,640 --> 00:14:39,880 彼らは唯一に適用する必要があります あなたのページ上の一つのこと。 348 00:14:39,880 --> 00:14:43,820 それは特定の段落のかどうかそう、 またはいくつかのリスト内の項目、または何でも、 349 00:14:43,820 --> 00:14:45,090 これは一意である必要があります。 350 00:14:45,090 --> 00:14:48,730 そして、我々はちょうど同じように 、と言うような、クラス= "クラス1クラス2、" 351 00:14:48,730 --> 00:14:51,577 これはちょうど私達が持っている何でものIDを指定することもできます。 352 00:14:51,577 --> 00:14:52,410 TOMAS Reimersの：うん。 353 00:14:52,410 --> 00:14:54,330 それでは、間違いなく話をしましょう ここでの例について。 354 00:14:54,330 --> 00:14:58,170 そして私はちょうど潜るするつもりです バックストレートコードに。 355 00:14:58,170 --> 00:15:02,090 それでは、私たちのHTMLを見てみましょう。 356 00:15:02,090 --> 00:15:03,960 そして、私たちは今、1段落を持っている。 357 00:15:03,960 --> 00:15:05,510 これはテキストです。 358 00:15:05,510 --> 00:15:09,151 私はちょうど、変更するつもりです それ。 「これは、テキスト1です。 " 359 00:15:09,151 --> 00:15:11,150 そして、我々はするつもりだ 持っている "これは、テキスト2です。" 360 00:15:11,150 --> 00:15:12,525 >> ALLISON BUCHHOLTZ-AU：第二1。 361 00:15:12,525 --> 00:15:13,540 TOMAS Reimersの：うん。 362 00:15:13,540 --> 00:15:16,810 だから我々が今持っている右の "これは、テキスト2は、ある"？ 363 00:15:16,810 --> 00:15:21,560 そして、我々は我々がリロードした場合ことを確認するつもりだ 我々は見つけるつもりだ何ページ、 364 00:15:21,560 --> 00:15:23,067 我々はつもりですfind-- 365 00:15:23,067 --> 00:15:24,150 ALLISON BUCHHOLTZ-AU：ああ。 366 00:15:24,150 --> 00:15:24,983 TOMAS Reimersの：うん。 367 00:15:24,983 --> 00:15:27,570 私たちは、「これはです見つけるつもりだ テキスト1」、および「この」は、テキストの2である。 368 00:15:27,570 --> 00:15:28,650 >> ALLISON BUCHHOLTZ-AU：そして、 美しい黄色から。 369 00:15:28,650 --> 00:15:31,066 >> TOMAS Reimersの：そして、あなたが表示されます 今、私たちのセレクタこと、 370 00:15:31,066 --> 00:15:34,940 これ、pのに適用される、または 段落は、それらの両方に影響し、 371 00:15:34,940 --> 00:15:38,700 それらの両方を満たすため、 彼らは両方のpタグだという条件。 372 00:15:38,700 --> 00:15:40,360 つまり、全体の意味があります。 373 00:15:40,360 --> 00:15:43,340 そこで問題は、何も、である 私たちは、1つを取得したい場合は？ 374 00:15:43,340 --> 00:15:46,350 だから、正確にアリソンが言っていたように、 我々はそれを行うには他の二つの方法があります。 375 00:15:46,350 --> 00:15:47,320 私は、IDで始めるつもりだ。 376 00:15:47,320 --> 00:15:48,405 >> ALLISON BUCHHOLTZ-AU： のは、IDから始めましょう。 377 00:15:48,405 --> 00:15:50,405 >> TOMAS Reimersの：そして両方 これらの属性である。 378 00:15:50,405 --> 00:15:53,200 だから、属性は、HTML内に存在する。 379 00:15:53,200 --> 00:15:55,600 そして、彼らは何をされている 追加何か 380 00:15:55,600 --> 00:15:58,840 あるタグ内 タグ名とは別。 381 00:15:58,840 --> 00:16:01,301 ですから、複数の属性を持つことができます。 382 00:16:01,301 --> 00:16:01,800 うん？ 383 00:16:01,800 --> 00:16:03,950 >> ALLISON BUCHHOLTZ-AU：私はちょうどつもりだった あなたの例からPSET 7から、と言って、 384 00:16:03,950 --> 00:16:06,650 あなたのいずれかが整列するようにしようとした場合 中心部への物事、 385 00:16:06,650 --> 00:16:08,550 あなたが使用している可能性があります 「テキスト=中央に合わせます。」 386 00:16:08,550 --> 00:16:10,550 そして、あなたはおそらくそれに気づいた 集中している必要があります 387 00:16:10,550 --> 00:16:12,650 あなたのテキストやあなたのナビゲーションバー。 388 00:16:12,650 --> 00:16:15,499 だから、ただ、属性だ あなたが精通している可能性があること。 389 00:16:15,499 --> 00:16:18,040 TOMAS Reimersのは：たくさんあり​​ます あなたが表示されます属性の。 390 00:16:18,040 --> 00:16:18,539 うん。 391 00:16:18,539 --> 00:16:21,250 PSET 7への適切な参照のように。 392 00:16:21,250 --> 00:16:23,150 私たちは、IDを持っています。 393 00:16:23,150 --> 00:16:25,080 また、持つことができます クラス、このようなもの。 394 00:16:25,080 --> 00:16:27,250 単一のタグは、多くの属性を持つことができます。 395 00:16:27,250 --> 00:16:33,140 だからIDで始まる、のは、我々のふりをしましょう 私にはわからないof-- IDを持っていると思います。 396 00:16:33,140 --> 00:16:35,140 我々は、特別なそれを呼ぶことにします この1ので、私たちはしている 397 00:16:35,140 --> 00:16:37,867 太字にします。また、 下線、および何でも。 398 00:16:37,867 --> 00:16:39,950 ALLISON BUCHHOLTZ-AU：それは つもりスーパースペシャルである。 399 00:16:39,950 --> 00:16:42,360 TOMAS Reimersの：だからこの 一方、我々のid特別を持っている。 400 00:16:42,360 --> 00:16:48,140 だから、それを選択する方法は、その後、ある main.cssがで、pタグを持つのではなく、 401 00:16:48,140 --> 00:16:51,500 あなたはOK、#specialのですか？ 402 00:16:51,500 --> 00:16:55,538 そして、それは選択され IDの特別なとの事。 403 00:16:55,538 --> 00:16:57,295 これはすべての人に意味があるか？ 404 00:16:57,295 --> 00:16:57,920 読者：うん。 405 00:16:57,920 --> 00:16:59,110 TOMAS Reimersの：クール。 406 00:16:59,110 --> 00:17:04,440 だから今私たちが戻った場合、 我々はおっとsee--う。 407 00:17:04,440 --> 00:17:06,240 うん。 408 00:17:06,240 --> 00:17:09,460 我々は、それが唯一の選択ことがわかります のid特別に1。 409 00:17:09,460 --> 00:17:10,622 うん？ 410 00:17:10,622 --> 00:17:11,900 クールなサウンド。 411 00:17:11,900 --> 00:17:12,570 はい。 412 00:17:12,570 --> 00:17:15,456 >> 読者：何かが持つことができる クラスとIDの両方の属性？ 413 00:17:15,456 --> 00:17:16,359 >> TOMAS Reimersの：はい。 414 00:17:16,359 --> 00:17:16,900 聴衆：OK。 415 00:17:16,900 --> 00:17:20,887 そして、あなたはそれから与えるとどうなるか それ紛争CSSのいくつかのルール？ 416 00:17:20,887 --> 00:17:21,970 TOMAS Reimersの：もちろんです。 417 00:17:21,970 --> 00:17:23,940 我々は間違いなくつもりだ そのことについて話をする。 418 00:17:23,940 --> 00:17:31,890 だから、なっていたかを正確に で、あなたはまた、クラスを持つことができます。 419 00:17:31,890 --> 00:17:36,380 それでは、私が持っていたふりをしましょう 3段落と私 420 00:17:36,380 --> 00:17:38,730 最初のスタイルをしたかった 2しかし第三のではない。 421 00:17:38,730 --> 00:17:42,850 さて、あなたの最初のアイデアは、私は、よくあることができる ちょうど第二1のIDを与えることができる。 422 00:17:42,850 --> 00:17:45,590 しかし、あなたはできませんが、IDなぜなら、 正確にアリソンが言っていたように、 423 00:17:45,590 --> 00:17:47,330 一意である必要があります。 424 00:17:47,330 --> 00:17:50,860 >> だからではなく、IDのか、何をあなた 使用することができ、クラスを使用することができますです。 425 00:17:50,860 --> 00:17:57,880 それが許可するものとclass-- あなたは何を基本的に言うと、 426 00:17:57,880 --> 00:17:59,610 これは、グループの一部として所属。 427 00:17:59,610 --> 00:18:02,410 この場合において、当社グループ 特別と呼ばれている。 428 00:18:02,410 --> 00:18:06,500 そして、我々は、次にやろうとしているものを 私たちは、むしろ、ポンドよりもsay--するつもりだ 429 00:18:06,500 --> 00:18:08,070 私たちは、ドットを使用するつもりだ。 430 00:18:08,070 --> 00:18:08,740 OK？ 431 00:18:08,740 --> 00:18:11,950 ポンドとドットことに気付く 唯一のCSSファイル内に存在し、 432 00:18:11,950 --> 00:18:12,797 しないHTML内。 433 00:18:12,797 --> 00:18:13,880 ALLISON BUCHHOLTZ-AU：はい。 434 00:18:13,880 --> 00:18:15,185 重要な違い。 435 00:18:15,185 --> 00:18:17,510 >> TOMAS Reimersの：私が持っている そんなに闘争を持っていた、 436 00:18:17,510 --> 00:18:23,990 私はHTMLでハッシュを入れているためと そしてちょうど長い間、愚かな感じ。 437 00:18:23,990 --> 00:18:27,470 それはの両方を選択する方法を参照してください そのクラスを持つもの？ 438 00:18:27,470 --> 00:18:28,210 クール。 439 00:18:28,210 --> 00:18:29,950 >> さて、物事は複数のクラスを持つことができます。 440 00:18:29,950 --> 00:18:32,790 のは、私が最初にしたかったとしましょう 2は、黄色の背景を持っている 441 00:18:32,790 --> 00:18:36,770 そして第二2は持っている 青のフォントの色。 442 00:18:36,770 --> 00:18:37,270 OK。 443 00:18:37,270 --> 00:18:39,735 私は思います、なぜ私は本当に知らない それをやってみたいが、私はすることができます。 444 00:18:39,735 --> 00:18:42,401 >> ALLISON BUCHHOLTZ-AU：ない可能性があります あなたのウェブサイトのためにそれをお勧めします。 445 00:18:42,401 --> 00:18:43,880 しかし、我々の目的のために、それはやる。 446 00:18:43,880 --> 00:18:46,294 >> TOMAS Reimersの：それはありません 優れた配色。 447 00:18:46,294 --> 00:18:49,210 ALLISON BUCHHOLTZ-AU：まあ、黄色 青が私の高校の色です。 448 00:18:49,210 --> 00:18:50,947 でも、私は知りません。 449 00:18:50,947 --> 00:18:53,530 TOMAS Reimersの：アリソンの高い 学校は偉大なカラースキームを持っていた。 450 00:18:53,530 --> 00:18:54,520 [笑い] 451 00:18:54,520 --> 00:18:59,120 それでは私たちはこれを呼び出すことができるものである this--呼び出してみましょうので、私たちは特別なを持っている 452 00:18:59,120 --> 00:19:00,030 私たちはかなりあります。 453 00:19:00,030 --> 00:19:02,405 私はこのために、あなたが使用し、提案する はるか説明的な名前。 454 00:19:02,405 --> 00:19:05,820 ALLISON BUCHHOLTZ-AU：ええ、私はだろう 黄色や青、のように、これを呼び出します。 455 00:19:05,820 --> 00:19:08,314 >> TOMAS Reimersの：私たちではない 本当に、本物のウェブサイトを作る 456 00:19:08,314 --> 00:19:09,730 その私たちはそれをやっていない理由です。 457 00:19:09,730 --> 00:19:11,521 しかし、もしあなたが実際に あなたは、実際のウェブサイトを持っていた 458 00:19:11,521 --> 00:19:16,220 記事のヘッダー、のように、持っているかもしれません、 記事の内容、最初の単語、 459 00:19:16,220 --> 00:19:21,920 許可するそのようなこと、 あなたは、はるかに記述的であると。 460 00:19:21,920 --> 00:19:23,550 これらは単に変数のように実際にある。 461 00:19:23,550 --> 00:19:28,390 彼らはどこな方法で名前を付ける必要があります 次のような、like--うん、することができます。 462 00:19:28,390 --> 00:19:29,470 パーフェクト。 463 00:19:29,470 --> 00:19:30,480 >> だから、背景色。 464 00:19:30,480 --> 00:19:35,920 そして、我々はそうsay--するつもりだ 色を変更する方法はただ「色」です。 465 00:19:35,920 --> 00:19:38,412 そして、私たちはそれを青にするつもりだ。 466 00:19:38,412 --> 00:19:40,150 カッコいい。 467 00:19:40,150 --> 00:19:42,640 だから今我々が持っている 最初の二つは、特別なを持っている。 468 00:19:42,640 --> 00:19:45,972 次はなるだろう "クラス=かわいい。"持っている 469 00:19:45,972 --> 00:19:49,180 ALLISON BUCHHOLTZ-AU：そして、あなたはよ 真ん中の1に "かわいい"を追加します。 470 00:19:49,180 --> 00:19:49,971 TOMAS Reimersの：うん。 471 00:19:49,971 --> 00:19:52,970 そして、中央の1に、 追加するには「かわいい」、何が起こる 472 00:19:52,970 --> 00:19:56,880 あなただけのスペースがある。 473 00:19:56,880 --> 00:19:59,800 そのため、クラス属性 スペースで区切られたリストです 474 00:19:59,800 --> 00:20:02,450 すべてのクラスの それは、そのタグに適用されます。 475 00:20:02,450 --> 00:20:02,959 OK？ 476 00:20:02,959 --> 00:20:05,750 この1が属するような、そうではありません と呼ばれる特別なクラスのいくつかの種類 477 00:20:05,750 --> 00:20:07,180 「特別な、スペース、かわいい。」 478 00:20:07,180 --> 00:20:10,870 これは、2つのclasses--に属し 特別なとかわいい。 479 00:20:10,870 --> 00:20:12,492 はい？ 480 00:20:12,492 --> 00:20:14,360 クール。 481 00:20:14,360 --> 00:20:17,010 >> そして、我々が見れば 何が起こるかで、私たちはしている 482 00:20:17,010 --> 00:20:21,850 最初の1が持っていることを見に行く 黄色の背景、黒のテキスト。 483 00:20:21,850 --> 00:20:22,450 第二にひとつ選ぶ 484 00:20:22,450 --> 00:20:26,160 >> ALLISON BUCHHOLTZ-AU：ボールド--has 青のテキストで黄色の背景。 485 00:20:26,160 --> 00:20:29,330 そして、私たちの最後の一つがちょうど持って 我々はそれに割り当てられた青いテキスト。 486 00:20:29,330 --> 00:20:30,870 >> TOMAS Reimersの：クール？ 487 00:20:30,870 --> 00:20:32,491 セレクタはどのように動作？ 488 00:20:32,491 --> 00:20:32,990 恐ろしい。 489 00:20:32,990 --> 00:20:34,720 >> ALLISON BUCHHOLTZ-AU：私たちはしたいですか 今、競合の話？ 490 00:20:34,720 --> 00:20:35,780 >> TOMAS Reimersの：そうそう。 491 00:20:35,780 --> 00:20:36,310 絶対に。 492 00:20:36,310 --> 00:20:38,380 あなたのであれば、何が起こる 競合している、右？ 493 00:20:38,380 --> 00:20:44,740 まずは1をふりをしましょう 何かをセットアップしlike-- 494 00:20:44,740 --> 00:20:47,240 ALLISON BUCHHOLTZ-AU：たぶん この1は、背景を変更する？ 495 00:20:47,240 --> 00:20:48,090 TOMAS Reimersの：うん。 496 00:20:48,090 --> 00:20:51,699 だから我々はするつもりだ "かわいい" サーモンの背景を変更する。 497 00:20:51,699 --> 00:20:54,740 ALLISON BUCHHOLTZ-AU：あなたはただでいる すべての偉大な色今日、トーマス。 498 00:20:54,740 --> 00:20:55,573 TOMAS Reimersの：うん。 499 00:20:55,573 --> 00:20:58,200 私は私ができるがわかったので、 実際の色として鮭を使用しています。 500 00:20:58,200 --> 00:21:00,270 だから我々は唯一のことをやろうとしている。 501 00:21:00,270 --> 00:21:01,770 私はまた、サンセ​​ットは実際の色だと思います。 502 00:21:01,770 --> 00:21:03,103 読者：サンセットの本当の色？ 503 00:21:03,103 --> 00:21:04,572 ALLISON BUCHHOLTZ-AU：それを試してみましょう。 504 00:21:04,572 --> 00:21:07,735 TOMAS Reimersの：このデモの後 ケースでは台無しという理由だけで、 505 00:21:07,735 --> 00:21:08,943 私は、デバッグされたくない。 506 00:21:08,943 --> 00:21:11,580 だから我々は鮭が本当の色を知っている。 507 00:21:11,580 --> 00:21:15,626 だから、上の任意の推測 何が起こるだろう？ 508 00:21:15,626 --> 00:21:17,522 >> ALLISON BUCHHOLTZ-AU：任意のアイデア？ 509 00:21:17,522 --> 00:21:20,002 >> 読者：[聞こえない]。 510 00:21:20,002 --> 00:21:20,920 >> TOMAS Reimersの：うん。 511 00:21:20,920 --> 00:21:22,150 だから、それが正確に右だ。 512 00:21:22,150 --> 00:21:24,930 基本的に、それが取る それが与えられた最後のルール。 513 00:21:24,930 --> 00:21:27,860 >> ALLISON BUCHHOLTZ-AU：だからこれは カスケードが有効に出番。 514 00:21:27,860 --> 00:21:31,080 >> TOMAS Reimersの：では、どのように覚えている カスケードスタイルシートことを持っていた？ 515 00:21:31,080 --> 00:21:33,660 だからによって、我々は一種の意味 我々はルールの束を持っていること 516 00:21:33,660 --> 00:21:37,115 互いの上に適用され、そして 彼らはまた、互いを上書きすることができます。 517 00:21:37,115 --> 00:21:39,380 >> ALLISON BUCHHOLTZ-AU：だから 下部にどんなの 518 00:21:39,380 --> 00:21:41,540 上部にあるの何よりも優先されます。 519 00:21:41,540 --> 00:21:45,842 あなたは完全にルールを持つことができ 事前に何かを否定する。 520 00:21:45,842 --> 00:21:48,300 あなたがなりたい理由でもあります あなたがスタイリングしているときは注意してください、 521 00:21:48,300 --> 00:21:51,465 だから、ルールを作成していないこと あなただけの完全にオーバーライドしています。 522 00:21:51,465 --> 00:21:53,340 >> TOMAS Reimersの：または多分あなた ルールを上書きしますか。 523 00:21:53,340 --> 00:21:53,920 >> ALLISON BUCHHOLTZ-AU：または多分あなたが行う。 524 00:21:53,920 --> 00:21:54,300 はい。 525 00:21:54,300 --> 00:21:57,175 >> TOMAS Reimersの：あなたが持っているふり ほとんどのものに適用されるクラス、 526 00:21:57,175 --> 00:22:01,220 しかし、あなたが、変更したいとしましょう 赤とフォントに背景色 527 00:22:01,220 --> 00:22:03,140 ほとんどのための大胆な重量 物事が1のために、 528 00:22:03,140 --> 00:22:06,098 あなただけの背景色に​​したい 赤はできますが、他のすべてが欲しいために 529 00:22:06,098 --> 00:22:09,990 プロパティは、あなたが何かを行うことができます 「、フォントの太さ=ノーマル "のような 530 00:22:09,990 --> 00:22:12,760 これ、その大胆な変更を元に戻すだろう。 531 00:22:12,760 --> 00:22:14,480 うん？ 532 00:22:14,480 --> 00:22:17,250 ここでも、最良の方法は、私が思う アリソンは、それが、ちょうど練習であることを特徴とする。 533 00:22:17,250 --> 00:22:18,080 >> ALLISON BUCHHOLTZ-AU：実験。 534 00:22:18,080 --> 00:22:20,090 >> TOMAS Reimersの：練習、練習、 練習、そして実験。 535 00:22:20,090 --> 00:22:22,950 私が考える多くの人を知っている CSSは推測·アンド·チェックのちょうどたくさんある 536 00:22:22,950 --> 00:22:25,580 一日の終わりに、どこかの あなたは、something--などをやってみたい 537 00:22:25,580 --> 00:22:27,663 あなたが大まかなアイデアを持っていますが、 あなたはまだ、おそらく必要があります 538 00:22:27,663 --> 00:22:31,390 確認するためにそれを試してみること あなたはそれがどのようなものか知っている。 539 00:22:31,390 --> 00:22:34,482 >> 読者：あなたが適用している クラスは、複数の 540 00:22:34,482 --> 00:22:37,339 同じ段落に またはセクション、それはありません 541 00:22:37,339 --> 00:22:39,505 何でオーダーすることができます 引用符にそれらを入力する？ 542 00:22:39,505 --> 00:22:40,992 >> TOMAS Reimersの：いいえ、全然。 543 00:22:40,992 --> 00:22:45,764 >> ALLISON BUCHHOLTZ-AU：何が問題である あなたのCSSスタイルシート内の順。 544 00:22:45,764 --> 00:22:47,430 読者：あなたが質問を繰り返すだろうか？ 545 00:22:47,430 --> 00:22:50,680 TOMAS Reimersの：ああ。 546 00:22:50,680 --> 00:22:53,990 ALLISON BUCHHOLTZ-AU：以内 あなたがクラスを与えているクラス、 547 00:22:53,990 --> 00:22:56,964 HTMLで何かに、い それは彼らがにいるどの順番は関係？ 548 00:22:56,964 --> 00:22:58,130 それは順序が重要ではありません。 549 00:22:58,130 --> 00:23:02,915 重要なのは順序である あなたのCSS内のクラスセレクタ、 550 00:23:02,915 --> 00:23:04,306 あなたのスタイルシート内。 551 00:23:04,306 --> 00:23:06,982 >> TOMAS Reimersの：サウンド良い？ 552 00:23:06,982 --> 00:23:08,532 >> ALLISON BUCHHOLTZ-AU：ラブリー。 553 00:23:08,532 --> 00:23:11,539 >> TOMAS Reimersの：そして、 我々はto--継続するつもりだ 554 00:23:11,539 --> 00:23:13,330 ALLISON BUCHHOLTZ-AU： 私たちは、次のものはありますか？ 555 00:23:13,330 --> 00:23:14,245 私は忘れる。 556 00:23:14,245 --> 00:23:16,087 ああ、私たちは一例を持っている。 557 00:23:16,087 --> 00:23:17,295 しかし、我々は種類のものをやった。 558 00:23:17,295 --> 00:23:18,990 私たちは、その場での例をやった。 559 00:23:18,990 --> 00:23:20,540 >> TOMAS Reimersの：私たちは、に行く すぐにセレクタを組み合わせる。 560 00:23:20,540 --> 00:23:22,790 >> ALLISON BUCHHOLTZ-AU：ああ、 私たちは、セレクタを組み合わせることを得る。 561 00:23:22,790 --> 00:23:25,260 TOMAS Reimersの：だから、いくつかの 例では、我々が持っているである 562 00:23:25,260 --> 00:23:29,630 ＃dog--ポンド、またはハッシュタグ、 またはシャープ、または何 563 00:23:29,630 --> 00:23:32,050 あなたはthat--シャープを呼び出したい。 564 00:23:32,050 --> 00:23:34,875 >> ALLISON BUCHHOLTZ-AU：シャープ犬。 565 00:23:34,875 --> 00:23:36,470 >> TOMAS Reimersの：次に、.petsを持っている。 566 00:23:36,470 --> 00:23:39,059 567 00:23:39,059 --> 00:23:41,600 何かが犬のIDを持って、 ページ上の唯一の1の犬があります。 568 00:23:41,600 --> 00:23:43,870 何かがのIDを持ってい 一つだけ猫が猫あります。 569 00:23:43,870 --> 00:23:45,665 ページ上の多くのペットがあるかもしれません。 570 00:23:45,665 --> 00:23:47,570 私たちはクラスのことを与えた理由です。 571 00:23:47,570 --> 00:23:48,740 あなたは、pの例を持っている。 572 00:23:48,740 --> 00:23:50,490 そして、そのようにの1 最後の例、その 573 00:23:50,490 --> 00:23:53,790 我々は話をしていないものです、 あなたがそれらを結合するときに起こることです。 574 00:23:53,790 --> 00:23:54,580 p.petsだから。 575 00:23:54,580 --> 00:23:57,510 576 00:23:57,510 --> 00:24:02,950 >> そのためそれでは、に戻ってみましょう コー​​ドとうんanother--紹介する。 577 00:24:02,950 --> 00:24:04,290 だから、ここに戻って。 578 00:24:04,290 --> 00:24:04,850 >> ALLISON BUCHHOLTZ-AU：I これはreally--あるように感じる 579 00:24:04,850 --> 00:24:08,105 ちょうど例を通して見ているよう 本当にこれを学ぶための方法です。 580 00:24:08,105 --> 00:24:09,360 だから、私たちがやっていることだ。 581 00:24:09,360 --> 00:24:14,030 >> TOMAS Reimersの：それでは我々のふりをしましょう 右側のみ、テキスト2を選択するようにしたいですか？ 582 00:24:14,030 --> 00:24:16,530 だから我々は間違いなくできない IDでそれを行う。 583 00:24:16,530 --> 00:24:19,620 さて、私たちはとのことを行うことができます IDが、それはIDを持っていません。 584 00:24:19,620 --> 00:24:22,490 私は1つを追加しますが、それではふりをしましょう​​可能性 私は1つを追加したくなかったことを 585 00:24:22,490 --> 00:24:24,910 またはそれは、すでに何か他のものを持っています。 586 00:24:24,910 --> 00:24:26,516 私はそれでそれを行うことはできません。 587 00:24:26,516 --> 00:24:28,870 タグは、右、間違いなく一意ではありません？ 588 00:24:28,870 --> 00:24:30,670 そして、どちらもクラスです。 589 00:24:30,670 --> 00:24:32,314 しかし、あなたはこれらの事を組み合わせることができます。 590 00:24:32,314 --> 00:24:35,230 のは私たちが何かをしたかったとしましょう これだけのものに適用されている 591 00:24:35,230 --> 00:24:39,420 クラス特別を持って これはかなりのクラスを持っている。 592 00:24:39,420 --> 00:24:48,150 >> だから何あなたがすることができることは、main.cssがしている あなたがのは、最初にこれを削除させて、言うことができます。 593 00:24:48,150 --> 00:24:50,240 あなたは、これらを組み合わせることができます。 594 00:24:50,240 --> 00:24:51,430 だから、。特殊行うことができます。 595 00:24:51,430 --> 00:24:52,110 スペースがありません。 596 00:24:52,110 --> 00:24:54,770 ただ.special.pretty。 597 00:24:54,770 --> 00:25:00,550 何それが意味するものです その特別なとかなりの両方です。 598 00:25:00,550 --> 00:25:01,900 それは理にかなっていますか？ 599 00:25:01,900 --> 00:25:04,190 そして、我々はここに行けば、何 あなたが見ることになるだろう 600 00:25:04,190 --> 00:25:09,734 この規則は、のみに適用されている それらの両方を有する2つ目。 601 00:25:09,734 --> 00:25:11,400 そして、あなたは多くのことのためにそれを行うことができます。 602 00:25:11,400 --> 00:25:13,270 あなたがしてみましょうsay--できる 私は思ったふり 603 00:25:13,270 --> 00:25:18,300 かなりのクラスを持っていることを行う また、段落タグである。 604 00:25:18,300 --> 00:25:19,920 だからp.pretty。 605 00:25:19,920 --> 00:25:23,585 のは、私が持っていたことふりをしましょう タグ本体にかなり何か。 606 00:25:23,585 --> 00:25:25,850 OK？ 607 00:25:25,850 --> 00:25:28,490 私はこれを実行すると私ができる それが唯一だということがわかります 608 00:25:28,490 --> 00:25:32,720 ある物事に適用するつもり かなりクラスで段落。 609 00:25:32,720 --> 00:25:35,650 そして、あなたは、これらを組み合わせることができます 基本的に、あなたが好きなだけ。 610 00:25:35,650 --> 00:25:38,580 だから、単にそれらを一緒に置くことができます。 611 00:25:38,580 --> 00:25:39,604 それは理にかなっていますか？ 612 00:25:39,604 --> 00:25:41,770 ALLISON BUCHHOLTZ-AU：だから この種の方が便利です 613 00:25:41,770 --> 00:25:45,490 トマスは多分、先に言っていたとき、 あなたは非常に複雑なウェブサイトを持って、 614 00:25:45,490 --> 00:25:48,050 あなたがすでにたくさんある 書かれたこれらのルールの、 615 00:25:48,050 --> 00:25:51,170 そしてあなただけに必要 前から2を組み合わせる。 616 00:25:51,170 --> 00:25:55,350 全体ではなくを書くのと同様に 新しいセレクタとそこにそれを変え、 617 00:25:55,350 --> 00:25:58,592 あなただけの組み合わせることができます それらは、それが重なる。 618 00:25:58,592 --> 00:26:00,670 >> TOMAS Reimersの：または 時々かゆうパックで見つけるかもしれない 619 00:26:00,670 --> 00:26:04,290 その一つのクラスがあります 青のようなフォントの色を行い、 620 00:26:04,290 --> 00:26:06,740 そしてその別のクラスがあります 背景青になります。 621 00:26:06,740 --> 00:26:07,840 そして、それだけでは動作しません。 622 00:26:07,840 --> 00:26:10,924 だから、特別な場合、どこを書く それは両方を持っている場合like--しかし、あなたは何をしている 623 00:26:10,924 --> 00:26:13,548 やろうとして使用すると、するつもりである 青のこの日陰この1を作る 624 00:26:13,548 --> 00:26:15,310 この1つの青色のこの他の陰。 625 00:26:15,310 --> 00:26:15,580 右？ 626 00:26:15,580 --> 00:26:17,955 >> ALLISON BUCHHOLTZ-AU：グッド 例外のそれらの種類の。 627 00:26:17,955 --> 00:26:21,220 TOMAS Reimersの：へだから、 問題について考える 628 00:26:21,220 --> 00:26:25,000 あなたがそれらを結合するときには、発生する可能性がある。 629 00:26:25,000 --> 00:26:27,020 クール。 630 00:26:27,020 --> 00:26:29,692 だから、戻って私たちのプレゼンテーションに。 631 00:26:29,692 --> 00:26:31,400 ALLISON BUCHHOLTZ-AU： 私たちはほとんどがしています。 632 00:26:31,400 --> 00:26:34,022 TOMAS Reimersの：そしてそれ 接続停止しました。 633 00:26:34,022 --> 00:26:36,494 ALLISON BUCHHOLTZ-AU：ああ、ない。 634 00:26:36,494 --> 00:26:39,125 ALLISON BUCHHOLTZ-AU：CSで オフィス、インターネットがダウンした。 635 00:26:39,125 --> 00:26:40,360 ああ、皮肉。 636 00:26:40,360 --> 00:26:45,620 >> TOMAS Reimersの：だから幸いにも、我々はできる インターネットなしで現在、私は推測する、 637 00:26:45,620 --> 00:26:47,380 私たちはここですべてのスライドを持っているので。 638 00:26:47,380 --> 00:26:49,304 それでは、について話しましょう タグの関係。 639 00:26:49,304 --> 00:26:50,470 ALLISON BUCHHOLTZ-AU：右。 640 00:26:50,470 --> 00:26:52,660 だから種類の行く トマスが言ったことのオフ、 641 00:26:52,660 --> 00:26:54,180 これはそれを行うにはちょうど別の方法です。 642 00:26:54,180 --> 00:26:57,840 だから我々はいくつかの親を持つ 子セレクタとセレクタ。 643 00:26:57,840 --> 00:27:02,815 だからここに、この例では、我々はいくつかを持っている クラスのナビゲーションバー、クラスボタンでボディ。 644 00:27:02,815 --> 00:27:03,315 ああ。 645 00:27:03,315 --> 00:27:03,990 >> TOMAS Reimersの：ああ、申し訳ありません。 646 00:27:03,990 --> 00:27:06,180 >> ALLISON BUCHHOLTZ-AU：そして、 基本的に、これが意味する 647 00:27:06,180 --> 00:27:11,070 のように、すべての子を選択している セレクタのこれらの種類のすべて、 648 00:27:11,070 --> 00:27:13,040 この親セレクタ内。 649 00:27:13,040 --> 00:27:16,004 そして、それらは唯一のものである それは今までに適用するために起こっている。 650 00:27:16,004 --> 00:27:17,755 あなたかどうかは知りません より良い方法を持ってof-- 651 00:27:17,755 --> 00:27:19,504 TOMAS Reimersの：だから私 考えるための方法を推測 652 00:27:19,504 --> 00:27:22,440 このことについてどのように前に覚えている 私たちは、ソートのように一緒にそれらを置く。 653 00:27:22,440 --> 00:27:26,340 そして、その一つの要素を意味する これは、これらのすべてに一致します。 654 00:27:26,340 --> 00:27:29,530 これが何を言っていることは、私です あなたはすべてを一致させたい 655 00:27:29,530 --> 00:27:33,220 私が欲しいsome--内 あなたセレクターを見つける。 656 00:27:33,220 --> 00:27:35,670 そしてその中で、私が欲しい あなたは新しいことを一致させます。 657 00:27:35,670 --> 00:27:36,170 右？ 658 00:27:36,170 --> 00:27:40,900 だから、CSSで、それは約ソートのすべてです これらの項目を一致させることができるという。 659 00:27:40,900 --> 00:27:43,050 そして、あなたが一致するように試みることができる 他の項目内の項目。 660 00:27:43,050 --> 00:27:46,510 >> それでは、実際に例を実行してみましょう そして我々はそれが明確と思います。 661 00:27:46,510 --> 00:27:53,090 それでは、私たちは特別な持っているふりをしましょう​​、 特別かなり、何でも。 662 00:27:53,090 --> 00:27:55,690 そして、我々はOK、リンクがありますか？ 663 00:27:55,690 --> 00:27:59,780 664 00:27:59,780 --> 00:28:02,370 だから、リンクである、覚えている。 665 00:28:02,370 --> 00:28:03,900 それは、どこにでも行くことはないだろう。 666 00:28:03,900 --> 00:28:11,500 そして、我々はそれを与えるつもりだ クラス·リンク、私は推測する。 667 00:28:11,500 --> 00:28:13,335 のはそれを与えてみましょう 私にアイデアを与えるclass--。 668 00:28:13,335 --> 00:28:14,460 ALLISON BUCHHOLTZ-AU：クール。 669 00:28:14,460 --> 00:28:16,420 TOMAS Reimersの：-COO-レッツ それはかなりクラスに行く。 670 00:28:16,420 --> 00:28:16,930 何故なの？ 671 00:28:16,930 --> 00:28:17,971 >> ALLISON BUCHHOLTZ-AU：OK。 672 00:28:17,971 --> 00:28:23,040 TOMAS Reimersの：だから 今はかなりのもの 673 00:28:23,040 --> 00:28:26,000 背景を作るしようとしている ブルー、サーモンの背景色。 674 00:28:26,000 --> 00:28:27,969 それは理にかなっている。 675 00:28:27,969 --> 00:28:28,760 そして、我々はthis--を行う場合 676 00:28:28,760 --> 00:28:29,620 >> ALLISON BUCHHOLTZ-AU： あなたは、テキストを追加しますか 677 00:28:29,620 --> 00:28:31,078 そうハイパーリンクは、実際に表示さ？ 678 00:28:31,078 --> 00:28:35,088 TOMAS Reimersの：それ 良いコールでしょう。 679 00:28:35,088 --> 00:28:37,921 ALLISON BUCHHOLTZ-AU：「正しい原因 今、私たちは何も得るだけのつもりだ。 680 00:28:37,921 --> 00:28:39,690 TOMAS Reimersの：これはリンクです。 681 00:28:39,690 --> 00:28:42,202 「これはリンクになっています。」 682 00:28:42,202 --> 00:28:45,820 ああ、これが起こっている 別のリンクであると。 683 00:28:45,820 --> 00:28:47,280 のはそれをクラスを挙げてみましょう "クール。" 684 00:28:47,280 --> 00:28:50,295 あなたが正しい。 685 00:28:50,295 --> 00:28:50,795 クール。 686 00:28:50,795 --> 00:28:53,590 687 00:28:53,590 --> 00:28:56,010 だから、今の我々はこれをつかむつもりだ。 688 00:28:56,010 --> 00:28:57,269 私たちは、1をスローするつもりだ。 689 00:28:57,269 --> 00:28:59,060 私たちは一つを持っている 特殊なタグ、およびまた、我々 690 00:28:59,060 --> 00:29:01,150 かなりタグ内の1を持ってしようとしている。 691 00:29:01,150 --> 00:29:05,449 そして今、私たちはするつもりだ何 やる我々はcool--するつもりだです 692 00:29:05,449 --> 00:29:06,490 我々はそれが何をすべきかをしたいですか？ 693 00:29:06,490 --> 00:29:10,347 694 00:29:10,347 --> 00:29:12,180 ALLISON BUCHHOLTZ-AU： 我々はそれを大きくすることはできますか？ 695 00:29:12,180 --> 00:29:13,800 TOMAS Reimersのは：それに境界線を挙げてみましょう。 696 00:29:13,800 --> 00:29:14,840 ALLISON BUCHHOLTZ-AU：私たちは、国境可能性があります。 697 00:29:14,840 --> 00:29:15,673 TOMAS Reimersの：うん。 698 00:29:15,673 --> 00:29:18,560 だから我々は何かをやろうとしている のように、国境is--、私たちがしている 699 00:29:18,560 --> 00:29:20,971 すべての第二でこれを説明するつもり。 700 00:29:20,971 --> 00:29:21,470 今のところ-- 701 00:29:21,470 --> 00:29:24,592 >> ALLISON BUCHHOLTZ-AU：ボックスモデルに。 702 00:29:24,592 --> 00:29:27,300 TOMAS Reimersの：しかし、今のところ、私たちはしている ただそれを境界線を与えるつもり。 703 00:29:27,300 --> 00:29:29,580 だから何それが意味することはあなたがしているである これらのリンクを見に行く。 704 00:29:29,580 --> 00:29:32,788 そして、あなたは彼らが持っていることを確認するつもりだ これらの、のような、醜い黒い枠、その 705 00:29:32,788 --> 00:29:33,820 クールです。 706 00:29:33,820 --> 00:29:34,500 >> ALLISON BUCHHOLTZ-AU： 弊社のウェブサイトはとてもきれいだ。 707 00:29:34,500 --> 00:29:35,333 >> TOMAS Reimersの：うん。 708 00:29:35,333 --> 00:29:38,930 弊社のウェブサイトは素晴らしいです。 709 00:29:38,930 --> 00:29:41,585 したがって、これら2はリンクであり、彼らが表示されます。 710 00:29:41,585 --> 00:29:44,160 今度は、私をふりをしましょう これだけをやってみたかった 711 00:29:44,160 --> 00:29:50,072 それは何かの中ではなかった場合、 その鮭の背景を持っていた。 712 00:29:50,072 --> 00:29:52,280 だから、これを覚えている 鮭の背景を持って、 713 00:29:52,280 --> 00:29:54,000 それはかなりクラスのだから。 714 00:29:54,000 --> 00:29:59,777 >> しかし、我々は唯一の冷却することを言いたい クラスでクラスで、特別なされていない 715 00:29:59,777 --> 00:30:02,890 かなり、その境界線を持っている必要があります。 716 00:30:02,890 --> 00:30:12,549 さて、あなたは何を行うことができますです .cool、、。特殊、スペースを言うことができます。 717 00:30:12,549 --> 00:30:15,590 あなたが考えるときそして、それは、何をやっている それについて、それは基本的に言ってあり、 718 00:30:15,590 --> 00:30:19,530 [OK]を、私にすべてを見つける それは特別にマッチします。 719 00:30:19,530 --> 00:30:24,104 そして、これらのタグの中、見つける 私にクールだすべてのもの。 720 00:30:24,104 --> 00:30:27,270 ALLISON BUCHHOLTZ-AU：だから別の方法 それはこれについて考えて良いかもしれませんが、 721 00:30:27,270 --> 00:30:29,810 Cに戻ってそれを持って来るである ちょうどスコープのアイデアのように。 722 00:30:29,810 --> 00:30:34,020 だから、あなたには、いくつかを持っているとき もののようなセレクタ、 723 00:30:34,020 --> 00:30:38,460 私たちはこの前のために働いてきたことを、 あなたのWeb​​ページ全体、あなたのHTMLのすべて 724 00:30:38,460 --> 00:30:40,180 右、あなたの範囲内にある？ 725 00:30:40,180 --> 00:30:43,090 しかし、我々はこれらを持っているとき 親子関係、 726 00:30:43,090 --> 00:30:47,130 あなたはどこで絞込みしているかのようです あなたは、特定の場所に探しています 727 00:30:47,130 --> 00:30:50,540 かのように、のような、私たちは内を探している 代わりに特定の機能 728 00:30:50,540 --> 00:30:52,007 私たちのファイル全体の。 729 00:30:52,007 --> 00:30:55,090 聴衆：だからこのことを念頭に置いて、だろう 我々はchanged--持っていた場合、それは重要だっいる 730 00:30:55,090 --> 00:30:56,423 ALLISON BUCHHOLTZ-AU：オーダー？ 731 00:30:56,423 --> 00:30:59,320 読者：CSSで--theクラス 、スペースを.coolする、。特殊？ 732 00:30:59,320 --> 00:31:01,153 ALLISON BUCHHOLTZ-AU： はい、なぜなら、その 733 00:31:01,153 --> 00:31:04,420 それがスコープ、と言うでしょう 涼しいているすべてのもの、 734 00:31:04,420 --> 00:31:07,235 その後何has--を見て 私は、この場合には、のように、意味 735 00:31:07,235 --> 00:31:08,860 私はそれはそれを変更したとは思わない。 736 00:31:08,860 --> 00:31:10,318 >> TOMAS Reimersの：私たちは何を言っていた場合は？ 737 00:31:10,318 --> 00:31:10,906 ごめんなさい。 738 00:31:10,906 --> 00:31:12,660 >> ALLISON BUCHHOLTZ-AU：我々の場合 それはその後冷却し、する範囲 739 00:31:12,660 --> 00:31:14,550 特別の外にものを探す、 実際には、同じである。 740 00:31:14,550 --> 00:31:16,260 >> TOMAS Reimersの：だからそれはないだろう。 741 00:31:16,260 --> 00:31:16,590 >> ALLISON BUCHHOLTZ-AU：それはないでしょうか？ 742 00:31:16,590 --> 00:31:17,590 まあ、ああ。 743 00:31:17,590 --> 00:31:18,090 私は間違っている。 744 00:31:18,090 --> 00:31:21,480 >> TOMAS Reimersの：だから理由 それはdifferent--共通mistake--だ 745 00:31:21,480 --> 00:31:27,140 されている、今だけ リンクは右、涼しい持って？ 746 00:31:27,140 --> 00:31:32,176 私はあなたたちに私の質問は推測する、 このページの何が.coolにマッチして？ 747 00:31:32,176 --> 00:31:35,984 748 00:31:35,984 --> 00:31:38,340 2タグは右、ここにありますか？ 749 00:31:38,340 --> 00:31:39,770 これは、この1と、この1である。 750 00:31:39,770 --> 00:31:40,590 どちらも、クールに一致する。 751 00:31:40,590 --> 00:31:42,200 他には何もしません。 752 00:31:42,200 --> 00:31:46,460 だから、あなたが言った場合には、.cool、スペース、 。特殊、あなたが言おうとしているのか、 753 00:31:46,460 --> 00:31:48,824 これらのタグの中、特別な何ですか？ 754 00:31:48,824 --> 00:31:49,865 ALLISON BUCHHOLTZ-AU：フム。 755 00:31:49,865 --> 00:31:51,800 それは右it--ものだ。 756 00:31:51,800 --> 00:31:52,310 ので、それはここにちょうど何かのようなものだ。 757 00:31:52,310 --> 00:31:53,310 >> TOMAS Reimersの：だからそれは何も選択しない。 758 00:31:53,310 --> 00:31:56,530 >> ALLISON BUCHHOLTZ-AU：付きのに対し 特別な、我々はここで、これらのタグの中だ。 759 00:31:56,530 --> 00:31:57,971 >> TOMAS Reimersの：それらとそれら。 760 00:31:57,971 --> 00:31:58,512 聴衆：OK。 761 00:31:58,512 --> 00:31:58,920 だから、フォワードからこれらのタグはスラッシュ？ 762 00:31:58,920 --> 00:31:59,740 >> TOMAS Reimersの：はい。 763 00:31:59,740 --> 00:32:01,150 それは理にかなっていますか？ 764 00:32:01,150 --> 00:32:03,685 どのようにそれは基本的にだ 範囲を絞り込むしようとしている。 765 00:32:03,685 --> 00:32:04,810 ALLISON BUCHHOLTZ-AU：うん。 766 00:32:04,810 --> 00:32:06,870 私はそれはおそらくだと思う それについて考えるための最も簡単な方法。 767 00:32:06,870 --> 00:32:09,270 >> TOMAS Reimersの：だから我々はこれを発見し、 我々は、この両方の一致した特別なを見つけた。 768 00:32:09,270 --> 00:32:11,400 そして、我々は内に、求めている これらの人は、クールな何ですか？ 769 00:32:11,400 --> 00:32:12,941 そして、この1つの中、この1のクール。 770 00:32:12,941 --> 00:32:14,500 この1内では、何もクールだん。 771 00:32:14,500 --> 00:32:16,250 だから、これは残っている唯一のタグです。 772 00:32:16,250 --> 00:32:20,112 >> ALLISON BUCHHOLTZ-AU：涼しいのに対し ちょうどそこにこれらのAタグ内である。 773 00:32:20,112 --> 00:32:21,070 TOMAS Reimersの：その通り。 774 00:32:21,070 --> 00:32:22,403 そして、それらの中で特別な何ですか？ 775 00:32:22,403 --> 00:32:22,930 何もない。 776 00:32:22,930 --> 00:32:25,270 今、私は言うだろうものです スペースがなかった場合には、 777 00:32:25,270 --> 00:32:29,880 あなたはクールでspecial--何を求めている または右、かなり、特別な何ですか？ 778 00:32:29,880 --> 00:32:35,370 あなたが.special.pretty言うなら、それはだ .pretty.specialと同じ。 779 00:32:35,370 --> 00:32:39,220 >> スペースを削除すると何であるので、 あなたは。特殊言うとき、される尋ね、 780 00:32:39,220 --> 00:32:40,970 [OK]を、求めている、 そのものは特別ですか？ 781 00:32:40,970 --> 00:32:43,780 その後、それらのどの ものもかなりあり、 782 00:32:43,780 --> 00:32:47,010 その文法的には同じです、 言い値として、かなり何、 783 00:32:47,010 --> 00:32:49,500 次にそれらのため、特別にも何ですか？ 784 00:32:49,500 --> 00:32:50,000 右？ 785 00:32:50,000 --> 00:32:53,099 それは、の違いだ 何が何であるかの範囲内だ。 786 00:32:53,099 --> 00:32:53,640 聴衆：OK。 787 00:32:53,640 --> 00:32:54,473 TOMAS Reimersの：うん。 788 00:32:54,473 --> 00:32:56,670 789 00:32:56,670 --> 00:32:58,030 恐ろしい。 790 00:32:58,030 --> 00:33:00,426 このことを念頭に置いてそこでthen-- 791 00:33:00,426 --> 00:33:01,800 >> ALLISON BUCHHOLTZ-AU：私は、私たちの最後だと思い 事は（FANCY BRITISH ACCENT IN）である 792 00:33:01,800 --> 00:33:02,510 ボックスモデル。 793 00:33:02,510 --> 00:33:05,992 >> TOMAS Reimersの：box-- [笑う] 私はアリソンはそれを言う方法を愛する。 794 00:33:05,992 --> 00:33:06,950 ボックスモデルの事だから。 795 00:33:06,950 --> 00:33:09,644 >> ALLISON BUCHHOLTZ-AU：ちょうど持っている ボックスには、私はあなたのボックスモデルになります。 796 00:33:09,644 --> 00:33:11,310 TOMAS Reimersの：それでは、そのことについて話しましょう​​。 797 00:33:11,310 --> 00:33:14,070 だから、今私たちは多くのことを費やしてきた 時間のセレクタの話。 798 00:33:14,070 --> 00:33:16,944 今では、あなたたちは次のように、おそらく、 あなたが知っているselectors--の巨匠、 799 00:33:16,944 --> 00:33:21,510 正確にそのコンテンツを選択する方法 あなたが画面に操作したい。 800 00:33:21,510 --> 00:33:24,740 >> だから今の質問は、どのように 正確には、それを操作することができますか？ 801 00:33:24,740 --> 00:33:27,010 だから私は、最も基本的な推測 そのことについて考えるための方法 802 00:33:27,010 --> 00:33:30,294 よく、まさに、ある CSSの要素とは？ 803 00:33:30,294 --> 00:33:32,585 私たちは多くの時間を費やしてきた について話して、タグが何であるか、 804 00:33:32,585 --> 00:33:36,140 または最も基本的なものです タグの表現？ 805 00:33:36,140 --> 00:33:39,870 806 00:33:39,870 --> 00:33:45,170 >> について考えるための良い方法 つまり、鮭は何形状のですか？ 807 00:33:45,170 --> 00:33:47,295 、のように、どのような形状である サーモン色の背景？ 808 00:33:47,295 --> 00:33:47,880 >> 聴衆：それは長方形です。 809 00:33:47,880 --> 00:33:49,040 >> TOMAS Reimersの：それは右、矩形の？ 810 00:33:49,040 --> 00:33:50,956 >> ALLISON BUCHHOLTZ-AU： トリックの質問ではなかった。 811 00:33:50,956 --> 00:33:51,870 [笑い] 812 00:33:51,870 --> 00:33:54,670 >> TOMAS Reimersの：しようとしていない この後半のあなたたちをだまして。 813 00:33:54,670 --> 00:33:57,510 だから我々はこの四角形を持っている。 814 00:33:57,510 --> 00:33:59,140 そして、タグは右、pは？ 815 00:33:59,140 --> 00:34:02,280 だから、私たちは良い与える 信念その段落 816 00:34:02,280 --> 00:34:07,440 で、矩形として表現さ​​れ 、ブラウザの心に少なくともいる 817 00:34:07,440 --> 00:34:08,715 それは。 818 00:34:08,715 --> 00:34:11,423 >> ALLISON BUCHHOLTZ-AU：私は意味、 ブラウザは、一般的に長方形である 819 00:34:11,423 --> 00:34:13,440 ので、それは理にかなっています。 820 00:34:13,440 --> 00:34:18,750 >> TOMAS Reimersのは：アイデアはここにある CSS内のタグのすべてのこと 821 00:34:18,750 --> 00:34:21,790 長方形として表されます。 822 00:34:21,790 --> 00:34:25,699 すべての矩形の4つを有する CSSによると部品、OK？ 823 00:34:25,699 --> 00:34:27,830 あなたは、実際のコンテンツを持っている。 824 00:34:27,830 --> 00:34:29,644 テキストがどこにあるからだ。 825 00:34:29,644 --> 00:34:30,470 >> ALLISON BUCHHOLTZ-AU： たぶんあなたの絵。 826 00:34:30,470 --> 00:34:31,303 >> TOMAS Reimersの：うん。 827 00:34:31,303 --> 00:34:33,860 あなたは、あるパディングを、持っている ホワイトスペースのほんのいくつかの種類。 828 00:34:33,860 --> 00:34:35,085 その後、境界線を持っている。 829 00:34:35,085 --> 00:34:37,710 そしてあなたは、余裕を持っている ホワイトスペースは、その外にある。 830 00:34:37,710 --> 00:34:39,460 だから、意味がありません 誰にも、私たちはしている 831 00:34:39,460 --> 00:34:42,500 第二のためにそのことについて話をするつもり。 832 00:34:42,500 --> 00:34:47,570 だから、右ここでは、やろうとしているものを 我々はOK、いくつかのdivを作成するつもりですか？ 833 00:34:47,570 --> 00:34:48,420 I--ながらすみません 834 00:34:48,420 --> 00:34:51,506 >> ALLISON BUCHHOLTZ-AU：私はのように感じる 私たちは、かわいい絵を置く必要があります。 835 00:34:51,506 --> 00:34:52,520 >> TOMAS Reimersの：我々は間違いなくすべきである。 836 00:34:52,520 --> 00:34:53,389 >> ALLISON BUCHHOLTZ-AU： 私は皆のように感じる 837 00:34:53,389 --> 00:34:54,870 恩恵を受ける かわいい絵は、すべてのです。 838 00:34:54,870 --> 00:34:56,774 >> TOMAS Reimersの：私たちすることができます A--からのすべての利益 839 00:34:56,774 --> 00:34:57,648 >> 聴衆：うん、確かに。 840 00:34:57,648 --> 00:34:58,790 TOMAS Reimersの：OK、涼しい。 841 00:34:58,790 --> 00:35:02,254 だから我々はかわいいを置くべき どこかで絵。 842 00:35:02,254 --> 00:35:05,295 ALLISON BUCHHOLTZ-AU：私はのように感じる かわいいバニーは今便利です。 843 00:35:05,295 --> 00:35:06,190 TOMAS Reimersの：確かに。 844 00:35:06,190 --> 00:35:06,950 ALLISON BUCHHOLTZ-AU：週の終わり。 845 00:35:06,950 --> 00:35:07,390 何かを持っているadorab-- 846 00:35:07,390 --> 00:35:08,520 >> TOMAS Reimersの：どのように子猫試合？ 847 00:35:08,520 --> 00:35:09,220 >> ALLISON BUCHHOLTZ-AU： 子猫は、あまりにも、動作します。 848 00:35:09,220 --> 00:35:11,300 >> TOMAS Reimersの：クール、なぜなら そのためのサイトがあります。 849 00:35:11,300 --> 00:35:12,300 それは、PlaceKittenと呼ばれています。 850 00:35:12,300 --> 00:35:14,719 ALLISON BUCHHOLTZ-AU：それは素晴らしいことだ。 851 00:35:14,719 --> 00:35:15,510 TOMAS Reimersの：はい。 852 00:35:15,510 --> 00:35:18,040 ALLISON BUCHHOLTZ-AU：ちょうどのように、のために、 あなたのウェブサイト内のプレースホルダのイメージ。 853 00:35:18,040 --> 00:35:18,914 TOMAS Reimersの：MM-HM。 854 00:35:18,914 --> 00:35:21,520 PlacePuppyもあります。 855 00:35:21,520 --> 00:35:22,832 そしてPlaceBaconがあります。 856 00:35:22,832 --> 00:35:24,340 >> ALLISON BUCHHOLTZ-AU：PlaceBacon？ 857 00:35:24,340 --> 00:35:25,350 本当に？ 858 00:35:25,350 --> 00:35:28,190 >> TOMAS Reimersの：ああ、私たちはしないでください ここではインターネットアクセスがあります。 859 00:35:28,190 --> 00:35:29,875 >> ALLISON BUCHHOLTZ-AU：[どよめき] 860 00:35:29,875 --> 00:35:30,375 悲劇。 861 00:35:30,375 --> 00:35:32,333 TOMAS Reimersの：それ以外の場合は、 私はあなたたちを示すであろう 862 00:35:32,333 --> 00:35:33,870 あなたのウェブサイトで画像を配置する方法。 863 00:35:33,870 --> 00:35:36,370 我々はこれを取得しようとするつもりだ 私たちが行く必要が前に働いて。 864 00:35:36,370 --> 00:35:38,660 しかし、今のところ、私たちはしている その後色で話をするつもり。 865 00:35:38,660 --> 00:35:39,820 私たちは、kittens--の写真を入れたい 866 00:35:39,820 --> 00:35:40,210 >> ALLISON BUCHHOLTZ-AU：私たちはやった。 867 00:35:40,210 --> 00:35:43,110 >> TOMAS Reimersの：--theインターネットの 一瞬のためにダウンしている。 868 00:35:43,110 --> 00:35:47,820 だから我々は2 divを持って、私たちはしている 彼らに2のIDを与えるつもり。 869 00:35:47,820 --> 00:35:51,380 870 00:35:51,380 --> 00:35:56,760 我々はそれを呼び出すするつもりだ 「第一」および「第二」 871 00:35:56,760 --> 00:36:01,184 そうイド= "最初" 872 00:36:01,184 --> 00:36:02,850 そして、我々は彼らに2つの色を与えるつもりだ。 873 00:36:02,850 --> 00:36:08,424 では、どのように何かを選択してください 「最初」のIDを持つ？ 874 00:36:08,424 --> 00:36:09,840 ALLISON BUCHHOLTZ-AU：ドットまたはハッシュ？ 875 00:36:09,840 --> 00:36:10,730 読者：シャープ。 876 00:36:10,730 --> 00:36:12,940 TOMAS Reimersの：シャープ、完璧。 877 00:36:12,940 --> 00:36:14,950 シャープ、ハッシュ、何でもwe-- 878 00:36:14,950 --> 00:36:15,680 >> ALLISON BUCHHOLTZ-AU： 物事の多くは、それを呼び出します。 879 00:36:15,680 --> 00:36:16,430 >> TOMAS Reimersの：OK。 880 00:36:16,430 --> 00:36:19,800 私たちは、ハッシュタグに落ち着くつもり、としている それは我々が一緒に行くつもり何だ。 881 00:36:19,800 --> 00:36:20,300 OK？ 882 00:36:20,300 --> 00:36:20,735 >> ALLISON BUCHHOLTZ-AU：ハッシュタグ。 883 00:36:20,735 --> 00:36:22,340 >> TOMAS Reimersの：だからハッシュタグの最初の。 884 00:36:22,340 --> 00:36:24,506 >> ALLISON BUCHHOLTZ-AU：だから あなたはseminar--をツイートすることができます 885 00:36:24,506 --> 00:36:27,582 ハッシュタグのCSS、クールハッシュタグ。 886 00:36:27,582 --> 00:36:29,040 TOMAS Reimersの：ハッシュタグAwesomenesと。 887 00:36:29,040 --> 00:36:30,730 ALLISON BUCHHOLTZ-AU： ハッシュタグAwesomenesと、はい。 888 00:36:30,730 --> 00:36:31,480 TOMAS Reimersの：OK。 889 00:36:31,480 --> 00:36:33,660 だから我々は、「第一」および「第二」を持っている 890 00:36:33,660 --> 00:36:37,697 したがって、最初、私たちは持っているつもりです 赤の背景色。 891 00:36:37,697 --> 00:36:39,030 ALLISON BUCHHOLTZ-AU：ええと、コロン。 892 00:36:39,030 --> 00:36:40,281 TOMAS Reimersの：うん。 893 00:36:40,281 --> 00:36:42,281 ALLISON BUCHHOLTZ-AU： 私はあなたのスポットチェッカーになるでしょう。 894 00:36:42,281 --> 00:36:43,960 TOMAS Reimersの：アリソンのは私を得た。 895 00:36:43,960 --> 00:36:45,830 blue--の背景色 896 00:36:45,830 --> 00:36:46,810 >> TOMAS Reimersの：パープル！ 897 00:36:46,810 --> 00:36:47,726 >> TOMAS Reimersの：パープル。 898 00:36:47,726 --> 00:36:48,830 ALLISON BUCHHOLTZ-AU：はい。 899 00:36:48,830 --> 00:36:50,630 パープルの私の好きな​​色、 そして我々はまだそれを使用していない。 900 00:36:50,630 --> 00:36:51,546 >> TOMAS Reimersの：バイオレット。 901 00:36:51,546 --> 00:36:53,361 ALLISON BUCHHOLTZ-AU：バイオレット。 902 00:36:53,361 --> 00:36:53,860 それは動作します。 903 00:36:53,860 --> 00:36:56,482 904 00:36:56,482 --> 00:36:59,880 >> TOMAS Reimersの：だから私たちはしている 2 divを持っているつもり。 905 00:36:59,880 --> 00:37:01,654 彼らは完全に空にすることになるだろう。 906 00:37:01,654 --> 00:37:03,070 我々は、おそらくいくつかのテキストを持っている必要があります。 907 00:37:03,070 --> 00:37:05,580 908 00:37:05,580 --> 00:37:09,815 だから、「第一」であることを行っている "HELLO。」 909 00:37:09,815 --> 00:37:10,940 そして、「第二」say--ます 910 00:37:10,940 --> 00:37:11,110 >> ALLISON BUCHHOLTZ-AU：さようなら。 911 00:37:11,110 --> 00:37:12,514 >> 読者： - 「WORLD。」 912 00:37:12,514 --> 00:37:14,122 さようなら、こんにちは。 913 00:37:14,122 --> 00:37:16,580 ALLISON BUCHHOLTZ-AU：私が見た コンサートでそれら他の週。 914 00:37:16,580 --> 00:37:17,705 TOMAS Reimersの：ビートルズ？ 915 00:37:17,705 --> 00:37:20,242 ALLISON BUCHHOLTZ-AU：実数の場合。 916 00:37:20,242 --> 00:37:21,200 彼らは、その素晴らしいではありませんね。 917 00:37:21,200 --> 00:37:24,084 918 00:37:24,084 --> 00:37:24,750 私はそれを好きではない。 919 00:37:24,750 --> 00:37:26,060 >> TOMAS Reimersの：私たちは持っている "HELLO"と "さようなら" 920 00:37:26,060 --> 00:37:29,102 そして再び、CSSは、単に素晴らしいです それが私たちの色を認識するため。 921 00:37:29,102 --> 00:37:30,810 さえする必要はありません それらが存在することを心配する。 922 00:37:30,810 --> 00:37:33,194 彼らはありません。 923 00:37:33,194 --> 00:37:35,130 >> ALLISON BUCHHOLTZ-AU：彼らは存在する。 924 00:37:35,130 --> 00:37:39,560 >> TOMAS Reimersの：だからCSS私は持っていると思う 色について話をする255の言葉。 925 00:37:39,560 --> 00:37:42,986 あなたが外で色を考えることができた場合 それらの255は、のような、私は感銘を受けるでしょう。 926 00:37:42,986 --> 00:37:44,110 ALLISON BUCHHOLTZ-AU：うん。 927 00:37:44,110 --> 00:37:45,560 私はあなたたちが持っているかもしれないと思う ちょうど右の後に来る。 928 00:37:45,560 --> 00:37:47,727 >> TOMAS Reimersの：だからここに、 あなたは私たちがつのボックスを持って表示されます 929 00:37:47,727 --> 00:37:49,143 右互いの上に、右？ 930 00:37:49,143 --> 00:37:50,200 こんにちは、GOODBYE。 931 00:37:50,200 --> 00:37:51,460 >> ALLISON BUCHHOLTZ-AU： 間にスペースはありません。 932 00:37:51,460 --> 00:37:53,390 彼らはただsmooshedしている 互いの上に右。 933 00:37:53,390 --> 00:37:55,973 >> TOMAS Reimersの：だから最初の事 私たちはについて話す必要がありますね 934 00:37:55,973 --> 00:38:02,960 それではまたうんsay--てみましょうです。 935 00:38:02,960 --> 00:38:08,020 だから、CSSは箱の一種としてそれらを表します。 936 00:38:08,020 --> 00:38:10,100 そしてボックスとして、彼らがコンテンツを持っている。 937 00:38:10,100 --> 00:38:14,540 そして、今の内容はソートのです ハローまたはGOODBYEとそれはそれだ。 938 00:38:14,540 --> 00:38:15,040 OK？ 939 00:38:15,040 --> 00:38:19,790 >> 最初のものの1ですから、 行うことができますあなたはパディングを追加することができますです。 940 00:38:19,790 --> 00:38:25,610 パディングはどのくらいのスペースを言う それはそれぞれの側に残してください。 941 00:38:25,610 --> 00:38:29,200 それでは、私が言いたいとしましょう それぞれの側に10ピクセル。 942 00:38:29,200 --> 00:38:31,234 そして、私は第二にそれを解剖します。 943 00:38:31,234 --> 00:38:33,150 ALLISON BUCHHOLTZ-AU： ここではこれらの事のすべて 944 00:38:33,150 --> 00:38:36,980 ピクセル単位で主にあることを行っている セミナーの残りの部分。 945 00:38:36,980 --> 00:38:40,980 あなたはそれが持っていることを確認するつもりだ その周りにいくつかのスペース、右？ 946 00:38:40,980 --> 00:38:46,360 ですから、ここに表示されていないものもございますです パディングのこの目に見えないソート 947 00:38:46,360 --> 00:38:49,600 のように、と言うそれぞれの側、上、 OK、あなたはcontent--のあなたの箱を持っている 948 00:38:49,600 --> 00:38:51,680 >> ALLISON BUCHHOLTZ-AU：あなたがしたいですか ちょうど点検要素をプルアップするには？ 949 00:38:51,680 --> 00:38:53,659 >> TOMAS Reimersの：ええ、それは良いアイデアです。 950 00:38:53,659 --> 00:38:56,700 ALLISON BUCHHOLTZ-AU：また、私は見つける 検査要素は良い方法であることを 951 00:38:56,700 --> 00:39:01,280 何かが起こっているかどうかを把握する 間違って、予期しない何かが起こる、 952 00:39:01,280 --> 00:39:04,570 タグを検査し、何を見て 上書きが役に立つようなものだ。 953 00:39:04,570 --> 00:39:05,940 >> TOMAS Reimersの：だから私はわからないんだけど あなたたちは、この色を見ることができます。 954 00:39:05,940 --> 00:39:06,470 あなたはできますか？ 955 00:39:06,470 --> 00:39:10,120 あなたはこのパディングが表示されます エッジのソートに。 956 00:39:10,120 --> 00:39:13,410 そして、あなたが実際に見る 青のコンテンツ、右？ 957 00:39:13,410 --> 00:39:16,820 だから、非常にだ ボックスモデルの基礎。 958 00:39:16,820 --> 00:39:17,674 あなたは、コンテンツを持っている。 959 00:39:17,674 --> 00:39:18,590 その後、パディングを持っている。 960 00:39:18,590 --> 00:39:20,440 >> 読者：なぜ、あなただけではないん the--内部のボックスを使用する 961 00:39:20,440 --> 00:39:21,606 >> ALLISON BUCHHOLTZ-AU：右。 962 00:39:21,606 --> 00:39:24,745 それだけで選択することだから 今の要素。 963 00:39:24,745 --> 00:39:26,050 >> TOMAS Reimersの：うん。 964 00:39:26,050 --> 00:39:27,060 他のもの。 965 00:39:27,060 --> 00:39:29,780 それでは、そのことについて話しましょう 第二のパディングコマンド。 966 00:39:29,780 --> 00:39:36,380 CSS、測定の中のSO ユニットを有する必要がある。 967 00:39:36,380 --> 00:39:39,740 だから、最初のあなたは量を持っている。 968 00:39:39,740 --> 00:39:41,460 したがって、このケースでは、10を言った。 969 00:39:41,460 --> 00:39:44,780 そして、次の1 我々は、ピクセル、PXであると言ってきました。 970 00:39:44,780 --> 00:39:49,160 あなたが持つかもしれない他のものがある センチメートル、インチのようなもの。 971 00:39:49,160 --> 00:39:51,367 あなたのようなことを行うことができ、 10インチ何ですか？ 972 00:39:51,367 --> 00:39:52,700 そして、それはとんでもないことになるだろう。 973 00:39:52,700 --> 00:39:52,990 >> ALLISON BUCHHOLTZ-AU：ああ、少年。 974 00:39:52,990 --> 00:39:53,460 >> 聴衆：おっ。 975 00:39:53,460 --> 00:39:54,460 >> TOMASアリソン：うん。 976 00:39:54,460 --> 00:39:57,840 TOMAS Reimersの：だから、すべてのパディングです。 977 00:39:57,840 --> 00:39:59,255 私は、ピクセルに戻って行くつもりです。 978 00:39:59,255 --> 00:40:01,754 >> ALLISON BUCHHOLTZ-AU：ピクセル 標準のように、である傾向がある。 979 00:40:01,754 --> 00:40:04,589 あなたは多くのウェブサイトを見てみると、 彼らは主にピクセル単位で働く。 980 00:40:04,589 --> 00:40:07,755 TOMAS Reimersの：だからあなたは見に行っている どちらかあなたが見る他のものをpixels-- 981 00:40:07,755 --> 00:40:13,952 1 EMである、EMさである フォントの高さに等しい 982 00:40:13,952 --> 00:40:15,160 これは、現在使用している。 983 00:40:15,160 --> 00:40:16,201 >> ALLISON BUCHHOLTZ-AU：MM。 984 00:40:16,201 --> 00:40:17,574 985 00:40:17,574 --> 00:40:20,740 TOMAS Reimersの：それは言っても良い方法ですが、 のような、私は私のフォントのように多くのスペースを望む 986 00:40:20,740 --> 00:40:21,514 取っている。 987 00:40:21,514 --> 00:40:23,180 ALLISON BUCHHOLTZ-AU：それを知りませんでした。 988 00:40:23,180 --> 00:40:25,747 あなたは、毎日何か新しいことを学ぶ。 989 00:40:25,747 --> 00:40:27,955 TOMAS Reimersの：あり CSでの測定がたくさん。 990 00:40:27,955 --> 00:40:29,260 私はあなたがそれらを検索示唆する。 991 00:40:29,260 --> 00:40:32,122 すべてのあなたのケースのために、私は思う ピクセルは十分なはずです。 992 00:40:32,122 --> 00:40:33,830 そして、彼らはまた何だ あなたが見ることになるだろう 993 00:40:33,830 --> 00:40:36,520 オンラインで行う例の大半で。 994 00:40:36,520 --> 00:40:38,320 だから我々はピクセルでそれを残しておきます。 995 00:40:38,320 --> 00:40:42,420 >> また、私はそうsay--必要がありますすることができます パディングはパディングのすべてを設定します。 996 00:40:42,420 --> 00:40:49,789 また、のような何かを行うことができます ただset--に「パディングトップ」 997 00:40:49,789 --> 00:40:52,080 ALLISON BUCHHOLTZ-AU：たぶん 私たちは "HELLO"バックを得るでしょう。 998 00:40:52,080 --> 00:40:55,480 TOMAS Reimersの：ちょうどに設定--to トップと他には何も上のパディング。 999 00:40:55,480 --> 00:40:59,560 だから、4つのコマンドは、パディングトップである、 パディング下、パディング左、 1000 00:40:59,560 --> 00:41:00,310 パディング右。 1001 00:41:00,310 --> 00:41:02,470 >> ALLISON BUCHHOLTZ-AU：だけのような あなたはボックスのために期待する。 1002 00:41:02,470 --> 00:41:03,530 >> TOMAS Reimersの：うん。 1003 00:41:03,530 --> 00:41:05,240 そこにあまりにもクレイジー何もない。 1004 00:41:05,240 --> 00:41:08,230 それは理にかなっていますか？ 1005 00:41:08,230 --> 00:41:11,990 だから、パディングです。 1006 00:41:11,990 --> 00:41:14,110 私はすべての設定するつもりです 戻って10にパディング。 1007 00:41:14,110 --> 00:41:17,010 そして私は国境に移動するつもりです。 1008 00:41:17,010 --> 00:41:21,130 >> だから何ボーダーされている ボーダーは奇妙なコマンドです。 1009 00:41:21,130 --> 00:41:24,450 それは、一度に3つのうちの一種を取ります。 1010 00:41:24,450 --> 00:41:28,930 だから、最初はどのように大きなあなたです それは測定としてになりたい。 1011 00:41:28,930 --> 00:41:30,662 繰り返しますが、私はピクセルのみを使用しています。 1012 00:41:30,662 --> 00:41:32,620 そして、最後のことは、私 測定結果に追加する必要があります 1013 00:41:32,620 --> 00:41:35,270 一つのことである 単位は0である必要はありません。 1014 00:41:35,270 --> 00:41:37,390 それは実際に正しくないです 0の単位を与えるために、 1015 00:41:37,390 --> 00:41:41,940 0は0インチ全体であるので、 ピクセル、センチメートル、何でも。 1016 00:41:41,940 --> 00:41:43,960 それはすべてちょうど、0意味？ 1017 00:41:43,960 --> 00:41:46,710 だから、最初にあなたはそれを測定を与える。 1018 00:41:46,710 --> 00:41:48,650 >> 次に、あなたはそれをスタイルを与える。 1019 00:41:48,650 --> 00:41:49,869 だから私は言うつもりです」固体。」 1020 00:41:49,869 --> 00:41:51,410 そして、私たちはそれが何を意味するのかについて話します。 1021 00:41:51,410 --> 00:41:54,290 そして最後に、あなたはそれを色を与える。 1022 00:41:54,290 --> 00:41:56,850 だから私は言うつもりです」黒を。」 1023 00:41:56,850 --> 00:41:59,637 そして、これらは、私たちがしたすべてのものである 今のスタイルを除き、前に見た、 1024 00:41:59,637 --> 00:42:00,720 しかし、我々はそれについて話をしましょう​​。 1025 00:42:00,720 --> 00:42:04,120 だから、あなたたちは、測定結果を見てきました、 あなたが色を見てきました。 1026 00:42:04,120 --> 00:42:10,410 そして、何が起こるかは我々はこれを取得することです その周りに素敵な黒のボーダー、右？ 1027 00:42:10,410 --> 00:42:11,620 君たちは、私たちがそれをしたかを見る？ 1028 00:42:11,620 --> 00:42:12,760 >> 読者：うん。 1029 00:42:12,760 --> 00:42:14,850 >> TOMAS Reimersの：クール。 1030 00:42:14,850 --> 00:42:17,370 だから、何ですか？ 1031 00:42:17,370 --> 00:42:19,160 だから、まず第一に、それは1ピクセルです。 1032 00:42:19,160 --> 00:42:20,880 それは正しい、十分な自明だ？ 1033 00:42:20,880 --> 00:42:23,254 のように、それは1ピクセル太いです。 1034 00:42:23,254 --> 00:42:26,170 それとも、1ピクセルであるだろうが、私は今 それはもう少しですので、ズームアップ 1035 00:42:26,170 --> 00:42:26,490 それよりも。 1036 00:42:26,490 --> 00:42:27,967 >> ALLISON BUCHHOLTZ-AU：そして、我々は持っている このばかげた解像度のテレビ。 1037 00:42:27,967 --> 00:42:29,460 >> TOMAS Reimersの：うん。 1038 00:42:29,460 --> 00:42:33,640 あなたはそれを大きくすることができ、 小さい、何でも。 1039 00:42:33,640 --> 00:42:35,630 だからここに2画素の境界線です。 1040 00:42:35,630 --> 00:42:38,810 あなたはそれが2倍の厚だが表示されます。 1041 00:42:38,810 --> 00:42:40,172 あなたが持っている次のことは、色です。 1042 00:42:40,172 --> 00:42:41,130 それは面白いではありません。 1043 00:42:41,130 --> 00:42:42,710 私が話をするつもりはありません そのことについて、本当に。 1044 00:42:42,710 --> 00:42:45,110 >> ALLISON BUCHHOLTZ-AU：しかしスタイル ちょっと面白いかもしれません。 1045 00:42:45,110 --> 00:42:45,980 >> TOMAS Reimersの：うん。 1046 00:42:45,980 --> 00:42:48,560 スタイルだから、いくつかのものがあります 私は一般的に使用されて参照すること。 1047 00:42:48,560 --> 00:42:55,690 まず1の固体、次の1の 点在し、そして最後の1の破線。 1048 00:42:55,690 --> 00:42:59,290 そして、ここに点在しています。 1049 00:42:59,290 --> 00:43:02,980 あなたは、彼らがしていることがわかります ドットの束、右？ 1050 00:43:02,980 --> 00:43:09,030 ソートの素敵な境界線を得るための良い方法 行き、ダッシュもかなり人気があります。 1051 00:43:09,030 --> 00:43:11,580 1052 00:43:11,580 --> 00:43:13,600 >> ALLISON BUCHHOLTZ-AU： そしてもちろん、私は今 1053 00:43:13,600 --> 00:43:16,660 他のたくさんがあることを確認 あなたが得ることができるスタイル。 1054 00:43:16,660 --> 00:43:20,000 そして、我々は大きなセットを持っている あなたたちのために最後にリンク 1055 00:43:20,000 --> 00:43:23,470 種類の熟読し、 より多くのクールなCSSを見てください。 1056 00:43:23,470 --> 00:43:25,954 >> TOMAS Reimersの：そして、 最後に、私たちはしている 1057 00:43:25,954 --> 00:43:27,870 について話をするつもりは ボックスモデル実際に素早く。 1058 00:43:27,870 --> 00:43:30,070 ああ、その後国境、 正確にパディングのような、 1059 00:43:30,070 --> 00:43:33,270 あなたはまた、のようなものを持っている ボーダー左、国境から右、ボーダートップ、 1060 00:43:33,270 --> 00:43:37,590 あなたを許すのborder-bottom、 具体的な国境で取得する。 1061 00:43:37,590 --> 00:43:40,650 だからここだけの境界線が左に定義されます。 1062 00:43:40,650 --> 00:43:43,060 それは理にかなっていますか？ 1063 00:43:43,060 --> 00:43:46,170 >> ALLISON BUCHHOLTZ-AU：それはクールだ 物事を強調するか、追加する方法 1064 00:43:46,170 --> 00:43:47,545 異なる要素間の線。 1065 00:43:47,545 --> 00:43:48,670 TOMAS Reimersの：もちろんです。 1066 00:43:48,670 --> 00:43:50,940 だから、私たちの国境だ。 1067 00:43:50,940 --> 00:43:52,790 そして、最後の1のマージン。 1068 00:43:52,790 --> 00:43:55,892 証拠金のようなパディング それはwithin--ではありませんを除いて 1069 00:43:55,892 --> 00:43:57,975 ALLISON BUCHHOLTZ-AU：それは ではないあなたの要素の周囲 1070 00:43:57,975 --> 00:44:00,840 しかし、実際には全体の周りに 私たちが見てきた箱。 1071 00:44:00,840 --> 00:44:02,770 >> TOMAS Reimersの：うん。 1072 00:44:02,770 --> 00:44:04,090 アリソンは完全にそれを言った。 1073 00:44:04,090 --> 00:44:07,550 それはあなたの中に、のような、ではありません 要素は、それが全体のボックスの周りだ。 1074 00:44:07,550 --> 00:44:10,900 それはのようなものを意味します 背景はそれには適用されません。 1075 00:44:10,900 --> 00:44:13,550 そして、それは基本的に言う、 のような、私は何もしたくない 1076 00:44:13,550 --> 00:44:15,230 私のためにこれだけの空間で。 1077 00:44:15,230 --> 00:44:17,470 だからここのように私たちは持っている 10ピクセルの余白。 1078 00:44:17,470 --> 00:44:23,100 10ピクセル以内だから、何もしない 私の隣にする必要があります。 1079 00:44:23,100 --> 00:44:26,210 つまり、そののようなものだ スペースはなく一種のではない。 1080 00:44:26,210 --> 00:44:29,215 だから、非常にだ ボックスモデルの基礎。 1081 00:44:29,215 --> 00:44:30,090 それは理にかなっていますか？ 1082 00:44:30,090 --> 00:44:33,830 1083 00:44:33,830 --> 00:44:34,550 クール、クール。 1084 00:44:34,550 --> 00:44:35,800 ALLISON BUCHHOLTZ-AU：恐ろしい。 1085 00:44:35,800 --> 00:44:37,890 だから今私はちょうど私達を思う 私たちのクールな資源を持っている 1086 00:44:37,890 --> 00:44:41,220 私たちはあなたたちを取るだろうと 非常に迅速にスルー。 1087 00:44:41,220 --> 00:44:44,815 そして、私たちはよくactually--よ、 我々はまだインターネットがありますか？ 1088 00:44:44,815 --> 00:44:47,860 >> TOMAS Reimersの：レッツ 私はup--開くことができるかどうかを確認 1089 00:44:47,860 --> 00:44:50,040 私なら、私はちょうど見てみましょう すぐにインターネットを得ることができます 1090 00:44:50,040 --> 00:44:53,317 アリソンは何について話している間 アリソンは、話をしたいと考えています。 1091 00:44:53,317 --> 00:44:55,150 ALLISON BUCHHOLTZ-AU： だからbasically--私はしないでください 1092 00:44:55,150 --> 00:44:57,930 私はこの時点で言うことができる他に何を知っています。 1093 00:44:57,930 --> 00:45:01,340 しかし、これらは一部です 本当に良いリソース。 1094 00:45:01,340 --> 00:45:04,629 これらは、そのものです トーマスと私が使用している 1095 00:45:04,629 --> 00:45:06,420 そして我々実際にその このために予備校するために使用する。 1096 00:45:06,420 --> 00:45:09,940 W3Schoolsのは1であることを 男は前に見たはず。 1097 00:45:09,940 --> 00:45:12,440 私たちはそれをお勧めします CSSを使用した多くのこと。 1098 00:45:12,440 --> 00:45:15,060 私はそれをお勧めします知っている 私のセクションのすべての時間。 1099 00:45:15,060 --> 00:45:21,050 >> 素晴らしいことの一つは、それということです CSSを使用した混乱の種類にあなたを可能にする 1100 00:45:21,050 --> 00:45:23,830 と変更を参照してください。 この瞬間において、 1101 00:45:23,830 --> 00:45:25,920 のような、二重窓は、それが持っていることを表示します。 1102 00:45:25,920 --> 00:45:29,980 だから、心配する必要はありません 自分のWebページを設定する、 1103 00:45:29,980 --> 00:45:33,090 またはあなたの中にバーチャルホストを設定する ローカルアプライアンスとローカルホスト、 1104 00:45:33,090 --> 00:45:34,980 そしてすべてのものの作業を取得する。 1105 00:45:34,980 --> 00:45:36,830 これは、右ページ内に埋め込まれています。 1106 00:45:36,830 --> 00:45:39,042 >> そしてそれは、これらの小さなを持って そのあなたができるレッスン 1107 00:45:39,042 --> 00:45:40,750 学ぶために通過 セレクタの詳細、 1108 00:45:40,750 --> 00:45:44,610 またはあなたの操作について学ぶ フォント、または背景、または画像。 1109 00:45:44,610 --> 00:45:46,990 そして、あなたはこれらを持っている 瞬間的な結果は、あなた 1110 00:45:46,990 --> 00:45:49,310 いずれかを行う必要はありません のための他の準備作業。 1111 00:45:49,310 --> 00:45:51,060 だから私は、W3Schoolsのが大好きです。 1112 00:45:51,060 --> 00:45:51,960 それは素晴らしいです。 1113 00:45:51,960 --> 00:45:52,670 それが動作していますか？ 1114 00:45:52,670 --> 00:45:52,950 >> TOMAS Reimersの：うん。 1115 00:45:52,950 --> 00:45:53,720 いいえ、そうではありません。 1116 00:45:53,720 --> 00:45:55,636 あなたは私が試してみたいか と私のコンピュータを再起動します？ 1117 00:45:55,636 --> 00:45:56,410 それともto--たいです 1118 00:45:56,410 --> 00:46:01,490 >> ALLISON BUCHHOLTZ-AU：私は意味、 まあ、これはまた、オンラインになります。 1119 00:46:01,490 --> 00:46:02,740 すべてのスライドがオンラインになります。 1120 00:46:02,740 --> 00:46:05,470 だから、僕は非常にこれらをやってお勧めします。 1121 00:46:05,470 --> 00:46:07,880 >> これは同じように素晴らしいです チートシートのように。 1122 00:46:07,880 --> 00:46:10,690 それはちょうど、すべての基本的です あなたが持っていることを指令する。 1123 00:46:10,690 --> 00:46:13,070 あなたが最初にしているときには素晴らしいことだ あなたのウェブサイトを始め。 1124 00:46:13,070 --> 00:46:15,080 多分あなたがいないため、 すべてに取得したい 1125 00:46:15,080 --> 00:46:17,355 本当の核心 デザイン·重いもの。 1126 00:46:17,355 --> 00:46:20,230 あなただけの方法でそれをフォーマットする必要が その種の感覚と意志を作る 1127 00:46:20,230 --> 00:46:21,490 当分のために行う。 1128 00:46:21,490 --> 00:46:23,580 そして、あなたが本当にしたい場合は、 それに入るために、私が知っている 1129 00:46:23,580 --> 00:46:27,240 これは、のように、のいずれか トマスのお気に入りの参照。 1130 00:46:27,240 --> 00:46:30,130 私たちは、それを使用していた 準備は、それは素晴らしいです。 1131 00:46:30,130 --> 00:46:33,030 これは、Mozillaの開発者。 1132 00:46:33,030 --> 00:46:36,490 >> TOMAS Reimersの：だからMozillaがある Firefoxを作る人。 1133 00:46:36,490 --> 00:46:40,290 そして、それは単に、自分の開発者 私が思うの参照は、素晴らしいです。 1134 00:46:40,290 --> 00:46:44,870 そして、それは素晴らしいがある リソースのリスト。 1135 00:46:44,870 --> 00:46:45,530 だから我々はhave-- 1136 00:46:45,530 --> 00:46:48,060 >> ALLISON BUCHHOLTZ-AU： そして、最後のノートがある 1137 00:46:48,060 --> 00:46:50,120 あなたがしようとしているとき あなたのウェブサイトを設計し、 1138 00:46:50,120 --> 00:46:53,550 物事からインスピレーションを描く あなたはかなりあると思う。 1139 00:46:53,550 --> 00:46:56,340 要素の検査、 ソースコードを検査する 1140 00:46:56,340 --> 00:46:59,370 スーパー役立ちます 把握しようとして用 1141 00:46:59,370 --> 00:47:02,080 どのようにあなた自身のウェブサイトをスタイルに。 1142 00:47:02,080 --> 00:47:04,540 >> 多くの場合、私は最高のように感じる 道、実験に加えて、 1143 00:47:04,540 --> 00:47:06,290 単に見ることである かなりあるもの。 1144 00:47:06,290 --> 00:47:09,810 私はそれだけにハード本当にだ見つける 種類の自分で物事を設計し、 1145 00:47:09,810 --> 00:47:11,090 特に初め。 1146 00:47:11,090 --> 00:47:14,740 だから、ウェブサイトをご覧ください あなたが見て楽しむこと。 1147 00:47:14,740 --> 00:47:16,880 作るものを見つけ出す 彼らはあなたにアピール。 1148 00:47:16,880 --> 00:47:19,170 そして、お気軽に 試してみて、それを複製する。 1149 00:47:19,170 --> 00:47:20,410 >> TOMAS Reimersの：右。 1150 00:47:20,410 --> 00:47:23,120 でも、ウェブサイトのような このように、あなたが見ることができます 1151 00:47:23,120 --> 00:47:25,460 一番上のDIVは間違いなくあります。 1152 00:47:25,460 --> 00:47:29,920 そして、あなたは内の別のdivを持っている ここでは、CSS Awesomenesとなる。 1153 00:47:29,920 --> 00:47:32,480 そして、あなたはここで、リンクの束を持っている。 1154 00:47:32,480 --> 00:47:34,770 あなたは本当にただ検査した場合 要素は、あなたがの並べ替えることができます 1155 00:47:34,770 --> 00:47:38,520 ウェブサイトを何見始める ように見える、とどのようにすることができます 1156 00:47:38,520 --> 00:47:40,493 私がしたい場合ことを再作成します。 1157 00:47:40,493 --> 00:47:41,890 それは理にかなっていますか？ 1158 00:47:41,890 --> 00:47:43,670 だから我々は唯一の左3分している。 1159 00:47:43,670 --> 00:47:46,380 質問だから？ 1160 00:47:46,380 --> 00:47:47,650 それらのいずれか？ 1161 00:47:47,650 --> 00:47:48,350 はい。 1162 00:47:48,350 --> 00:47:50,780 >> 読者：色の場合 長方形、どのようにでしょう 1163 00:47:50,780 --> 00:47:53,499 あなたがそれを望んでいない場合は、have-- 、ページ全体を横断できただろう 1164 00:47:53,499 --> 00:47:56,400 あなたはそれだけで渡って行く作った 半ページまたはテキストだけ？ 1165 00:47:56,400 --> 00:47:59,660 >> TOMAS Reimersの：うん、絶対に。 1166 00:47:59,660 --> 00:48:02,780 だから私は実際に見てみましょう。 1167 00:48:02,780 --> 00:48:04,670 私は2つのアイデアを持っている。 1168 00:48:04,670 --> 00:48:07,265 あなたは、すべてのだから、最初の またパーセントを使用することができます。 1169 00:48:07,265 --> 00:48:08,140 >> 聴衆：本当に？ 1170 00:48:08,140 --> 00:48:11,260 >> ALLISON BUCHHOLTZ-AU：だから何か ルックアップするためには、相対的な位置である。 1171 00:48:11,260 --> 00:48:13,385 それは、我々何か に入るために時間を持っていない、 1172 00:48:13,385 --> 00:48:16,392 それは私が間違いなく何か あなたたちは、チェックアウトをお勧めします。 1173 00:48:16,392 --> 00:48:17,580 >> TOMAS Reimersの：だからパーセント。 1174 00:48:17,580 --> 00:48:21,524 そして、我々はそれを作ったかを見る 幅のわずか50％？ 1175 00:48:21,524 --> 00:48:24,190 ALLISON BUCHHOLTZ-AU：あなたの場合 実際のピクセル数を知っている、 1176 00:48:24,190 --> 00:48:25,780 あなたがそのようにより正確にすることができます。 1177 00:48:25,780 --> 00:48:27,200 あなたはそれの周りいじることができます。 1178 00:48:27,200 --> 00:48:27,700 しかし、50％。 1179 00:48:27,700 --> 00:48:31,970 我々はブラウザのサイズを変更した場合、 それは小さくなるだろう。 1180 00:48:31,970 --> 00:48:35,250 >> TOMAS Reimersの：まあ、それはだ 基本的には50パーセント、今、私は思います。 1181 00:48:35,250 --> 00:48:38,820 これは、利益率50％だし、 それに追加されました。 1182 00:48:38,820 --> 00:48:40,100 CSSは癖をたくさん持っている。 1183 00:48:40,100 --> 00:48:43,195 だから、今はこれです ページ幅の50％。 1184 00:48:43,195 --> 00:48:46,860 しかし、あなたは10を持っていることを覚えている ピクセルは、それぞれの側から取り出さ。 1185 00:48:46,860 --> 00:48:49,700 ですから、反対のことを移動した場合 ブラウザの左端、 1186 00:48:49,700 --> 00:48:51,550 それは50％のようになります。 1187 00:48:51,550 --> 00:48:53,884 繰り返しますが、私はCSSができる、言ったように 推測·アンド·チェックがたくさんあること。 1188 00:48:53,884 --> 00:48:56,049 同様に、あなたが何かだと思う 1ように動作するつもりは、 1189 00:48:56,049 --> 00:48:57,805 それは全く違うように動作します。 1190 00:48:57,805 --> 00:48:59,420 >> ALLISON BUCHHOLTZ-AU： そして、あなたはただ、賢く取得 1191 00:48:59,420 --> 00:49:02,020 そしてあなただけの良くなる それのための直感あなたが一緒に移動する。 1192 00:49:02,020 --> 00:49:02,730 >> TOMAS Reimersの：そしてそれ 悪いと悪化します。 1193 00:49:02,730 --> 00:49:03,496 だから、実際にはレースだ。 1194 00:49:03,496 --> 00:49:05,454 >> ALLISON BUCHHOLTZ-AU： それはスーパー心強いです。 1195 00:49:05,454 --> 00:49:07,070 私たちは、彼らがCSSを好きにしたい。 1196 00:49:07,070 --> 00:49:08,810 >> TOMAS Reimersの：CSSは素晴らしいです。 1197 00:49:08,810 --> 00:49:10,354 それを忘れないでください。 1198 00:49:10,354 --> 00:49:11,020 その他の質問？ 1199 00:49:11,020 --> 00:49:14,297 >> ALLISON BUCHHOLTZ-AU：一つのこと。 1200 00:49:14,297 --> 00:49:14,880 他に何か？ 1201 00:49:14,880 --> 00:49:15,140 クール。 1202 00:49:15,140 --> 00:49:15,690 >> TOMAS Reimersの：恐ろしい。 1203 00:49:15,690 --> 00:49:18,523 >> ALLISON BUCHHOLTZ-AU：さて、あなたなら 男は、後でご質問がある 1204 00:49:18,523 --> 00:49:20,919 私たちはいつもの通りに、常に利用可能だ。 1205 00:49:20,919 --> 00:49:22,960 あなたは、おそらくいくつかが表示されます 最終的なプロジェクトのために私たちの 1206 00:49:22,960 --> 00:49:24,280 間違いハッカソンで。 1207 00:49:24,280 --> 00:49:25,200 >> TOMAS Reimersの：もちろんです。 1208 00:49:25,200 --> 00:49:25,720 かつ公正で。 1209 00:49:25,720 --> 00:49:26,560 >> ALLISON BUCHHOLTZ-AU：かつ公正で。 1210 00:49:26,560 --> 00:49:26,840 ああ。 1211 00:49:26,840 --> 00:49:28,130 >> TOMAS Reimersの：楽しみに あなたのawesome--のすべてを見て 1212 00:49:28,130 --> 00:49:29,420 >> ALLISON BUCHHOLTZ-AU：私たちは、表示されます あなたの素晴らしいウェブサイトのすべて 1213 00:49:29,420 --> 00:49:30,572 それは美しくなります。 1214 00:49:30,572 --> 00:49:32,780 TOMAS Reimersの：あなたは、常にすることができます 、のような、ウェブサイトを参照してください。 1215 00:49:32,780 --> 00:49:36,234 誰が、その後のように、優れたCSSとを持っていた CSSをしようとしなかった人のように。 1216 00:49:36,234 --> 00:49:39,150 ALLISON BUCHHOLTZ-AU：また、別の に見ての事、もう一つ 1217 00:49:39,150 --> 00:49:40,445 ブートストラップです。 1218 00:49:40,445 --> 00:49:41,805 だから、ブートストラップは素晴らしいです。 1219 00:49:41,805 --> 00:49:42,240 >> TOMAS Reimersの：グーグル、もしyou-- 1220 00:49:42,240 --> 00:49:43,573 >> ALLISON BUCHHOLTZ-AU：グーグルそれ。 1221 00:49:43,573 --> 00:49:44,340 それは素晴らしいです。 1222 00:49:44,340 --> 00:49:45,620 あなたはそれを好きになる。 1223 00:49:45,620 --> 00:49:48,000 そして今、あなたが持っている CSSの基本的な理解、 1224 00:49:48,000 --> 00:49:50,340 それは多くの方が理にかなっているでしょう。 1225 00:49:50,340 --> 00:49:50,890 恐ろしい。 1226 00:49:50,890 --> 00:49:51,480 おかげで、みんな。 1227 00:49:51,480 --> 00:49:53,330 >> TOMAS Reimersのは：どうもありがとう。 1228 00:49:53,330 --> 00:49:54,219