收藏 分享(赏)

Html基础教程培训文档.ppt

上传人:weiwoduzun 文档编号:4174421 上传时间:2018-12-13 格式:PPT 页数:12 大小:481.51KB
下载 相关 举报
Html基础教程培训文档.ppt_第1页
第1页 / 共12页
Html基础教程培训文档.ppt_第2页
第2页 / 共12页
Html基础教程培训文档.ppt_第3页
第3页 / 共12页
Html基础教程培训文档.ppt_第4页
第4页 / 共12页
Html基础教程培训文档.ppt_第5页
第5页 / 共12页
点击查看更多>>
资源描述

1、Html基础教程及网页的基本修改培训文档,编写人:曾文凭,目 录,第二章:table表格的基本编写方式,第二章:静态页面常用的构造方式,第三章:网页的修改需要注意的地方,第一章:html语言的基础代码,HTML 文件结构 . . .,第一章:html语言的基础代码,例子1:HTML 文件的正文写在这里. .,.常用代码移动商城,在 HTML 文件中设置 字符集信息。 您在浏览主页时,最好自己在浏览器的选项菜单内选择相应的语言(language encoding)。 但是如果 HTML 文件里写明了设置,浏览器就会自动设置语言选项。尤其是主页里用到了字符实体(entities),则该主页就应该写

2、明字符集信息。否则,您在浏览该主页时,若未正确设置语言选项,显示将可能混乱。,写网站名字的代码,可以方便搜索以及在网页的顶部出现网页相关信息。,调用外部cs、js文件的代码,可以调用多个。,第一章:html语言的基础代码,Body的常用属性 ,背景颜色 背景图片 页面滚动 顶部页面空白(Margin) 左边页面空白(Margin) 右边页面空白(Margin) 底部页面空白(Margin),第二章:静态页面常用的构造方式,静态页面比较常用的构造方式有两种: 一:表格(table)构造方式: 优点:可以方便灵活的排版,表格可以把相互关联的信息元素集中定位,使浏览页面的人一目了然; 缺点:表格层级

3、深,可能导致页面展示效果慢;修改不够灵活。 二:div+css构造方式: 优点:缩减页面代码,提高页面浏览速度,样式控制,修改方便; 缺点:技术难度较高,工作量比较大;样式修改,需要一定的基础,编写要求高,对浏览器的兼容也有要求。 三:两者的对比:两种方式都是可取的,并不一定div就比table好,好的页面设计应该根据设计网站的难易程度以及网站的功能性等因素,决定选择哪款构造方式,至于哪种网站用哪种方式试个人的经验和用户要求而定,可以确定的是,不管是哪种构造方式,合理的布局、代码简洁、注释的齐全是构造页面的必须条件。,第三章: table表格的基本编写方式,在html文档中,表格是通过、标签来

4、完成的,如下表所示:,在一个最基本的表格中,必须包含一组标签,一组标签和一组标签,Html页面table基本元素构造实例:一个简单的表格第1行中的第1列 第1行中的第2列 第1行中的第3列第2行中的第1列 第2行中的第2列 第2行中的第3列,table表格开头 tr行开头 第一个单元格 第二个单元格 第三个单元格 tr行结尾 tr行开头 第一个单元格 第二个单元格 第三个单元格 tr行结尾 table表格结尾,第三章: table表格的基本编写方式,表格标签最常用的属性如下: 属 性 描 述 width 表格的宽度 height 表格的高度 align:left.center.right 表格

5、在页面的水平摆放位置 background 表格的背景图片 bgcolor 表格的背景颜色 border:0px 表格的边框 border-style:solid 表格的边框样式 border:1px solid #000000 表格边框的宽度(以像素为单位) bordercolor:$000000 边框颜色 bordercolorlight 表格边框明亮部分的颜色 bordercolordark 表格边框昏暗部分的颜色 cellspacing 单元格之间的间距 cellpadding 单元格内容与单元格边界之间的空白距离的大小,第三章: table表格的基本编写方式,无标题文档第1行中的第1

6、列 第1行中的第2列 第1行中的第3列第2行中的第1列 第2行中的第2列 第2行中的第3列,第三章: table表格的基本编写方式,第三章: table表格的基本编写方式,我们一般习惯的写法如下:,第三章: table表格的基本编写方式,是插入单元格的标签,必须嵌套在标签内。是成对出现的。就是该单元格中的具体数据内容,属性设定如下: 属 性 描 述 width/height 单元格的宽和高,接受绝对值(如 80)及相对值(如 80%)。 colspan 单元格向右打通的栏数 rowspan 单元格向下打通的列数 align 单元格内字画等的摆放贴,位置(水平),可选值为: left, cent

7、er, right。 valign 单元格内字画等的摆放贴 位置(垂直),可选值为: top, middle, bottom。 bgcolor 单元格的底色 bordercolor 单元格边框颜色 bordercolorlight 单元格边框向光部分的颜色 bordercolordark 单元格边框背光部分的颜色 background 单元格 背景图片,第四章: 网页的基本修改,网页修改要注意的几点: 1:copy或者移动,要注意代码的开头和结束要找对地方。要有头有尾,否则页面错乱。 2:copy或者移动div要注意上级div的样式,样式的编写可能存在父子集的关系,所以,截取的时候要找到最上级的div。 3:table页面trtd的合并和拆分,要了解页面的构造。 4:div里面的样式一定要齐全,不要随便挪动位置。 5:不要在html页面中加空格等符号,要加的编程代码最好放在一个完全的div外面,不要插在中间。,备注:原则上td有的属性tr都具备;不同的是,td的属性只是定义每个单个td,而tr却是定义tr内部的N个td,如果tr和td同时定义一个属性,将会td的属性为先。所有开发修改页面的时候要特别留意,要确定要修改的是哪个属性,每个地方的属性管理的地方也不一样。,

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 实用文档 > 简明教程

本站链接:文库   一言   我酷   合作


客服QQ:2549714901微博号:道客多多官方知乎号:道客多多

经营许可证编号: 粤ICP备2021046453号世界地图

道客多多©版权所有2020-2025营业执照举报