新書推薦:
《
惜华年(全两册)
》
售價:HK$
70.3
《
甲骨文丛书·古代中国的军事文化
》
售價:HK$
99.7
《
中国王朝内争实录(套装全4册):从未见过的王朝内争编著史
》
售價:HK$
244.2
《
半导体纳米器件:物理、技术和应用
》
售價:HK$
177.0
《
创客精选项目设计与制作 第2版 刘笑笑 颜志勇 严国陶
》
售價:HK$
61.6
《
佛山华家班粤菜传承 华家班59位大厨 102道粤菜 图文并茂 菜式制作视频 粤菜故事技法 佛山传统文化 广东科技
》
售價:HK$
221.8
《
武人琴音(十周年纪念版 逝去的武林系列收官之作 形意拳一门三代:尚云祥、韩伯言、韩瑜的人生故事 凸显百年武人命运)
》
售價:HK$
43.7
《
剑桥斯堪的纳维亚戏剧史(剑桥世界戏剧史译丛)
》
售價:HK$
154.6
|
編輯推薦: |
(1)《网页设计技术实用教程从基础到前沿(HTML5 CSS3 JavaScript)》在内容选择、写作方法和体例设计方面做出创新,兼顾知识的基础性和前沿性,网页的创意性和技术实用性,以及大学教学的学术性。(2)案例引导、示例辅助、图文并茂。每章都以业界主流网站案例作引导,从中引出本章讲述技术的内容及用法。读者可通过对实例代码的理解、模仿和改进,随时可以用到实际项目中,做到即学即用。(3)内容系统完整,重点突出,跟踪前沿。本书旨在使读者完整、系统地了解并掌握从事网站前端页面设计所需的基础知识和实用前沿技术,包括网页设计基础,HTML5、CSS3、JavaScript三种前端技术和DreamweaverCS5工具等。(4)配套资源完善。每章给出思辨题、网页设计实践题、案例分析题;提供课件、程序代码及其使用的CSS样式文件、JS文件;各种图像、音频、视频等资源文件;习题解答、课外参考文献或链接等资料。
|
內容簡介: |
本书兼顾高校教学与业界实用之需要,力求在覆盖网页设计基础知识和技能的同时跟踪其前沿技术进展,以满足初学者与进阶者的学习需要。全书共17章,精要、清晰、通俗、全面地讲述了网页设计原理、基本知识、*实用技术和工具,主要包括网页内容组织语言HTML5、外观样式设计语言CSS3、动态交互语言JavaScript和网站开发工具Dreamweaver CS5。 本书采用独特的编写方法,每章都从本章导读开始,以案例作为引导; 然后通过大量实用示例及开发工具示范、讲解技术的运用; 正文详列参考资源及术语脚注; 章末进行了小结,增加了外文文献研读训练和深度知识探究的进阶学习,设计了实用的思考与实践作业。 本书可作为普通高校计算机及相关专业教材,也可作为从事网页设计与制作、网站开发、网页编程等行业的人员的参考书。
|
目錄:
|
目录
第1章网页设计概述
1.1网站基础知识
1.1.1网站的概念、构成
1.1.2网站的分类
1.1.3网站的体系架构
1.1.4网站的开发技术
1.2网站系统设计
1.2.1网站的设计原则
1.2.2网站名称及主题设计
1.2.3网站形象设计
1.2.4网站栏目设计
1.2.5网站页面设计
1.2.6网站风格设计
1.2.7网站结构设计
1.3网页设计语言
1.3.1HTML语言
1.3.2CSS语言
1.3.3JavaScript语言
1.4网页设计工具
1.4.1常用的网站设计工具
1.4.2Dreamweaver CS5的使用
本章小结
进阶学习
思考与实践
第2章HTML5网页结构设计
2.1网页结构简介及应用案例
2.2网页全局结构设计
2.2.1网页文档类型声明
2.2.2网页头部设计
2.2.3网页主体设计
2.3网页全局属性
2.4HTML5网页结构设计前沿技术
2.4.1新增的网页结构元素
2.4.2新增的全局属性
2.5使用DWCS5设计网页结构
本章小结
进阶学习
思考与实践
第3章HTML5网页内容设计
3.1网页内容及格式化设计应用案例
3.2网页内容设计
3.2.1段落标记
3.2.2区块标记
3.2.3列表标记
3.2.4字符实体
3.2.5表格
3.2.6内部框架标记
3.3网页内容格式化设计
3.3.1预格式、显示方向与引用标记
3.3.2标题标记
3.3.3字体标记
3.3.4字型与效果标记
3.3.5水平线、换行与居中标记
3.3.6逻辑字体标记
3.4使用DWCS5进行网页内容及格式化设计
本章小结
进阶学习
思考与实践
第4章HTML5网页链接设计
4.1超链接简介及应用案例
4.2链接资源地址
4.2.1绝对URL地址
4.2.2相对URL地址
4.3超链接的分类
4.4超链接设计a标记
4.5HTML5超链接设计前沿内容
4.6使用DWCS5进行网页链接设计
本章小结
进阶学习
思考与实践
第5章HTML5网页表单设计
5.1表单简介及应用案例
5.2表单主体设计form标记
5.3表单输入域设计input标记
5.4文本区与列表选择框设计textarea、select标记
5.5标签与按钮设计label、button标记
5.6表单控件分组设计fieldset、legend标记
5.7HTML5表单设计前沿内容
5.7.1新增与改进的表单元素
5.7.2新增与改进的表单属性
5.7.3input域控件的type属性的改进
5.8使用DWCS5进行表单设计
本章小结
进阶学习
思考与实践
第6章HTML5网页多媒体与外部程序
6.1多媒体与外部程序简介及应用案例
6.2在网页中插入图像
6.2.1图像标记
6.2.2图像映射标记
6.3在网页中嵌入音频、视频和动画
6.3.1在当前文档中播放媒体
6.3.2在外部窗口中播放媒体
6.3.3插入背景音乐
6.4在网页中插入外部程序
6.4.1插入脚本
6.4.2插入Java小程序
6.5HTML5多媒体设计前沿内容
6.5.1多媒体播放标记
6.5.2在网页中绘图标记
6.6使用DWCS5插入多媒体与外部程序
本章小结
进阶学习
思考与实践
第7章CSS3样式表定义与应用
7.1CSS3样式表简介及应用案例
7.2CSS3样式表选择器
7.2.1基本选择器
7.2.2复合选择器
7.2.3伪类与伪元素选择器
7.3CSS3样式表在网页中的应用
7.3.1内部样式表的应用
7.3.2外部样式表的应用
7.3.3样式表的优先级
7.4CSS3样式设计前沿内容
7.4.1CSS3技术趋势
7.4.2CSS3新增选择器
7.5使用DWCS5进行样式表定义与应用
本章小结
进阶学习
思考与实践
第8章CSS3中的字体与文本样式设计
8.1字体与文本样式简介及应用案例
8.2字体样式设计的相关属性
8.3文本样式设计的相关属性
8.4CSS3字体与文本样式设计前沿内容
8.5使用DWCS5进行字体与文本样式设计
本章小结
进阶学习
思考与实践
第9章CSS3中的背景与边框样式设计
9.1背景与边框样式简介及应用案例
9.2背景色和背景图像样式设计的相关属性
9.3背景与边框样式设计前沿内容
9.4使用DWCS5进行背景与边框样式设计
本章小结
进阶学习
思考与实践
第10章CSS3中的列表与鼠标光标样式设计
10.1列表与鼠标光标样式简介及应用案例
10.2列表样式设计
10.3鼠标光标样式设计
10.4列表与鼠标光标样式设计前沿技术
10.4.1有序列表中的项目编号设计
10.4.2鼠标光标样式设计
10.5使用DWCS5进行列表与鼠标光标样式设计
本章小结
进阶学习
思考与实践
第11章CSS3中的Web框样式设计
11.1Web框简介及应用案例
11.1.1Web框的概念与组成
11.1.2Web框的度量单位与大小计算
11.1.3Web框的分类
11.1.4Web框的应用案例
11.2Web框样式设计
11.2.1Web框样式的属性
11.2.2Web框属性的用法
11.3Web框的浮动与定位设计
11.3.1Web框的浮动设计
11.3.2Web框的定位设计
11.4Web框设计前沿技术
11.4.1Web框的特效设计
11.4.2弹性Web框设计
11.5使用DWCS5进行Web框的样式设计
本章小结
进阶学习
思考与实践
第12章CSS3中的变形与动画设计
12.1变形与动画简介及应用案例
12.2CSS3中的变形设计
12.3CSS3中的动画设计
12.3.1Transitions动画设计
12.3.2Animations动画设计
12.4使用DWCS5进行变形与动画设计
本章小结
进阶学习
思考与实践
第13章CSS3中的网页布局样式设计
13.1CSS3中的网页布局简介及应用案例
13.2121网页布局样式设计
13.2.1绝对定位法
13.2.2浮动定位法
13.3131网页布局样式设计
13.3.1栏宽固定浮动定位法
13.3.2栏宽可变浮动定位法
13.4CSS3网页布局样式设计前沿内容
13.4.1弹性框模型布局设计
13.4.2多栏布局样式设计
13.5使用DWCS5进行布局样式设计
本章小结
进阶学习
思考与实践
第14章JavaScript的基本语法
14.1JavaScript的使用及应用案例
14.1.1内部JavaScript代码的嵌入
14.1.2外部JavaScript文件的应用
14.1.3JavaScript应用案例
14.2JavaScript的基本数据类型
14.3JavaScript的常量和变量
14.3.1JavaScript的常量
14.3.2JavaScript的变量
14.4JavaScript的运算符和表达式
14.4.1运算符和表达式概述
14.4.2常用的运算符和表达式
14.5JavaScript的函数
14.5.1函数的定义
14.5.2函数的调用
14.5.3函数的使用说明
14.6JavaScript的程序流程控制语句
14.6.1条件分支语句
14.6.2循环语句
14.7使用DWCS5进行JavaScript网页设计
本章小结
进阶学习
思考与实践
第15章JavaScript的对象与内置函数
15.1JavaScript对象简介及应用案例
15.1.1对象的概念及使用
15.1.2对象在网页中的应用案例
15.2自定义对象的创建
15.2.1定义对象的构造函数
15.2.2定义对象的方法
15.2.3创建对象的实例
15.3对象的事件及事件处理
15.3.1事件的概念
15.3.2事件处理及处理器
15.3.3事件驱动
15.4JavaScript的内置对象
15.4.1String对象
15.4.2Math对象
15.4.3Date对象
15.4.4Array对象
15.5JavaScript的主要内置函数
15.6使用DWCS5进行对象与内置函数网页设计
本章小结
进阶学习
思考与实践
第16章JavaScript与HTML5对象模型
16.1JavaScript与HTML5 BOM
16.1.1BOM
16.1.2window对象
16.1.3location对象
16.1.4history对象
16.1.5navigator对象
16.1.6screen对象
16.2JavaScript与HTML5 DOM
16.2.1DOM
16.2.2document对象
16.2.3Element对象
16.2.4Attribute对象
16.2.5event对象
16.2.6form对象
16.3使用DWCS5进行BOM和DOM对象页面设计
本章小结
进阶学习
思考与实践
第17章JavaScript与HTML5前沿技术应用
17.1地理位置定位和在线地图的使用
17.1.1地理位置定位的简介
17.1.2地理位置信息处理APIGeolocation
17.1.3地理位置定位Position对象
17.1.4百度在线地图的使用
17.2应用显示API实现页面的可见与全屏显示
17.2.1Page Visibility API的应用
17.2.2Fullscreen API的应用
17.3使用DOM方法实现文档内容的可编辑处理
17.3.1元素的可编辑性
17.3.2整个页面的可编辑性
17.3.3元素的拖放编辑
17.4基于Web存储技术实现数据的客户端存储
17.4.1Web Storage概述
17.4.2localStorage对象的使用
17.4.3localStorage示例
本章小结
进阶学习
思考与实践
参考文献
专题学习资源网址
|
內容試閱:
|
前言
在本书成稿之际,时间已是21世纪的第16个年头,当今时代正迎来互联网应用大发展的契机,仅看电子商务就可见一斑。我国电子商务近年来飞速发展,2014年中国电子商务市场交易规模12.3万亿元,同比增长21.3%,其中B2B电子商务市场占比超七成,网络购物占比超两成; 移动购物市场规模增速超200%,而背后支持电子商务发展的则是众多高效、安全运行的网站。在2015年3月的人大会议开幕式上,李克强总理提出互联网 国家战略。随着互联网应用的发展,对PC网站及移动平台网站开发人才的需求将日益增加,进而对掌握网页设计前沿技术人才的培养提出了更高要求。进入2016年,Web前端页面设计技术发生了很大变化,从Web 1.0的主流技术HTMLHyper Text Markup Language和CSSCascading Style Sheets技术,Web 2.0的以JavaScript、DOM、异步数据请求为技术的Ajax应用,发展到目前支持富图形和富媒体GraphicallyRich and MediaRich内容、兼顾PC网站和移动终端网页设计的HTML5和CSS3技术。HTML即超文本标记语言,是一种用来制作超文本文档的简单标记语言,是设计Web页面的基础。HTML5是一个新的Web标准的集合,它包括全新定义和更为规范化的HTML标签。CSS即层叠样式表,它通过提供页面元素的各种样式来格式化HTML文档,并使页面产生动态效果。CSS用来辅助HTML,是HTML不可分割的一项技术,要制作精美的网页离不开CSS。CSS3是CSS2技术的升级版本,是全球互联网发展的未来趋势,因为CSS3使用的新技术将简化网站的开发流程,也会带来更好的用户体验。CSS3以及全新的JavaScript API接口既可以进行PC网站开发,也可以进行移动网站和APP的开发。HTML5和CSS3等网页设计的最新技术正在快速发展,这些技术正在或已经得到了所有最新版本的浏览器的支持,包括Android和iPhone开发的移动浏览器。众所周知,现在的移动平台和APP广受人们欢迎,但掌握HTML5的网页设计者却很少。JavaScript是由Netscape公司开发的、介于Java与HTML之间、基于对象事件驱动的编程语言,是制作具有动态性和交互性页面的首选脚本语言。因为它的开发环境简单,不需要Java编译器,而是直接运行在Web浏览器中,所以备受Web设计者的青睐,正日益受到全球的关注。网页设计技术课程不仅是电子商务专业的必修课程,也是计算机科学与技术、信息管理与信息系统等专业的重要选修内容。近年来,高校教学由于受到学时、学分、课程数量的限制,不可能把网页设计的不同技术分散设置为多种课程,但在选用教材时发现,选择一本能够集成网页设计的多种技术,既能满足初学者入门,又能尽快跟上最新技术进展的教材是困难的。从内容上看,目前图书多把HTML、CSS、JavaScript以及开发工具等割裂开来,独立成册。从现有书籍的写作方法上看,来自业界的技术工程师作者,由于缺乏高校一线教学的工作经历,所编写图书的内容和体例多与教学大纲的要求不一致,缺乏配套的实验及习题等; 有些图书逻辑性稍差、可读性不够; 出自教师的图书则对新技术的跟踪不够及时,实践性不足。基于以上分析,亟须编写出反映最新技术变化,满足高校教学需要的高质量的网页设计技术教材。本书编者长期从事网站建设、网页设计类课程的教学工作,参与制定电子商务专业教学大纲; 了解高校学生的学习特点及教学需求; 主编或参编过包括国家十一五规划教材在内的十多部教材,为编写高校教学用书奠定了基础。本书是在编者的2007版《商务网站页面设计技术》教材多年使用的基础上,在参考了现有大量同类书刊、资料吸收众家之长后结合多年网页设计课程教学的经验以及本人主持的辽宁省教学研究项目实施中的成果和体会与网页设计的最新技术进展优化增改而成的。本书的内容本书共17章,讲述了从网页设计实用技术基础到最新前沿的内容,在体系上力求完整、清晰、易学易用,并与当前业界网页实际使用的技术结合,体现教材的实用性。本书从结构上分为4个部分,包括网页设计概述、HTML5标签设计、CSS3样式设计以及JSJavaScript网页交互设计,如下图所示,此外还包括贯穿全书的先进的网页设计工具DWCS5Dreamweaver CS5的运用。
网页设计概述部分分4个小节,从宏观角度概述了网站和网页的基本知识、技术,其中网站基础知识一节介绍了网站的概念、构成、分类、体系架构和开发技术; 网站系统设计一节讲述了网站设计原则,以及网站名称、主题、形象、栏目、页面、风格和结构的设计; 网页设计语言一节则对HTML、CSS、JavaScript语言进行了总体介绍; 工欲善其事,必先利其器,网页设计离不开好的工具支持,在网页设计工具一节我们选用业界成熟、先进的Dreamweaver CS5进行了讲解。HTML5标签设计部分分5章讲述了组成网页的各标签标记的设计,其中第2章讲解了网页结构设计,包括网页开头、主体结构标记及全局属性设计; 第3章讲解了网页内容设计,包括段落、区块、列表、表格等页面内容及格式化相关标记的设计; 第4~6章分别讲解了网页的超链接、表单、多媒体与外部程序相关标记的设计。CSS3样式设计部分分7章讲述了网页外观样式的设计,首先第7章对网页中样式表的定义与应用进行说明; 接着第8~13章分别讲解了网页中字体与文本、背景与边框、列表与鼠标光标、Web框、变形与动画、页面布局等的设计。JS网页交互设计部分分4章讲述了JavaScript语言及其在网页动态交互设计中的应用,在第14章介绍JavaScript基本语法的基础上,第15~17章分别讲解了JavaScript的对象、事件与内置函数,浏览器对象模型BOM和文档对象模型DOM,JavaScript与HTML5前沿技术应用,包括地理位置定位和在线地图的使用、基于Web存储技术实现数据的客户端存储等。本书的特点如何紧跟网页设计技术的发展趋势,适应业界对网页设计人才的技术需求,在教材的内容选择、编写方法和体例设计方面做出创新,从而编写出视觉舒适、可读性好、内容实用、有助于提高能力和扩展视野、符合高校教学需要的教材,是编者一直在思考的问题,本书的完成也是对这种长期思考的总结。本书具有如下特点。1. 立足精品导向、能力引领全书的编写始终树立精品意识,以国家级精品教材标准为目标导向,并借鉴众多同类教材的编写经验,在内容上兼顾知识的基础性和前沿性、网页的创意性和技术实用性以及大学教学的学术性; 在体例设计上参考国家级规划教材的要求; 在编写思想上遵守授人以鱼不如授人以渔的原则,重在能力的提高,而非知识的灌输,以帮助读者快速提升网页设计技术和实际应用能力。2. 内容系统完整、重点突出本书旨在使读者完整、系统地了解并掌握从事网站前端页面设计必需的基础知识和实用前沿技术,在内容上力求系统完整、重点突出。在核心内容方面,本书根据网页设计课程大纲要求选取了网页设计基础,HTML5、CSS3、JavaScript三种前端技术和Dreamweaver CS5工具等内容。但由于各部分内容较多,限于篇幅不可能面面俱到,为此本书又根据业界技术的实际需求进行了重点选讲。在附属内容方面,为了检验学生对各章内容的综合理解和掌握程度,每章都精心设计了实用的作业题,包括思辨题、网页设计实践题及案例分析,旨在通过问题解答、实践环节操作和案例研读巩固本章的知识要点,体现实践出真知的道理; 同时为了扩展读者的视野,每章都给出了需要进阶学习的知识; 为了便于学生及时阅读国外网站、资料,还增加了专业外文文献学习能力训练,力求尽快打开读者通向外部世界的大门。3. 讲述通俗简洁、条理清晰本书面向初学者,从零基础讲起并迅速追踪到前沿技术。考虑到目前大多数院校课时压缩、强调学生自学能力培养的实际情况,本书的编写力求做到深入浅出、通俗易懂、表述简洁、条理清晰。本书对基础知识、基本技术技能和设计原理的讲述比较细致,在难懂的地方一般补充了图表、示例说明、注释和脚注; 对每个示例中需要特别注意和说明的地方使用了单独的格式,使读者能够快速地把握知识的重点; 所用程序、结构层次清晰,对关键代码给出了详细的注释,具有可读性和可理解性; 对DW工具的操作列出了详细步骤。全书力求避免大量的纯文字性、抽象描述,避免空洞、无内容。本书各章内容结构清晰,内容之间联系紧凑、自然,难度循序渐进、逻辑性强,如下图所示。
鉴于编者多年的教学经验和对教与学的深刻感悟,加之本书又是经多次润色、修改和完善写成,因而本书基本贯彻了上述意图,编写方法符合学生的阅读和自主学习习惯。4. 选材基础实用、跟踪前沿本书首先讲述了零基础读者需要的基础知识和基本技术,在2007版《商务网站页面设计技术》的基础上进行了增补和完善; 同时尽可能地反映近年来网页设计技术的最新发展,并在每章的基础知识后增加了对应的前沿技术,如增加了HTML5的最新内容,扩充了最新发布的浏览器支持的CSS3特性,补充了地理位置定位和在线地图的使用,基于Web存储技术实现数据的客户端存储等; 通过追踪新技术与时俱进,使读者很快地学习到前沿技术; 各章节内容的选择都会摒弃业界不常用的技术,并且在每章的引例选择、内容讲述、示例设计、课后作业各方面紧紧围绕业界网页设计技术的实际需要,突出应用性、时效性和实践性。本书从网页设计的实际需求出发,既有理论又有技术,信息量大、知识结构完整,可以更好地满足网页设计的教学与实践需要。5. 案例引导、示例辅助、图文并茂目标明确是高效学习的开始,在深入学习技术之前首先需要了解其在网页设计实践中的作用和目的,为此本书每章都以业界的主流网站案例作为引导,从中引出本章所讲述技术的内容及用法。考虑到大多数技术或代码比较抽象、难懂,在讲述时都辅之以精心设计的典型实例,通过具体示例来说明相关技术的使用技巧,并运用工具软件详细地说明操作步骤,以此实现讲述的简洁性、通俗易懂性; 同时将各种技术的应用效果都用图片方式展示出来,做到图文并茂、形象直观。在编写上,总体遵循案例引导、示例辅助,从具体例子到抽象概念再到复杂技术的叙述方法。所有示例都经过上机测试,确保运行结果准确无误,读者可以直接在浏览器下打开该文件查看运行效果,并通过对实例代码的理解、模仿和改进,可以随时用到实际项目中,做到即学即用。6. 版式设计的人性化、精细化在体例格式设计上,本书以国家级规划教材的要求为标准,并借鉴了同类教材的编写经验,以做到全书版式设计的人性化、精细化,保持教材内容和体例编排的先进性。根据形式服务于内容的原则,从可读性、易理解性视角编排全书及各章节内容的逻辑顺序; 从章节标题的命名到内容取舍都做了精心安排; 增加了引导案例、了解本章技术的应用; 插入了脚注,以方便读者跟踪前沿或追本溯源,了解详细内容; 注意页面空间的节约,提高每页的知识含量,同时兼顾版面设计的精美,对文本、图像、代码各方面的视觉显示都做了细致工作; 希望通过图文、布局、字体设置等变换减轻读者的阅读疲劳,从视觉上、可读性方面提供给读者友好的、人性化的界面。本书面向的读者本书适合从零基础起步,想迅速掌握网页设计前沿技术,提高Web前端页面设计能力的读者,例如: 高等学校电子商务及相关专业网页设计的学生; 有志于成为Web页面前端开发软件工程师的人员; 从事Web开发相关专业教学的高校教师; 业界从事网站开发、培训、运营与管理的工作人员。教学或自主学习建议考虑到教学学时的限制,建议教学采取课内外结合的方式; 抓好教学三部曲,即课前预习布置、课堂难点精讲与重点讨论、课后作业检查; 通过微信、QQ等现代信息技术加强对学生课外自主学习各环节的监督、检查,并进行在线答疑、辅导。自主学习时可以采用小组互助学习、互相讨论的方式,边学习、掌握技术原理,边运行网页示例源代码,并在理解的基础上修改网页源文件,结合业界网页设计实际案例进一步深刻体会技术的运用。本书提供的支持服务为方便教师备课和一般读者学习,本书提供了较为完善的教辅材料,包括各章的教学大纲、电子课件,示例源程序代码及其使用的CSS样式文件、JS文件,以及各种图像、视频等资源文件,章末习题解答、课外参考资料或链接。读者可以通过清华大学出版社的官方网站获取,或通过申请加入QQ、微信群等途径与作者互动,获得相关的教学、答疑等支持服务。致谢与说明在本书的编写过程中得到了清华大学出版社领导魏江江、编辑刘星及同仁的大力支持和帮助,在此向他们表示最诚挚的谢意!东北财经大学电子商务专业的张弛、曹培、王云、王雪菲、李景林等研究生为本书的资料整理、编辑、程序调试等做了大量工作,在此对他们的辛勤劳动表示衷心的感谢!本书的编写参阅了许多专家、学者的大量著述,编者从中受益匪浅,这里也对他们表示感谢。在本书的编写过程中编者始终以求真务实、尽善尽美要求自己,不仅在编写前做了充分的准备,而且编写几经修改、润色,历时近两年的时间才最终完稿。尽管编者在编写过程中力求做到准确无误,但由于水平有限,不足和疏漏之处在所难免,恳请读者不吝赐教。
刘继山2017年1月于大连东财园Email:wdduf@163.com
第3章
HTML5网页内容设计
本章导读:在第2章我们学习了网页设计的基本结构,对网页的组成有了初步的了解,接下来对网页中的内容进行设计。首先通过一个案例了解网页内容设计在实际中的应用,建立对网页内容设计的初步认识,接下来对网页内容标记、网页内容格式化标记等常用标记及其属性进行理解与记忆,为后面的网页内容设计打下基础,然后讲解如何利用DWCS5进行网页内容设计,从而实现从理论到实践的飞跃,使读者对网页设计知识掌握得更加熟练和深入。3.1网页内容及格式化设计应用案例网页的内容是网站的精髓,是吸引顾客的关键。大商集团http:www.dsjt.com首页中就充分运用了表格table、区块div、内部窗口iframe等内容要素进行设计。图3.1是大商集团首页的部分截图。
图3.1大商集团网站首页截图
该页面展示了3个区块div,每个div下面又嵌套多个div。div1位于页面最上端,显示大商集团对访问者的欢迎以及一些导航栏的介绍,包括大商集团的Logo,首页、走进大商、新闻中心、业态商号、稀缺商品、人才招聘、天狗网几个内容,同时对导航栏的具体字体样式进行了设置; div2是对一些集团重要信息的推广,采用图片、字体等表现形式,轮播业态商号,简洁明了,易于用户访问; div3是一些列表区块,分别介绍了大商百货、大商超市、大商地产等内容,分类明晰。3.2网页内容设计3.2.1段落标记
图3.2标记及主要属性的使用
标记的英文全称是paragraph,该标记指明它所包含的内容是HTML文档的一个段落。除了全局属性以外,标记还有一个主要属性align。属性align说明段落在文档中的对齐方式,取值可以是left默认值、right右对齐、center居中对齐、justify两端对齐,IE尚未支持。【示例3.1】使用段落标记及主要属性的应用。设计一个页面,将文件命名为E03_01.html,在IE浏览器中的显示效果如图3.2所示。有关的代码可参见下面,源程序文件见webPageBook\codes\E03_01.html。
段落标记及主要属性的用法
应用P标记的练习这是一个应用P标记、style属性的段落
居中对齐段落
左对齐段落
右对齐段落
3.2.2区块标记区块标记、的作用是将文档的内容分成块,它们与class、id、lang等属性联合使用时可以更好地控制块的样式或事件行为。二者的区别是包括的内容大小不同,也称为层包含的内容较多,该标记不能用到标记中,与其他内容一起显示时会有一个空行。标记可以用到标记中,在一行内部使用。区块标记、的主要属性是全局属性。【示例3.2】使用区块标记、及主要属性。设计一个页面,将文件命名为E03_02.html,在IE浏览器中的显示效果如图3.3所示。
|
|