1
00:00:00,000 --> 00:00:00,290

2
00:00:00,290 --> 00:00:03,310
>> スピーカー：それがHTMLではないことが判明
あなたの中に使用できる唯一の​​言語

3
00:00:03,310 --> 00:00:03,895
Webページの。

4
00:00:03,895 --> 00:00:08,100
あなたは、CSSと呼ばれるものを使用することも、
カスケーディングスタイルシートだけでなく、。

5
00:00:08,100 --> 00:00:12,120
CSSでは、はるかを指定することができます
ウェブの正確美学

6
00:00:12,120 --> 00:00:16,930
レイアウトとサイズを含むページ、および
色やフォントなど多くの。

7
00:00:16,930 --> 00:00:20,820
たとえば、のはWebページを作成してみましょう
aはここに呼ばCSS0

8
00:00:20,820 --> 00:00:22,740
ジョン·ハーバード、言う、のためのホームページです。

9
00:00:22,740 --> 00:00:25,480
>> このページでは、ジョン·ハーバードのがあるでしょう
名前、されるの下に

10
00:00:25,480 --> 00:00:28,500
彼の訪問者のための素敵なメッセージを、下に
これで、フッターになります

11
00:00:28,500 --> 00:00:30,590
、いくつかの著作権情報を言う。

12
00:00:30,590 --> 00:00:34,650
これを行うには、の3部門を定義してみましょう
タグを使用して、ページの

13
00:00:34,650 --> 00:00:35,670
DIVと呼ばれる。

14
00:00:35,670 --> 00:00:43,880
開閉金具DIV、ジョン·ハーバード、
ブラケットDIV、別のオープンブラケットDIV、

15
00:00:43,880 --> 00:00:48,330
そして今、我々は何かを指定します
のような、私のホームページへようこそ！

16
00:00:48,330 --> 00:00:50,420
とだけでなく、のはこのDIVを閉じてみましょう。

17
00:00:50,420 --> 00:00:53,700
>> そして今、3番目と最後の
DIV、著作権。

18
00:00:53,700 --> 00:00:58,250
ただの空想であると、私は今のHTMLを使ってみましょう
エンティティを表す記号

19
00:00:58,250 --> 00:01:01,140
あなたがいないそうでない可能性の文字
お使いのキーボードのタイプ。

20
00:01:01,140 --> 00:01:07,490
特に、私は何をするつもりだ
アンパサンド、ポンド、169、セミコロン。

21
00:01:07,490 --> 00:01:10,620
それは数値コードで判明
著作権記号のため。

22
00:01:10,620 --> 00:01:14,260
その後のジョンハーバード大学を指定してみましょう
ここで一番下にある。

23
00:01:14,260 --> 00:01:17,180
それではDIVを閉じ、ファイルを保存してみましょう。

24
00:01:17,180 --> 00:01:18,910
>> さて、このdivタグとは何でしょうか？

25
00:01:18,910 --> 00:01:21,970
divタグは、単純に割り算を定義
本質的には、ページの

26
00:01:21,970 --> 00:01:23,310
矩形領域。

27
00:01:23,310 --> 00:01:26,850
だから、時間のこの時点で、私は3を持っている
矩形領域、上部に1

28
00:01:26,850 --> 00:01:27,620
他の。

29
00:01:27,620 --> 00:01:30,610
だから今のところ、効果はほぼ同じである
私は3パラグラフを持っていたのに。

30
00:01:30,610 --> 00:01:33,490
しかし、我々は非常に限り表示されません
それらの間にある空白文字。

31
00:01:33,490 --> 00:01:36,170
>> そのを変更する、のはこのファイルを保存してみましょう
権限、およびのため見てみる

32
00:01:36,170 --> 00:01:37,990
Chromeで瞬間。

33
00:01:37,990 --> 00:01:43,040
ます。chmod a +がCSS0.html rを。

34
00:01:43,040 --> 00:01:52,440
Chromeと訪問を開くようになりましレッツ
http://localhost.CSS0.html。

35
00:01:52,440 --> 00:01:54,630
確かに、ここのホームページです
ジョン·ハーバードのため。

36
00:01:54,630 --> 00:01:59,370
それでは、もう少しそれを型にはめるみよう
正確にいくつかのCSSを使用して。

37
00:01:59,370 --> 00:02:03,510
>> 背中のgeditに、のはこのに行こう
最初のdivタグとスタイルを追加

38
00:02:03,510 --> 00:02:11,060
私がしたいことを指定する属性
たとえば、フォントのサイズ、36ピクセル、またはピクセル。

39
00:02:11,060 --> 00:02:15,650
と私は、このフォントの重さをみたい
むしろデフォルトよりも大胆であるためには、

40
00:02:15,650 --> 00:02:16,980
これは正常です。

41
00:02:16,980 --> 00:02:21,170
第二のdivのために、のは指定でき
されている別のスタイル属性

42
00:02:21,170 --> 00:02:25,550
フォント24画素のサイズなので、
少し小さい。

43
00:02:25,550 --> 00:02:28,410
セミコロンの後に閉じる引用符。

44
00:02:28,410 --> 00:02:33,255
>> 最後に、この第三のdivに、のはやらせる
スタイルは、引用符、フォントサイズに等しく、

45
00:02:33,255 --> 00:02:35,340
それでは12ピクセル今回言わせて。

46
00:02:35,340 --> 00:02:37,280
セミコロンの後に閉じる引用。

47
00:02:37,280 --> 00:02:40,200
私が持っているように見えることをして注意してください
のための様式化の指定ビット

48
00:02:40,200 --> 00:02:43,770
使用して、これらの3 div要素のそれぞれ、
それは、CSSを判明。

49
00:02:43,770 --> 00:02:47,820
実際には、あなたが参照してください。構文
これらの二重引用符の間のCSSであり、

50
00:02:47,820 --> 00:02:50,620
特にCSSプロパティ
値を持つ。

51
00:02:50,620 --> 00:02:53,910
そして、私が持っていた最初のタグのために
このような2つのプロパティ、フォントサイズや

52
00:02:53,910 --> 00:02:57,290
フォントの太さ、私は単純に分離
セミコロンで。

53
00:02:57,290 --> 00:02:59,940
>> 今、ちょうど、スタイルのために、私
も含まれてセミコロンで

54
00:02:59,940 --> 00:03:00,880
各行の終わり。

55
00:03:00,880 --> 00:03:04,270
しかし、彼らは必ずしも必要ではありませんね、
あなたが1つしかない場合は特に

56
00:03:04,270 --> 00:03:05,580
プロパティが定義されている。

57
00:03:05,580 --> 00:03:08,370
それでは、ファイルを保存して再ロードしてみましょう
Chromeであり、何を参照

58
00:03:08,370 --> 00:03:11,000
正味の効果である。

59
00:03:11,000 --> 00:03:13,470
バックChromeでここに、
のリロードをクリックしてみましょう。

60
00:03:13,470 --> 00:03:15,800
>> 今、私たちはもう少し面白いを持っている
ジョンのホームページ

61
00:03:15,800 --> 00:03:19,000
ハーバード大学とそれによって最初の行
それの内側にある彼の名前、

62
00:03:19,000 --> 00:03:23,470
最初のdivは、また、36ピクセルの高さで、
太字、それによって二行目、

63
00:03:23,470 --> 00:03:27,340
その第二のdivである、24である
太字背が高くはなく、ピクセル。

64
00:03:27,340 --> 00:03:31,500
そしてそれによって、第3の3行目
DIVも12ピクセルの高さで、

65
00:03:31,500 --> 00:03:32,610
太字はない。

66
00:03:32,610 --> 00:03:35,380
しかし、今、私はシフトしたいとします
上のこのテキストのすべて

67
00:03:35,380 --> 00:03:36,650
それが中央だようになっている。

68
00:03:36,650 --> 00:03:40,480
>> Iは、個々の各々を整列させることができ
中心にされているものとしてdiv要素。

69
00:03:40,480 --> 00:03:45,330
しかし、もっと簡単に、私はそれらをラップすることができ
第四のDIVの内側に3 div要素、

70
00:03:45,330 --> 00:03:49,360
親のdiv、いわば、および指定する
そのDIVとそのすべてのこと

71
00:03:49,360 --> 00:03:52,610
子孫であるべき
テキスト整列センター？

72
00:03:52,610 --> 00:03:54,120
それでは見てみましょう。

73
00:03:54,120 --> 00:03:58,510
>> geditの内、のに戻りましょう、私の
ボディを持つ新しいDIVまでトップを追加

74
00:03:58,510 --> 00:04:04,460
DIV、スタイルは引用引用終わり等しい
テキストALIGNセンター、近くに

75
00:04:04,460 --> 00:04:06,250
セミコロンの後の引用。

76
00:04:06,250 --> 00:04:10,280
そして今、のは先にインデントをすべて手放す
我々の前に入力されたこれらの行の。

77
00:04:10,280 --> 00:04:15,040
そして、第3のdivの下に、みましょう
この新しいDIVを閉じます。

78
00:04:15,040 --> 00:04:18,829
>> 換言すれば、これらの3つの理由
オリジナルのdiv要素は今の子供たちなので、に

79
00:04:18,829 --> 00:04:22,110
新しい親DIVの、話し、私がしました
私は揃えたいと思いことを指定

80
00:04:22,110 --> 00:04:26,140
中心部にある、親のdivのテキスト
ページの、そのプロパティはなり

81
00:04:26,140 --> 00:04:28,290
これらのすべての子に継承さ。

82
00:04:28,290 --> 00:04:32,370
確かに、のは、ファイルを保存してみましょうと、
ブラウザで見てください。

83
00:04:32,370 --> 00:04:34,650
それではChromeでリロードしてみましょう。

84
00:04:34,650 --> 00:04:37,540
そしてそこに私たちもよりよい、それを持っている
ジョン·ハーバードのホームページ。

85
00:04:37,540 --> 00:04:39,872