>> 祈るFARNHAM：今日、私はするつもりだ HTMLについて少し話し、
ハイパーテキストマークアップ言語。
あなたは、これらの日どこにでもHTMLを参照してください。
実際には、あなたがこれを見ている場合 ブラウザ内のビデオ、あなたがしている
今のHTMLを見て。
HTMLはプログラミング言語ではありません、 むしろ、それが使用するマークアップ言語の
ページをレンダリングするためのWebブラウザ インターネット上の。
>> だから、書いているかを正確に、頼むかもしれない 異なるHTMLでWebページ
プログラミングでプログラムを書くことから C言語のような言語？
さて、Cは非常に厳しいとの言語です である必要があり、構文規則
それを実行する前にコンパイル。
あなたは今まで含めるのを忘れてしまった場合 ステートメントの末尾にセミコロン
あなたのCコードは、私が話しているか知っている 厳密な構文に関しては約。
>> Webブラウザは、しかし、もう少しです それはHTMLになると寛容。
あなたのHTMLは文法的でなくても、 正しい、あなたのページは、まだ可能性があり
それは可能性があり、ブラウザによって表示されますが、 あなたが意図したとおりに見ていない。
だから、に常に最善です ルールに従います。
直感を得るための最良の方法 物事がどのように機能するかについては、ある
例を経る。
>> それでは、私たちがここにあることは基本的なものです Webページの青写真。
おそらく、多くのことに気づいた 山括弧の間にある。
さて、それらは単にタグです。
タグは、基本的には、Webブラウザに通知 つまり、ちょっと、何か
あなたのように来ている。
しかし覚えておいて、あなたが開くたびに タグは、あなたがされれば、それを閉じる必要があり
それを使用して行う。
>> だから例えば、私はセクションを開き、 オープンして、コードの
ブラケット本体、閉じ括弧。
私はその後、私の、この場合には、いくつかのテキストを追加 私はに行ってきましたし、最初のウェブページ
このセクションを閉じる、私が使用して、ほぼ この時間を除いて同一のタグ
フォワードボディの前にスラッシュ。
一般的に、これはあなたがしている形式です あなたが開いているときはいつでも使用するつもり
とタグを閉じる。
一緒に、開始タグと終了タグ 要素と呼ばれるものが構成されている。
>> あなたが最初の行を見ると、あなたがよ 続く感嘆符を参照してください
のDOCTYPE HTML。
これは実際にはブラウザを語っている ファイルは、ウェブページであること
HTMLで記述された。
HTMLタグは、基本的に言います、 ここではいくつかのHTMLが付属しています。
その後、我々はしてheadタグを持っている その中にタイトルタグ。
あなたのように考えることができheadタグ ために来る構成するHTMLコード
あなたのWeb​​ページのの大部分 実際のコンテンツ。
>> 一般的に、あなたのタイトルを置く ここで、ウェブページ、いくつかはありますが
表示されることが他のタグ ここにも。
次のWebページの本体は、付属してい あなたのウェブサイトの実際の肉と骨。
この例では、単純に入れてきた 文、私の最初のウェブページ、
これ、私たちは私たちのサイトを実行すると、検索します このような小さなもの。
弊社のWebページには、あまりにも奇妙ではありません、 しかし、心配しないでください。
我々はすぐにそれを飾るだろう。
>> したがって、上記のHTML、私たちはあなたを非常にあげる Webページの基本テンプレート、
空想は何もない、ただ裸の骨。
しかし、私は、Webページを作成していた場合、 私が追加したい場合はどう
私自身、言う、の絵？
まあ、私はそれを行うことができます。
する方法はいくつかあります あなたのサイトに画像を追加。
画像は、同じフォルダ内にある場合 HTMLファイルは、あなたがリンクすることができ
このようなパスを介して画像。
>> あなたは、その後、画像タグで開く におけるalt属性インによって
イメージのソース。
alt属性の値はいくつかある 場合の代替テキスト、ユーザーができない
画像を参照してください。
別の方法としては、にリンクすることができます このような完全なURLを経由して画像。
今、そのウェブサイトは実際に存在していない、 しかしの絵があった場合には
そのアドレスで私は、私が使用することができます インクルードするソ​​ースURL
私のウェブサイト上でそのイメージ。
いずれにしても、あなたはずっとで終わる きれいウェブサイト、次のようなもの。
>> まあ、それはかなりクールだが、私は親切 のここにもいくつかのテキストが欲しい。
それでは、ただ何かを追加してみましょう 上記の超簡単
ヘッダのようなイメージ。
私がこれまで行ってきたすべてのヘッダーを使用している タグ、H1、および改行タグ、BR。
ヘッダータグは、フォントが少しします 少し大きく、より目立つ。
他に改行タグ、 手が冷たいの一種である。
他のほとんどのタグとは異なり、次のものがありません 開閉ブレークタグだけ
1は、上に示した。
ブレークはコンテンツがないためです そして、したがって、空の要素である。
>> このような空要素は、あなたが開くことができます 単に同時に閉じる
にスラッシュを含む 初期化宣言の終わり。
だから今私のウェブサイトが少し見える このようなもの。
より良いが、それはちょっと感じている 行き止まりのような。
脇に行くためにどこにもあります このメイン·ページから。
さて、で、その問題を修正しましょう リンクを含む。
>> 私がここで何をするつもりだと、使用している 属性には、Aと表記して作る
画像へのリンクを、のは、CS50テレビましょう。
そのように、誰もが私にクリックするたびに、 そのブラウザがに送信されます
別の、おそらくより 便利なWebページ。
私はのサイズを最小化しなければならなかった 弊社のWebページがあるので、少しテキスト
より高度になっ。
うまくいけば、それはまだ明らかだ。
私のウェブサイトは、まったく同じに見えます 今、私は写真をクリックするたびに、
私のブラウザは、別のものを開きます CS50.tv Webページのタブ。
>> 最後に、のは私がスタイルに行くよと言ってみましょう 後でCSSを使用してこのウェブサイト。
CSSとして知られるものである カスケードスタイルシート。
そして、それは基本的に、効率的に提供 編集する方法とスタイル
コー​​ドの類似したブロック。
私は自分のHTMLにを整理始めたい それが簡単に後でスタイルを作る。
ここで、私は2つの異なる種類を設定 私のコードを整理するのに役立つ識別子。
私は内部のID属性を使用しました 分割、divタグ、および私が使ってきた
クラスは、内部の属性 別のdivタグ。
>> idとclass属性 同様に機能します。
唯一の違いは、あなただけ持つことができている 一つの要素、特定のIDが、
任意の数の要素 クラスを共有することができます。
したがって、たとえば、私は、クラスを使用することができます 画像を複数回、しかし私はできません
別の部門を作成 IDトップと。
私は、CSSに入っていないが、 一般的に使用される他の言語
HTMLと一緒に、かつて私はスタイリングを開始 CSSを使用した私のコードは、私はこれらを使用することができます
影響を受けた組織の属性 私のWebページの美学。
>> 部門トップの中のすべて 類似したスタイリングや任意のを持つことになります
へのHTMLの私のグループの他のグループ クラスImageは、同様の外観を共有することになります。
これは編集しようとするよりもはるかに簡単です とスタイル画像やブロックの
個別テキスト。
>> だから我々はどのように基礎の上に行ってきました HTMLでWebページを作る。
HTMLは、あまりにも他の機能の束を持っている 他の言語と組み合わせた場合、その
CSSやJavaScriptのような、本当にできる ページを目立たせる。
に慣れるための最良の方法 HTMLは、それを周りだけで台無しにされる
どのような動作し、何をしないことを参照して下さい。
>> 私の名前は祈るファーナムです。
これはCS50である。
>> したがって、たとえば、私が使用することができます クラス画像 -
いや、非常に多くの属性があります。
私の名前は祈るファーナムです。
これは、CS 650です。
私はCSSを言いたい。
これはCSSです。