blob: 9a14c26039bef5c5c80a0222a4114f84e9d38f36 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
|
---
title: 使用HTML解決日常問題
slug: Learn/HTML/Howto
translation_of: Learn/HTML/Howto
---
<div>{{LearnSidebar}}</div>
<p class="summary">以下連結會給出 HTML 常見待解問題的方法</p>
<div class="column-container">
<div class="column-half">
<h3 id="基本結構">基本結構</h3>
<p>HTML 文件的最基本結構應用。如果你是 HTML 新手，就先從這裡開始看。</p>
<ul>
<li><a href="/zh-TW/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document">如何建立基本 HTML 文件</a></li>
<li><a href="/zh-TW/docs/Learn/HTML/Howto/Divide_a_webpage_into_logical_sections">如何有邏輯地分割網頁</a></li>
<li><a href="/zh-TW/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#The_basics_headings_and_paragraphs">如何建立良好的標題段落結構</a></li>
</ul>
<h3 id="基本文字語法">基本文字語法</h3>
<p>HTML 專攻於為文件提供語義資訊，因此 HTML 可以提供使用者更精準的文件資訊傳達方式。</p>
<ul>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists">如何建立清單</a></li>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">如何強調文件的內容</a></li>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">如何表示出一段文字的重要性</a></li>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">如何顯示程式碼</a></li>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Annotating_images_with_figures_and_figure_captions">如何為圖片加入註記</a></li>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations">如何標示並註記縮寫</a></li>
<li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Quotations">如何在網頁中加入引用</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Define_terms_with_HTML">如何加入詞語的定義</a></li>
</ul>
</div>
<div class="column-half">
<h3 id="超連結">超連結</h3>
<p>{{Glossary("hyperlink", "超連結")}}把 HTML 導覽變得相當容易，它可以這麼用：</p>
<ul>
<li><a href="/zh-TW/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">如何建立超連結</a></li>
<li><a href="/zh-TW/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">How to create a table of contents with HTML</a></li>
</ul>
<h3 id="圖片與多媒體">圖片與多媒體</h3>
<ul>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#How_do_we_put_an_image_on_a_webpage">How to add images to a webpage</a></li>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">How to add video content to a webpage</a></li>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">How to add audio content to a webpage</a></li>
</ul>
<h3 id="腳本與樣式">腳本與樣式</h3>
<p>HTML 只建立文件的基礎架構，可以透過 {{glossary("CSS")}} 或腳本使內容呈現更具互動性。</p>
<ul>
<li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">如何在網頁中使用 CSS</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">如何在網頁中使用 JavaScript</a></li>
</ul>
<h3 id="嵌入內容">嵌入內容</h3>
<ul>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">How to embed a webpage within another webpage</a></li>
<li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">How to add Flash content within a webpage</a></li>
</ul>
</div>
</div>
<h2 id="不常見或進階的問題">不常見或進階的問題</h2>
<p>除了上述的基本功能外，HTML 還提供許多進階功能讓使用者解決較複雜的問題。這些文章可以幫助你處理一些較不常見的情況：</p>
<div class="column-container">
<div class="column-half">
<h3 id="表單">表單</h3>
<p>Forms are a complex HTML structure made to send data from a webpage to a web server. We encourage you to go over our <a href="/en-US/docs/Web/Guide/HTML/Forms">full dedicated guide</a>. Here is where you should start:</p>
<ul>
<li><a href="/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form">How to create a simple Web form</a></li>
<li><a href="/en-US/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form">How to structure a Web form</a></li>
</ul>
<h3 id="表格訊息">表格訊息</h3>
<p>Some information, called tabular data, needs to be organized into tables with columns and rows. It's one of the most complex HTML structures, and mastering it is not easy:</p>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Howto/Create_a_data_spreadsheet">How to create a data spreadsheet</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Make_HTML_tables_accessible">How to make HTML tables accessible</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Optimize_HTML_table_rendering">How to optimize HTML table rendering</a></li>
</ul>
<h3 id="資料表示方式">資料表示方式</h3>
<ul>
<li><a href="/en-US/docs/Learn/HTMLHowto/Represent_numeric_values_with_HTML">How to represent numeric values with HTML</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">How to use data attributes</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Associate_human_readable_content_with_arbitrary_computer_data_structures">How to associate human readable content with arbitrary computer data structures</a></li>
</ul>
<h3 id="互動性">互動性</h3>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Howto/Create_collapsible_content_with_HTML">How to create collapsible content with HTML</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Add_context_menus_to_a_webpage">How to add context menus to a webpage</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Create_dialog_boxes_with_HTML">How to create dialog boxes with HTML</a></li>
</ul>
</div>
<div class="column-half">
<h3 id="進階文字語法">進階文字語法</h3>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Howto/Take_control_of_HTML_line_breaking">How to take control of HTML line breaking</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Mark_text_insertion_and_deletion">How to mark changes (added and removed text)</a></li>
</ul>
<h3 id="進階圖片_多媒體">進階圖片 & 多媒體</h3>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">How to add responsive image to a webpage</a></li>
<li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web">How to add vector image to a webpage</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">How to add a hit map on top of an image</a></li>
</ul>
<h3 id="國際化">國際化</h3>
<p>HTML is not monolingual. It provides tools to handle common internationalization issues.</p>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Howto/Add_multiple_languages_into_a_single_webpage">How to add multiple languages into a single webpage</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Handle_Japanese_ruby_characters">How to handle Japanese ruby characters</a></li>
<li><a href="/en-US/docs/Learn/HTML/Howto/Display_time_and_date_with_HTML">How to display time and date with HTML</a></li>
</ul>
<h3 id="效能">效能</h3>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Howto/Author_fast-loading_HTML_pages">How to author fast-loading HTML pages</a></li>
</ul>
</div>
</div>
<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>
|
