基本辦公文書轉(zhuǎn)HTML工具

二、課程目標5點（含標題）原文

二邓夕、課程目標
透過混合學習及體驗式學習培養(yǎng)學生以下能力：
(1)能夠從用戶體驗框架刘莹，描述網(wǎng)頁設計與制作主要概念，包括頁面結(jié)構(gòu)焚刚、網(wǎng)站結(jié)構(gòu)点弯、界面設計、圖形設計及圖像和視頻等
(2)能熟悉產(chǎn)業(yè)標準生態(tài)矿咕，活用HTML5及CSS3的產(chǎn)業(yè)技術(shù)標準
(3)能描述響應式網(wǎng)頁設計的功能抢肛、特征及技術(shù)實踐常用標準作法
(4)能運用設計與制作工具及區(qū)分工具使用情境
(5)能認識相關實踐社群及學科，習得最佳實踐及技巧的更新途徑

課程目標5點（含標題）HTML版

<p><strong>二碳柱、課程目標</strong></p>
<p>透過混合學習及體驗式學習培養(yǎng)學生以下能力：</p>
<ol>
<li>能夠從<strong><strong>用戶體驗</strong></strong>框架捡絮，描述網(wǎng)頁設計與制作主要概念，包括頁面結(jié)構(gòu)莲镣、網(wǎng)站結(jié)構(gòu)福稳、界面設計、圖形設計及圖像和視頻等</li>
<li>能熟悉產(chǎn)業(yè)標準生態(tài)瑞侮，活用<strong><strong>HTML5</strong></strong>及<strong><strong>CSS3</strong></strong>的產(chǎn)業(yè)技術(shù)標準</li>
<li>能描述<strong><strong>響應式網(wǎng)頁設計</strong></strong>的功能的圆、特征及技術(shù)實踐常用標準作法</li>
<li>能運用設計與制作<strong><strong>工具</strong></strong>及區(qū)分工具<strong><strong>使用</strong></strong><strong><strong>情境</strong></strong></li>
<li>能認識相關<strong><strong>實踐社群</strong></strong>及學科，習得最佳實踐及技巧的更新途徑</li>
</ol>

四半火、教學進度計劃表（原文）

四越妈、教學進度計劃表
說明：教學活動除有額外說明，均為混合學習及體驗式學習
周次 課程要點 教學活動 閱讀資料
1 網(wǎng)頁設計與制作與工具介紹 RWD1
2 從用戶體驗切入響應式設計實踐 RWD2, WSG0
3 HTML基本元素：碼云Pages搭建 w3school, 碼云Pages
4 頁面結(jié)構(gòu)（Page Structure） WSG6
5 頁面制作案例一
☉期中在線考查 A 教室外實踐或?qū)I(yè)分享 WP2,WSG4,DMMT
6 圖像和視頻（Images&Video） WSG11, 12
7 彈性布局與響應式圖片 RWD3
8 HTML5與響應式 RWD4
9 CSS3新特性 RWD5
10 ☉期中考查 B
11 網(wǎng)站結(jié)構(gòu)（Site Structure） WSG5
12 CSS3高級技術(shù) RWD6
13 介面設計（Interface Design） 教室外實踐或?qū)I(yè)分享 WSG7
14 圖形設計（Graphic Design） 教室外實踐或?qū)I(yè)分享 WSG8
15 SVG與響應式Web設計
☉期中在線考查 C 教室外實踐或?qū)I(yè)分享 RWD7
16 CSS3過渡钮糖、變形和動畫 WSG9
17 ☉期末應用項目開發(fā)成果展示考查
18 ☉期末應用項目開發(fā)成果點評總結(jié)
19
20

四梅掠、教學進度進化表（HTML版）

<p><strong>四、教學進度計劃表</strong></p>
<p>說明：<strong><strong>教學活動</strong></strong>除有額外說明，均為混合學習及體驗式學習</p>
<table>
<tbody>
<tr>
<td width="73">
<p><strong><strong>周次</strong></strong></p>
</td>
<td width="337">
<p><strong><strong>課程要點</strong></strong></p>
</td>
<td width="118">
<p><strong><strong>教學活動</strong></strong></p>
</td>
<td width="200">
<p><strong><strong>閱讀資料</strong></strong></p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong></p>
</td>
<td width="337">
<p>網(wǎng)頁設計與制作與工具介紹</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD1</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>2</strong></strong></p>
</td>
<td width="337">
<p>從用戶體驗切入響應式設計實踐</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD2, WSG0</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>3</strong></strong></p>
</td>
<td width="337">
<p>HTML基本元素：碼云Pages搭建?</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>w3school, 碼云Pages</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>4</strong></strong></p>
</td>
<td width="337">
<p>頁面結(jié)構(gòu)（Page Structure）</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>WSG6</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>5</strong></strong></p>
</td>
<td width="337">
<p>頁面制作案例一 ☉<strong><strong>期中在線考查</strong></strong><strong><strong>?</strong></strong><strong><strong>A</strong></strong></p>
</td>
<td width="118">
<p>教室外實踐或?qū)I(yè)分享</p>
</td>
<td width="200">
<p>WP2,WSG4,DMMT</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>6</strong></strong></p>
</td>
<td width="337">
<p>圖像和視頻（Images&Video）</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>WSG11, 12</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>7</strong></strong></p>
</td>
<td width="337">
<p>彈性布局與響應式圖片</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD3</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>8</strong></strong></p>
</td>
<td width="337">
<p>HTML5與響應式</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD4</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>9</strong></strong></p>
</td>
<td width="337">
<p>CSS3新特性</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD5</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>10</strong></strong></p>
</td>
<td width="337">
<p><strong><strong>☉</strong></strong><strong><strong>期中考查</strong></strong><strong><strong>?</strong></strong><strong><strong>B</strong></strong></p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>?</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong><strong><strong>1</strong></strong></p>
</td>
<td width="337">
<p>網(wǎng)站結(jié)構(gòu)（Site Structure）</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>WSG5</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong><strong><strong>2</strong></strong></p>
</td>
<td width="337">
<p>CSS3高級技術(shù)</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>RWD6</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong><strong><strong>3</strong></strong></p>
</td>
<td width="337">
<p>介面設計（Interface Design）</p>
</td>
<td width="118">
<p>教室外實踐或?qū)I(yè)分享</p>
</td>
<td width="200">
<p>WSG7</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>14</strong></strong></p>
</td>
<td width="337">
<p>圖形設計（Graphic Design）</p>
</td>
<td width="118">
<p>教室外實踐或?qū)I(yè)分享</p>
</td>
<td width="200">
<p>WSG8</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong><strong><strong>5</strong></strong></p>
</td>
<td width="337">
<p>SVG與響應式Web設計 ☉<strong><strong>期中在線考查 </strong></strong><strong><strong>C</strong></strong></p>
</td>
<td width="118">
<p>教室外實踐或?qū)I(yè)分享</p>
</td>
<td width="200">
<p>RWD7</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>16</strong></strong></p>
</td>
<td width="337">
<p>CSS3過渡阎抒、變形和動畫</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>WSG9</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>1</strong></strong><strong><strong>7</strong></strong></p>
</td>
<td width="337">
<p>☉期末應用項目開發(fā)成果展示考查</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>?</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>18</strong></strong></p>
</td>
<td width="337">
<p>☉期末應用項目開發(fā)成果點評總結(jié)</p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">
<p>?</p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>19</strong></strong></p>
</td>
<td width="337">
<p><strong><strong>?</strong></strong></p>
</td>
<td width="118">
<p><strong><strong>?</strong></strong></p>
</td>
<td width="200">
<p><strong><strong>?</strong></strong></p>
</td>
</tr>
<tr>
<td width="73">
<p><strong><strong>20</strong></strong></p>
</td>
<td width="337">
<p><strong><strong>?</strong></strong></p>
</td>
<td width="118">
<p>?</p>
</td>
<td width="200">?</td>
</tr>
</tbody>
</table>

就這兩部份內(nèi)容轉(zhuǎn)換出的HTML代碼"標簽"

<p>定義段落酪我。
<ol> 定義有序列表。
<li> 定義列表的項目挠蛉。
<table> 定義表格祭示。
<tbody> 定義表格中的主體內(nèi)容。
<tv>定義表格中的行谴古。
<td>定義表格中的單元质涛。
<strong> 定義語氣更為強烈的強調(diào)文本。

其他WORD文書轉(zhuǎn)換或換出HTML格式的方法和結(jié)果比較

原文

調(diào)課申請

姓名
學號
課程名稱
年級
教學班班級

原因
原本上課時間
調(diào)課后的時間
調(diào)課期限（具體調(diào)課時間掰担，某天汇陆，或是一個學期）
老師簽名
Ps:1、一個學期的調(diào)課带饱，要找辦公室的教學助理（何蓉老師）進行申請或是直接與任課老師進行協(xié)商毡代。
2、一個學期只能調(diào)課3次勺疼。

HTML版

<p><strong>調(diào)課申請</strong></p>
<p>?</p>
<p>姓名</p>
<p>學號</p>
<p>課程名稱</p>
<p>年級</p>
<p>教學班班級</p>
<p>?</p>
<p>?</p>
<p>原因</p>
<p>原本上課時間</p>
<p>調(diào)課后的時間</p>
<p>調(diào)課期限（具體調(diào)課時間教寂，某天，或是一個學期）</p>
<p>老師簽名</p>
<p>Ps:1执庐、一個學期的調(diào)課酪耕，要找辦公室的教學助理（何蓉老師）進行申請或是直接與任課老師進行協(xié)商。</p>
<p>2轨淌、一個學期只能調(diào)課3次迂烁。</p>

結(jié)果比較

與“課程大綱相比”，“調(diào)課申請”沒有在word文檔中設置更為精致的表格递鹉，而是以空格替代表格的形式盟步，因此轉(zhuǎn)換為HTML版本后的符號語言要比“課程大綱”中的簡單，基本以<p>為主躏结。而設置了表格的“課程大綱”擁有更多的符號語言却盘，說明書寫word文檔時越復雜，HTML語言也會相應來說更繁瑣媳拴。

實踐心得

本次的作業(yè)雖然任務較多黄橘，但所接觸到的有關“響應式web設計”的知識是我以前沒有想象過的。雖然一開始面對復雜的作業(yè)要求禀挫，我跟舍友們都是一頭霧水旬陡，但在經(jīng)過看書和網(wǎng)上搜索名詞過后拓颓，我們逐漸找到了方向语婴，并最終完成了作業(yè)。雖然可能完成得并不完美，但我在這探索的過程中還是得到了十分大的收獲砰左。我們在看到word上文字的同時匿醒，也應該想到其相對應的HTML語言；在瀏覽網(wǎng)站時缠导，要知道不同設備上因屏幕尺寸不同所產(chǎn)生的差異廉羔，并想出如何做出調(diào)整；在編寫程序時僻造，要知道如何使用不同的工具和文本編輯器憋他。誰能想到，看似簡單的一段文字和網(wǎng)站髓削，背后卻蘊含著如此多的技巧竹挡。學習網(wǎng)站、了解網(wǎng)絡并不簡單立膛，而這是一段奇妙的旅程揪罕，需要我們新一代的媒體人不斷地進行探索。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 人面猴
    序言：七十年代末宝泵，一起剝皮案震驚了整個濱河市好啰，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌儿奶，老刑警劉巖框往，帶你破解...
    沈念sama閱讀 219,490評論 6贊 508
  • 死咒
    序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場離奇詭異廓握，居然都是意外死亡搅窿，警方通過查閱死者的電腦和手機，發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,581評論 3贊 395
  • 救了他兩次的神仙讓他今天三更去死
    文/潘曉璐 我一進店門隙券，熙熙樓的掌柜王于貴愁眉苦臉地迎上來男应，“玉大人，你說我怎么就攤上這事娱仔°迤” “怎么了？”我有些...
    開封第一講書人閱讀 165,830評論 0贊 356
  • 道士緝兇錄：失蹤的賣姜人
    文/不壞的土叔 我叫張陵牲迫，是天一觀的道長耐朴。 經(jīng)常有香客問我，道長盹憎，這世上最難降的妖魔是什么筛峭？ 我笑而不...
    開封第一講書人閱讀 58,957評論 1贊 295
  • ?港島之戀（遺憾婚禮）
    正文 為了忘掉前任，我火速辦了婚禮陪每，結(jié)果婚禮上影晓，老公的妹妹穿的比我還像新娘镰吵。我一直安慰自己，他們只是感情好挂签，可當我...
    茶點故事閱讀 67,974評論 6贊 393
  • 惡毒庶女頂嫁案：這布局不是一般人想出來的
    文/花漫 我一把揭開白布疤祭。 她就那樣靜靜地躺著，像睡著了一般饵婆。 火紅的嫁衣襯著肌膚如雪勺馆。 梳的紋絲不亂的頭發(fā)上，一...
    開封第一講書人閱讀 51,754評論 1贊 307
  • 城市分裂傳說
    那天侨核，我揣著相機與錄音草穆，去河邊找鬼。 笑死搓译，一個胖子當著我的面吹牛续挟，可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播侥衬，決...
    沈念sama閱讀 40,464評論 3贊 420
  • 雙鴛鴦連環(huán)套：你想象不到人心有多黑
    文/蒼蘭香墨 我猛地睜開眼诗祸，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了轴总？” 一聲冷哼從身側(cè)響起直颅，我...
    開封第一講書人閱讀 39,357評論 0贊 276
  • 萬榮殺人案實錄
    序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎怀樟，沒想到半個月后功偿，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
    沈念sama閱讀 45,847評論 1贊 317
  • ?護林員之死
    正文 獨居荒郊野嶺守林人離奇死亡往堡，尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,995評論 3贊 338
  • ?白月光啟示錄
    正文 我和宋清朗相戀三年械荷，在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片虑灰。...
    茶點故事閱讀 40,137評論 1贊 351
  • 活死人
    序言：一個原本活蹦亂跳的男人離奇死亡吨瞎，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出穆咐，到底是詐尸還是另有隱情颤诀，我是刑警寧澤，帶...
    沈念sama閱讀 35,819評論 5贊 346
  • ?日本核電站爆炸內(nèi)幕
    正文 年R本政府宣布对湃，位于F島的核電站崖叫，受9級特大地震影響，放射性物質(zhì)發(fā)生泄漏拍柒。R本人自食惡果不足惜心傀，卻給世界環(huán)境...
    茶點故事閱讀 41,482評論 3贊 331
  • 男人毒藥：我在死后第九天來索命
    文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望拆讯。 院中可真熱鬧脂男，春花似錦恐锦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,023評論 0贊 22
  • 一樁弒父案，背后竟有這般陰謀
    文/蒼蘭香墨 我抬頭看了看天上的太陽陕贮。三九已至堕油，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間肮之，已是汗流浹背掉缺。 一陣腳步聲響...
    開封第一講書人閱讀 33,149評論 1贊 272
  • 情欲美人皮
    我被黑心中介騙來泰國打工， 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留戈擒，地道東北人眶明。 一個月前我還...
    沈念sama閱讀 48,409評論 3贊 373
  • 代替公主和親
    正文 我出身青樓，卻偏偏與公主長得像筐高，于是被迫代替她去往敵國和親搜囱。 傳聞我的和親對象是個殘疾皇子，可洞房花燭夜當晚...
    茶點故事閱讀 45,086評論 2贊 355

推薦閱讀更多精彩內(nèi)容