<p>{{HTMLSidebar()}}</p>
<p><span class="seoSummary">超文件標示語言（HyperText Markup Language, HTML）可以用來撰寫與視覺化地呈現網頁。它定義了網站的內容，但不定義網站的功能。</span></p>
<p>HTML 新增了「標記（markup）」到標準英文文件中。「超文件」是指從原網頁到另一網頁的連結，而這項技術造就了今日的網路世界。藉由撰寫與上載網頁到網際網路中，您也可以變成一位網路世界的積極參與者。HTML 不僅支援顯示影像，同樣也可以支援其他媒體。HTML 語言可以描述網路文件的結構和語意內容。到目前為止，被 HTML 元素所標記的網頁內容包括 {{HTMLElement("img")}}、 {{HTMLElement("title")}}、 {{HTMLElement("p")}}、 {{HTMLElement("div")}}、 {{HTMLElement("picture")}}。這些元素構成了網站的基本架構。</p>
<p><span class="seoSummary">以下這些文章對網路開發提供了參考資料。</span></p>
<section class="cleared" id="sect1">
<ul class="card-grid">
<li><span>HTML 參考資料</span>
<p>在我們的 <a href="/en-US/docs/Web/HTML/Reference">extensive reference</a>中，您將會找到構成 HTML 每個元素和屬性的細節。</p>
</li>
<li><span>HTML 指南</span>
<p>對於如何使用 HTML、HTML 指導，與完整例子，請參考我們的 <a href="/en-US/docs/Web/Guide/HTML">HTML developer guide</a>。</p>
</li>
<li><span>HTML 介紹</span>
<p>如果您是個網站開發的新手，請先閱讀我們的 <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Introduction">introduction</a> ，以知道 HTML 是什麼並且如何使用。</p>
</li>
</ul>
<div class="row topicpage-table">
<div class="section">
<h2 class="Documentation" id="Documentation" name="Documentation">參考資料</h2>
<dl>
<dt class="landingPageList"><a href="https://developer.mozilla.org/zh-TW/docs/Web/HTML/Block-level_elements">區塊層級元素(Block-Level Elements)</a></dt>
<dd class="landingPageList">HTML (Hypertext Markup Language) 元素 通常分為 "區塊層級元素(block-level elements)" 或是 "<a href="https://developer.mozilla.org/zh-TW/docs/HTML/Inline_elements">行內元素(inline elements)</a>"。一個區塊層級的元素會佔據它的父級元素(container)的所有空間。因此才被稱為 "區塊(block)"。這篇文章將會解釋這是什麼。</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image">跨來源資源共享圖片(CORS enabled image)</a></dt>
<dd class="landingPageList">HTML5規格中為圖片(<img>)導入了<code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-crossorigin">跨來源(crossorigin</a></code>)的屬性，這同時必須搭配合適的CORS標頭<a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/CORS" title="CORS: It is insecure to allow a webpage to request any resources from any other domains without limitation. CORS (Cross-Origin Resource Sharing) is a system that determines whether to block or fulfill these requests.">(CORS</a> header)。這允許來自不同來源的元素(element)所定義的圖片(image)可以被使用在畫布(canvas)上，並讓它們看起來就是從當前的來源被載入的。</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes">跨來源資源共享設定屬性(CORS settings attributes)</a></dt>
<dd class="landingPageList">In HTML5, some HTML elements which provide support for <a href="https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS">CORS</a>, such as or <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video" title="The HTML <video> element is used to embed video content. It may contain several video sources, represented using the src attribute or the <source> element; the browser will choose the most suitable one."><code>
<video> </video>
</code></a>, have a <code>crossorigin</code> attribute (<code>crossOrigin</code> property), which lets you configure the CORS requests for the element's fetched data. These attributes are enumerated, and have the following possible values:</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Controlling_spell_checking_in_HTML_formsControlling_spell_checking_in_HTML_forms">Controlling spell checking in HTML forms</a></dt>
<dd class="landingPageList">Firefox 2 introduces spell checking support to text areas and text fields in web forms. The user can specify using the about:config interface whether or not spellchecking is enabled and whether to check both text areas and text fields or only text areas.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/DASH_Adaptive_Streaming_for_HTML_5_Video">DASH Adaptive Streaming for HTML 5 Video</a></dt>
<dd class="landingPageList">Dynamic Adaptive Streaming over HTTP (DASH) is an adaptive streaming protocol. This means that it allows for a video stream to switch between bit rates on the basis of network performance, in order to keep a video playing.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Focus_management_in_HTML">Focus management in HTML</a></dt>
<dd class="landingPageList">In the HTML5 working draft, the <code><a href="https://developer.mozilla.org/en/DOM/document.activeElement" title="en/DOM/document.activeElement">activeElement</a></code> DOM attribute and the <code><a href="https://developer.mozilla.org/en/DOM/document.hasFocus" title="en/DOM/document.hasFocus">hasFocus()</a></code> DOM method give the programmer the ability to have better control of the interactivity of the page due to the user's actions. For example, both of them can be used for statistical usage purposes, tracking the number of clicks on certain links of a page, measuring the amount of time an element is focused, and so forth. In addition, when combined with AJAX technology, they help minimize the number of requests to the server, depending on the user activity and the page layout.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">Global attributes</a></dt>
<dd class="landingPageList">Global attributes may be specified on all <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element">HTML elements</a>, <em>even those not specified in the standard</em>. That means that any non-standard elements must still permit these attributes, even though using those elements means that the document is no longer HTML5-compliant. For example, HTML5-compliant browsers hide content marked as <code>...</code><code>, </code>even though is not a valid HTML element.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes">HTML attribute reference</a></dt>
<dd class="landingPageList">Elements in HTML have <strong>attributes</strong>; these are additional values that configure the elements or adjust their behavior in various ways to meet the criteria the users want.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element">HTML element reference</a></dt>
<dd class="landingPageList">本頁列出所有的 <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/HTML" title="HTML: HTML (HyperText Markup Language) is a descriptive language that specifies webpage structure.">HTML</a> <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/Element" title="elements: An element is a part of a webpage. In XML and HTML, an element may contain a data item or a chunk of text or an image, or perhaps nothing. A typical element includes an opening tag, attributes, content, and a closing tag:">元素</a>。</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference">HTML reference</a></dt>
<dd class="landingPageList">HTML is the language that describes the structure and the semantic content of a Web document; it consists of <strong>elements</strong>, each of which may be modified by some number of <strong>attributes</strong>.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elemente">行內元素</a></dt>
<dd class="landingPageList">HTML (Hypertext Markup Language) elements are usually "inline" elements or <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements">"block-level" elements</a>. An inline element occupies only the space bounded by the tags that define the inline element. The following example demonstrates the inline element's influence:</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types">鏈結類型</a></dt>
<dd class="landingPageList">In HTML, the following link types indicate the relationship between two documents, in which one links to the other using an , , or element.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats">Media formats supported by the HTML audio and video elements</a></dt>
<dd class="landingPageList">The <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio" title="The HTML <audio> element is used to embed sound content in documents. It may contain several audio sources, represented using the src attribute or the <source> element; the browser will choose the most suitable one."><code>
<audio> </audio>
</code></a> and <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video" title="The HTML <video> element is used to embed video content. It may contain several video sources, represented using the src attribute or the <source> element; the browser will choose the most suitable one."><code>
<video> </video>
</code></a> elements provide support for playing audio and video media without requiring plug-ins.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/microformats">Microformats</a></dt>
<dd class="landingPageList"><span class="p-summary"><a class="external external-icon" href="https://microformats.org"><dfn>Microformats</dfn></a> (sometimes abbreviated <strong>μF</strong>) are small patterns of HTML for marking up entities like people, organizations, events, locations, blog posts, products, reviews, resumes, recipes, etc.</span><br />
They are simple conventions to embed semantics in HTML and quickly provide an API to be used by search engines, aggregators, and other tools.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Optimizing_your_pages_for_speculative_parsing">Optimizing your pages for speculative parsing</a></dt>
<dd class="landingPageList">Traditionally in browsers the HTML parser has run on the main thread and has blocked after a tag until the script has been retrieved from the network and executed. The HTML parser in Firefox 4 and later supports speculative parsing off the main thread. It parses ahead while scripts are being downloaded and executed. As in Firefox 3.5 and 3.6, the HTML parser starts speculative loads for scripts, style sheets and images it finds ahead in the stream. However, in Firefox 4 and later the HTML parser also runs the HTML tree construction algorithm speculatively. The upside is that when a speculation succeeds, there's no need to reparse the part of the incoming file that was already scanned for scripts, style sheets and images. The downside is that there's more work lost when the speculation fails.</dd>
<dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache">Using the application cache</a></dt>
<dd class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/HTML/HTML5" title="HTML/HTML5">HTML5</a> provides an <em>application caching</em> mechanism that lets web-based applications run offline. Developers can use the <strong>Application Cache</strong> (<em>AppCache</em>) interface to specify resources that the browser should cache and make available to offline users. Applications that are cached load and work correctly even if users click the refresh button when they are offline.</dd>
</dl>
<p><span class="alllinks"><a href="/en-US/docs/tag/HTML" title="Article tagged: HTML">View All...</a></span></p>
</div>
<p> </p>
<div class="section">
<h2 class="Tools" id="Tools" name="Tools">Guides and tutorials</h2>
<dl>
<dt><a href="/en-US/docs/Web/Guide/HTML">HTML 開發者指南</a></dt>
<dd>在 MDN 的文章中，不僅教導了用 HTML 撰寫網站的明確技術，也展示了其他您可能會覺得易於使用的文章與指導。 這個指南可以提供 HTML 開發上的編輯課程、技巧與資訊。</dd>
</dl>
</div>
</div>
<p>{{CommunityBox("Web layout", "dev-tech-layout", "mozilla.dev.tech.layout", "", "Stack Overflow|https://stackoverflow.com/questions/tagged/html|HTML topics|Visit Stack Overflow, a collaboratively built and maintained Q&A site. See if you can find an answer; if not, you can ask your question there.")}}</p>
</section>