基本办公文书转HTML工具

教学目标

---

<p><strong>课程目标</strong></p>
<p>透过混合学习及体验式学习培养学生以下能力：</p>
<p>(1)能够从用户体验框架，描述网页设计与制作主要概念，包括页面结构、网站结构、界面设计、图形设计及图像和视频等</p>
<p>(2)能熟悉产业标准生态，活用HTML5及CSS3的产业技术标准</p>
<p>(3)能描述响应式网页设计的功能、特征及技术实践常用标准作法</p>
<p>(4)能运用设计与制作工具及区分工具使用情境</p>
<p>(5)能认识相关实践社群及学科，习得最佳实践及技巧的更新途径</p>

教学进度计划表

---

<table style="width: 417.2px;">
<tbody>
<tr style="height: 20px;">
<td style="width: 42px; text-align: center; height: 20px;">周次</td>
<td style="width: 329px; text-align: center; height: 20px;">课程要点</td>
<td style="width: 62.2px; text-align: center; height: 20px;">阅读资料</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">1</td>
<td style="width: 329px; height: 20px;">网页设计与制作与工具介绍</td>
<td style="width: 62.2px; height: 20px;">RWD1</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">2</td>
<td style="width: 329px; height: 20px;">从用户体验切入响应式设计实践</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_106">RWD2, WSG0&nbsp;</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">3</td>
<td style="width: 329px; height: 20px;">HTML基本元素：码云Pages搭建</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_107">w3school, 码云Pages</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">4</td>
<td style="width: 329px; height: 20px;">页面结构（Page Structure）</td>
<td style="width: 62.2px; height: 20px;">WSG6</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">5</td>
<td style="width: 329px; height: 20px;">页面制作案例一 ☉期中在线考查 A</td>
<td style="width: 62.2px; height: 20px;">WP2,WSG4,DMMT</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">6</td>
<td style="width: 329px; height: 20px;">图像和视频（Images&amp;Video）</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_102">WSG11, 12</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">7</td>
<td style="width: 329px; height: 20px;">弹性布局与响应式图片</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_110">RWD3&nbsp;</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">8</td>
<td style="width: 329px; height: 20px;">HTML5与响应式</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_111">RWD4</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">9</td>
<td style="width: 329px; height: 20px;">CSS3新特性</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_111">RWD5</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">10</td>
<td style="width: 329px; height: 20px;">☉期中考查 B</td>
<td style="width: 62.2px; height: 20px;">&nbsp;</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">11</td>
<td style="width: 329px; height: 20px;">网站结构（Site Structure）</td>
<td style="width: 62.2px; height: 20px;">WSG5</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">12</td>
<td style="width: 329px; height: 20px;">CSS3高级技术</td>
<td style="width: 62.2px; height: 20px;">RWD6</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">13</td>
<td style="width: 329px; height: 20px;">介面设计（Interface Design）</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_114">WSG7</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">14</td>
<td style="width: 329px; height: 20px;">图形设计（Graphic Design）</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_114">WSG8</span></td>
</tr>
<tr style="height: 20.2px;">
<td style="width: 42px; height: 20.2px;">15</td>
<td style="width: 329px; height: 20.2px;">SVG与响应式Web设计 ☉期中在线考查 C</td>
<td style="width: 62.2px; height: 20.2px;">RWD7</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">16</td>
<td style="width: 329px; height: 20px;">CSS3过渡、变形和动画</td>
<td style="width: 62.2px; height: 20px;"><span id="yui_3_17_2_1_1520873833537_118">WSG9</span></td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">17</td>
<td style="width: 329px; height: 20px;">☉期末应用项目开发成果展示考查</td>
<td style="width: 62.2px; height: 20px;">&nbsp;</td>
</tr>
<tr style="height: 20px;">
<td style="width: 42px; height: 20px;">18</td>
<td style="width: 329px; height: 20px;">☉期末应用项目开发成果点评总结</td>
<td style="width: 62.2px; height: 20px;">&nbsp;</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>

"标签"即其功能类别及描述

---

标签	描述
<p>	定义段落。
<table>	定义表格
<tr>	定义表格中的行。
<td>	定义表格中的单元。
<tbody>	定义表格中的主体内容。
<style>	定义文档的样式信息。
<span>	定义文档中的节。
id	规定元素的唯一 id。
<strong>	定义语气更为强烈的强调文本。

Word文书转换或换出HTML格式的方法和结果比较

---

http://www.jb51.net/office/word/506699.html
该网页提供了可行方法。

• 以结果来看，还是通过https://html-cleaner.com/进行转换要更为便利。

心得：

---

通过此次作业和上课所学我对响应式web设计有了初步的了解，以及响应式web设计的便利之处。而且利用一些工具可以让我们的编写更加快速准确。