基本办公文书转HTML工具

本课课程大纲内容与其HTML代码(注明HTML代码来自 https://html-cleaner.com )

原文

课程目标

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

HTML

课程目标


透过混合学习及体验式学习培养学生以下能力:



  • 能够从用户体验框架,描述网页设计与制作主要概念,包括页面结构、网站结构、界面设计、图形设计及图像和视频等

  • 能熟悉产业标准生态,活用HTML5CSS3的产业技术标准

  • 能描述响应式网页设计的功能、特征及技术实践常用标准作法

  • 能运用设计与制作工具及区分工具使用情境

  • 能认识相关实践社群及学科,习得最佳实践及技巧的更新途径

教学进度计划表的HTML

教学进度计划表


说明:教学活动除有额外说明,均为混合学习及体验式学习




































































































































周次



课程要点



教学活动



阅读资料



1



网页设计与制作与工具介绍





RWD1



2



从用户体验切入响应式设计实践





RWD2, WSG0



3



HTML基本元素:码云Pages搭建





w3school, 码云Pages



4



页面结构(Page Structure)





WSG6



5



页面制作案例一
期中在线考查 A



教室外实践或专业分享



WP2,WSG4,DMMT



6



图像和视频(Images&Video)





WSG11, 12



7



弹性布局与响应式图片





RWD3



8



HTML5与响应式





RWD4



9



CSS3新特性





RWD5



10



期中考查 B







11



网站结构(Site Structure)





WSG5



12



CSS3高级技术





RWD6



13



介面设计(Interface Design)



教室外实践或专业分享



WSG7



14



图形设计(Graphic Design)



教室外实践或专业分享



WSG8



15



SVG与响应式Web设计
期中在线考查 C



教室外实践或专业分享



RWD7



16



CSS3过渡、变形和动画





WSG9



17



☉期末应用项目开发成果展示考查







18



☉期末应用项目开发成果点评总结







19









20






HTML代码"标签"记录

1.

基础 定义段落
2.

  • 列表 定义列表的项目。
    3.
      列表 定义无序列表。
      4.表格 定义表格中的行
      5.表格 定义表格中的单元
      6.表格 定义表格
      7.表格 定义表格中的主体内容

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

      不同WORD文书转换的不同结果(仅为部分结果)

      1.若是纯文字的WORD文档,那么转化为HTML格式后,标签仅有


      2.若是内含表格的WORD文档,那么转化为HTML格式后,标签的数量会明显变多,大多为表格标签,例如


      • 3.若是内含网址,则会出现类似这种情况

        换出HTML格式的方法和结果比较(摘自网络)

        这个方法明显就复杂和麻烦很多

        1.打开word文档,单击菜单栏中的“文件”,找到“另存为” 或“另存为网页”
        201611012205091.jpg

        2.单击另存为” 或“另存为网页”,弹出"另存为" 窗口
        基本办公文书转HTML工具_第2张图片
        201611012205102.jpg

        3.在"另存为" 窗口的“保存类型”,下拉菜单中找到“网页”。
        基本办公文书转HTML工具_第3张图片
        3.jpg

        4.在“文件名”一栏中可以修改我们想要的文件名

        5.点“保存”,就把一篇word文档保存成网页格式了。

        6.这时候在桌面就可以找到保存的网页,然后用浏览器会打开并显示网页的内容。
        基本办公文书转HTML工具_第4张图片
        6.jpg

        7.下载dreameweaver

        8.删除之前的数据,然后 执行 命令 > 清理word生成的html
        基本办公文书转HTML工具_第5张图片
        ②.png

        9.开始替换无用的html标签

        替换为


        替换为


        替换为空

        替换为空
        基本办公文书转HTML工具_第6张图片
        ③.png

        10.将上面直接替换为

        通过正则表达式替换

        ]*> 替换为

        基本办公文书转HTML工具_第7张图片
        ④.png

        11.]*>替换为 空 (替换为空)
        基本办公文书转HTML工具_第8张图片
        ⑤.png

        12.]*>替换为 空 (
        替换为空)
        基本办公文书转HTML工具_第9张图片
        ⑦.png

        13.然后 替换 图片路径

         

        可以替换为空

        实践心得

        网页设计是一门对于我来讲十分奇妙的课程,在这堂课上所接受的知识是我之前从未了解过的,但我隐隐觉得这门课程并不会简单,可能会需要我花费大量的时间和精力才能掌握,而且老师曾讲过这门课程里面的内容会随着时代的发展而不断更新变化,因而我觉得这可能会成为我毕生的追求之一了。

        但这门课程也给予了我一些很新奇的体验,在使用网站 https://html-cleaner.com对 本课课程大纲的部分内容进行HTML转化的时候,我是用一种怀疑的心态来看待的,有点不太敢相信这个网站真的能将一段文字转化为我怎样都看不懂的HTML代码,但事实上它的确做到了,我感到很惊奇。根据WORD文档内的不同内容,所转化的HTML代码内会出现不同的标签,而且文档内的内容越繁复,HTML代码也会相应地变得很繁杂,看得我眼花缭乱、一头雾水。但是不得不承认,这个网站真的很神奇,它的功能相当的强大,因为如果不依靠这个网站而对WORD文档进行HTML转化的话,那个过程是十分麻烦的,需要很多操作,兜多很多弯路.

        当然这门课程对于我来讲还是相当有难度,对于教科书内容的不理解以及任务的繁重都是我学习路上的拦路虎,但是每当小有成就的时候我都会相当的兴福,因此在此希望自己能坚持下去吧

        你可能感兴趣的:(基本办公文书转HTML工具)