>> DAVEN FARNHAM：今天，我要 說一下關於HTML，
超文本標記語言。
你看到的HTML到處都是這些天。
事實上，如果你在看這個 在瀏覽器中的視頻，你
查看HTML現在。
HTML不是一種編程語言， 相反，它是通過使用一種標記語言
Web瀏覽器渲染網頁 在互聯網上。
>> 所以，你可能會問，究竟是怎麼寫 網頁中的HTML不同
從編程編寫一個程序 像C語言？
那麼，C是非常嚴格的語言 該需要是語法規則
編譯後才能運行。
如果你曾經忘記了包括 分號在一個語句的結束
你的C代碼，你知道我在說什麼 大約在問候嚴格的語法。
>> 雖然Web瀏覽器，是一個比較 原諒，當涉及到的HTML。
即使你的HTML在語法上不 正確的，你的頁面可能仍然是
在瀏覽器中顯示，但它可能 不看你意。
因此，它總是最好 遵守規則。
獲得一個直覺的最佳方式 有關如何工作的事情是
經過一個例子。
>> 所以，我們這裡是一個基本的 藍圖的網頁。
你可能已經注意到了很多東西 在尖括號中。
那麼，那些都只是標籤。
標籤基本上告知Web瀏覽器 那個，嘿嘿，東西
是未來的路。
但請記住，當你打開一個 標籤，你需要關閉它，一旦你有
用它做。
>> 因此，例如，我打開一節 與開放代碼
支架體，右方括號。
我再添加一些文字，在這種情況下，我 第一個網頁然後我去的時候
結束這一節，我用的差不多 具有相同的標籤，除了這一次
體前正斜杠。
在一般情況下，這是你的格式 去每當你打開使用
標記和結束標記。
總之，開放標記和結束標記 構成所謂的一個元素。
>> 如果你看第一行，你會 看到一個感嘆號後面
DOCTYPE HTML。
這真的只是告訴瀏覽器 該文件是一個網頁
用HTML編寫的。
HTML標記本質上說， 這裡談到一些HTML。
然後我們有一個頭與標籤 裡面一個標題標籤。
head標籤你能想到的作為 自帶的包括HTML程式碼
你的大部分網頁的 實際內容。
>> 一般情況下，你把標題您 這裡的網頁，雖然有一些
可能出現的其他標籤 在這裡也。
接下來是您網頁的身上， 您的網站實際的肉和骨頭。
在我們的例子中，我們只是把一個簡單的 一句話，我的第一個網頁，
其中，如果我們運行我們的網站，看起來 有點像這樣。
我們的網頁是不是太奇怪， 但不要擔心。
我們很快就會雲杉它。
>> 所以上面的HTML，我們會給你一個非常 基本模板的網頁，
沒什麼特別的，只是光禿禿的骨頭。
但是，如果我創建一個網頁， 如果我想添加一個
，比如說我自己的圖片？
好吧，我能做到這一點。
有幾個方法可以 將圖像添加到您的網站。
如果圖像是在同一文件夾中 您的HTML文件，您可以鏈接到
通過路徑的圖像是這樣的。
>> 你打開了一個圖像標記後面 通過在alt屬性
源的圖像。
alt屬性的值僅僅是一些 在另一種情況下，一個文本用戶不能
查看該圖像。
或者，您也可以鏈接到 通過一個完整的URL的圖像，像這樣。
現在，該網站實際上並不存在， 但如果有一個圖像
我在這個地址，我可以使用 來源網址，包括
它在我的網站形象。
無論哪種方式，你結束了一個多 漂亮的網站，這樣的事情。
>> 嗯，這是很酷，但我種 的想一些文字在這裡。
因此，讓我們剛剛添加的東西 上述超簡單
圖像，類似的標題。
所有我到目前為止所做的是使用頭 標籤，H1和換行符標籤，BR。
標題標籤使字體有點 位更大，更突出。
換行標記，對其他 手，是那種很酷。
與大多數其他標籤，你沒有 在開幕式和閉幕式換行標記，只是
上面所示的1。
這是因為休息沒有內容 因此，是一個空元素。
>> 這樣的空元素，你可以打開 同時密切只需
包含斜線的 在最初宣布結束。
所以現在我的網站看起來有點 這樣的事情。
一種更好的，但感覺 就像一個死胡同。
有無處可去一邊 從這個主頁。
好吧，讓我們來解決，通過 包括一個鏈接。
>> 我什麼都做的，是使用 由A表示的屬性，使
圖像的鏈接，讓我們說，CS50電視。
這樣一來，只要有人點擊了我， 他們的瀏覽器將被引導到
另外，可能更 有用的網頁。
我不得不盡量減少大小 文字有點，因為我們的網頁是
越來越先進。
但我希望，它仍然是清晰的。
我的網站看起來一模一樣的唯一 現在，每當我點擊圖片，
我的瀏覽器會打開另一個 標籤為CS50.tv網頁。
>> 最後，讓我們說我要去風格 本網站以後使用CSS。
CSS是被稱為一 級聯樣式表。
它基本上提供了一個高效 的方式來編輯和風格
相似的塊的代碼。
我要開始組織我的HTML 使其更易於樣式以後。
在這裡，我設置了兩種不同的 標識符來幫助組織我的代碼。
我用的ID屬性裡面 部門或div標籤，我已經使用了
裡面的類屬性 另一個div標籤。
>> id和class屬性 類似的工作。
唯一的區別是只能有 一種元素，具體的ID，但
任意數量的元素 可以共享一個類。
因此，例如，我可以使用類 圖像多次，但我不能
創建另一個師 與ID頂部。
雖然我沒有深入研究的CSS， 常用的另一種語言
旁邊的HTML，一旦我開始造型 我的代碼利用CSS，我可以使用這些
組織屬性的影響 我的網頁的美觀。
>> 該部門內的頂級一切 將具有類似的花式或任何
另一組的HTML我組進 一流的形象將共享同樣的目光。
這是比試圖編輯更加容易 和風格的圖像或塊
個別文本。
>> 於是我們過的怎麼樣的基礎知識 做一個網頁的HTML。
HTML有很多其他的功能了 當與其他語言配對
如CSS和JavaScript，才能真正 使網頁中脫穎而出。
獲得舒服的最好方法 HTML只是周圍的混亂了，
看看是什麼在起作用，哪些沒有。
>> 我的名字是Daven法納姆。
這是CS50。
>> 因此，例如，我可以使用 類圖像 -
不，有這麼多的屬性。
我的名字是Daven法納姆。
這是CS 650。
我想說的CSS。
這是CSS。