正在翻譯中。

本質上,HTML 是一種由元素所組成、相當簡易的語言。我們在文件裡將元素套用到文字片段以賦予它們不同的意義 (是一個段落? 是一個項目清單? 抑或是一部分的表格?),使得文件具有邏輯區塊的架構 (它具有標頭嗎?三個欄位的內容?一個導覽目錄?),並在其中嵌入圖片或影片 ... 等內容。這裡我們將介紹前面兩項,並介紹基本概念以及語法以讓你了解 HTML。

預備知識

在開始閱讀本章之前,你不需要具備任何 HTML 知識,但是你必須對電腦有基礎了解,而且能夠「被動地」上網(只是上網瀏覽、接受內容)。你需要建立一個基礎工作環境,並且了解如何建立與管理檔案──這些都屬於我們 Web 入門 的一部分。

提示: 如果您是在某些無法建立個人檔案的電腦/平板/其他裝置上進行,您可以在一些線上 coding program (如 JSBinThimble) 上測試程式碼範例。

指南

本章包含以下幾個子題,將帶你了解所有HTML的基礎理論,並且提供充足的機會讓你測試所習得的技能。

開始 HTML 吧!
包含HTML最基礎的部分──我們定義元素(elements)、屬性(attributes)、以及你可能聽過的所有其他重要術語,還有適合它們的位置。我們還展示了如何組織HTML元素、典型的HTML頁面的結構,以及解釋其他重要的基本特性。我們會玩一些HTML,讓你感興趣!
在head中有什麼? HTML的Metadata
當網頁加載完畢,HTML 文檔 head 的 Metadata 不會顯示在網頁瀏覽器中。它包含的訊息,例如有頁面的:<title>,連結到 CSS (假如 HTML 的內容想要用自己設定的CSS時), 連結到客製化網站圖示,以及 metadata (用來描述這個 HTML 文檔是誰製作的與它的重要關鍵字。)
HTML 文字的基石
HTML 主要作用之一是提供文本含義(又稱語義化),以便瀏覽器知道如何正確顯示它。本文將探討如何中斷 HTML 將文字區塊的標題和段落結構,增加重點/重要詞,創建列表......等。
使用超連結
超連結非常的重要 — 它使得網路得以成為我們現今所知的網路。這篇文章介紹使用超連結所需要的句法,並且探討最佳的實作方法。
進階文字格式
There are many other elements in HTML for formatting text, which we didn't get to in the HTML text fundamentals article. The elements in here are less well-known, but still useful to know about. In here you'll learn about marking up quotations, description lists, computer code and other related text, subscript and superscript, contact information, and more.
文件與網站架構
As well as defining individual parts of your page (such as "a paragraph" or "an image"), HTML is also used to define areas of your website (such as "the header", "the navigation menu", "the main content column".) This article looks into how to plan a basic website structure, and write the HTML to represent this structure.
HTML除錯
Writing HTML is fine, but what if something is going wrong, and you can't work out where the error in the code is? This article will introduce you to some tools that can help you.

評量

下面的評量將測試您對於以上的HTML基礎是否已經了解。

Marking up a letter
We all learn to write a letter sooner or later; it is also a useful example to test out our text formatting skills! So in this assessment you'll be given a letter to mark up.
Structuring a page of content
This assessment tests your ability to use HTML to structure a simple page of content, containing a header, footer, navigation menu, main content, and sidebar.

另外請見

Web literacy basics 1
An excellent Mozilla foundation course that explores and tests a lot of the skills talked about in the Introduction to HTML module. Learners get familiar with reading, writing and participating on the web in this six-part module. Discover the foundations of the web through production and collaboration.

文件標籤與貢獻者

 此頁面的貢獻者: yvonne6344, jackblackevo, akccakcctw, SecondSpirit
 最近更新: JunliXiao,