《html、css基础知识(网页设计必备)》由会员分享，可在线阅读，更多相关《html、css基础知识(网页设计必备)（50页珍藏版）》请在金锄头文库上搜索。
1、 第 1 页 共 50 页 1. HTML 的基本结构 标题 根控制标记 头控制标记 标题标记 头控制标记（尾） 网页显示区域 根控制标记(尾) (1).根控制标记开头和结尾成对出现，双标签 (2). 头控制标记 1.很单纯的文件标题声明 2.控制标记的动态文件转换声明 3.超链接网址基准参考点 4.Javascript 和 VBScript 程序 5.stylesheet 可用来设置排版来的声明 6.可引用外部文件，如 CSS 排版样本 (3).设置浏览器的视窗标题 (4).页面可见内容 2.HTML 控制标记的格式 (1). 单一型,无设置值的。 如： (2). 单一型，有设置值的。 如：
2、 (3). 对称型，无设置值。 如： (4). 对称型，有设置值。 如： 第 2 页 共 50 页 3. 最常用的控制标记 (1).跳行 格式： 无属性设置 (2).段落 格式： 属性名称 属性值 说明 align left 往左靠（默认） center 往中靠 right 往右靠 (3).水平直线 格式： 属性名称 属性值 说明 size 像素 绝对设置，以数字表示，属性值越大，线越粗 百分比 相对设置，以%表示，属性值越大，线越粗 width 像素 绝对设置，长度不会应视窗的改变而改变 百分比 相对设置，长度会随着视窗宽度而改变 noshade 实体线 (4).向中对齐 (被废弃的标签)
3、格式： (5).背景色与文字设置 格式： (6).整体页面的边距，行距 格式： (7).标题文字设置 格式： 、 、 属性名称 属性值 说明 align left 往左靠（默认） center 往中靠 right 往右靠 第 3 页 共 50 页 (8).特殊字符设置格式： gt; “ quot; (9).在 HTML 备注 格式： (10).实体字符控制标记 1. 粗 2. 斜 3. 删 4. 下划 5. 电报 6. 下标 7. 上标 (11).语意字符控制 1. 地址 2. 大字 3. 删除 4 修改 5. 小字 6. 加强语气(加粗) 7 加强语气(倾斜) (12).字体控制 (被废弃的
4、标签) 格式： 属性名称 属性值 说明 size 0-7 字体大小 color 英文或十六进制（6 位）字符 颜色 face 字体 字体 (13).格式化 格式：，让书写的文字格式化！ (14).引用文本 第 4 页 共 50 页 格式：. 属性名称 属性值 说明 cite url 被引用的地址 排列清单控制标记可以创建一般的列表、编号列表或加着重号列表，以及定义 列表。还可以在一种列表中嵌套另一种列表。对于概括因特网上的内容，列表 是非常方便的。 4.无序号条例式清单与 格式: 功能: 无序条列清单的开始； 表示结束； 表示一个项目. 的属性： 属性名称 属性值 说明 type dise 实
5、心圆(默认值) circle 空心圆 square 实心方块 5.有序号条例式清单与 格式: 第 5 页 共 50 页 功能: 有序条列清单的开始. 表示结束. 表示一个项目. 的属性： 属性名称 属性值 说明 type 1 表示以 1,2,3,4 来表示 a 表示以 a,b,c,d 来表示 A 表示以 A,B,C,D 来表示 i 表示以 i,ii ,iii 来表示 I 表示以 I,II,III 来表示 6.无序列表和有序列表的结合应用 格式: . 7.叙述式清单(定义列表) 格式: 第 6 页 共 50 页 功能: 叙述清单的开始 表示一个项目 表示一个项目下的更详细的内容 在网页中表格是一
6、种经常使用到得设计结构，就像表格的内容中可以包含任何 的数据，如文字、图像、表单、超链接、表格等等，所有在 HTML 中可以使用 的数据，都可以被设置在表格中，所以有关表格设置的标记与属性页特别多。 8.表格的基本格式 格式: 功能: 用来声明表格开始与结束. 用来设置表格的行. 第 7 页 共 50 页 用来设置标题栏位. 用来设置数据栏位. 9.标签下的属性 属性名称 属性值 说明 border 像素 设置表格的边线 cellspacing 像素 绝对设置,存储格框线宽度 百分比 相对设置,存储格框线宽度 cellpadding 像素 绝对设置,数据与框线的距离 百分比 相对设置,数据与框
7、线的距离 width 像素 绝对设置,像素表示表格宽度 百分比 相对设置,百分比表表格宽度 height 像素 绝对设置,像素表示表格宽度 百分比 绝对设置,百分比表表格宽度 align left 表格往左靠(默认) center 表格往中靠 right 表格网右靠 bgcolor 英文或十六进制（6 位）字符 表格的背景颜色 background URL 表格的背景图片 summary 字符串 用来描述表格数据说明 bordercolor 英文或十六进制（6 位）字符 边框的颜色 bordercolorlight 英文或十六进制（6 位）字符 边框的亮色 bordercolordark 英文
8、或十六进制（6 位）字符 边框的亮色 10. 标签下的边框设置 属性名称 属性值 说明 Frame （该属性必须在 border 的属性值不为 0 的状 态下!） void 不要显现表格的边线 above 只要显现出表格的上边线 below 只显现出表格的下边线 hsides 只显示表格的上下边线 vsides 只显现表格的左右边线 lhs 只显现表格的左边线 第 8 页 共 50 页 rhs 只显现表格的右边线 border/box 会显现出表格的所有边线 rules rows 只显示出横行的格框线 cols 只显示出直行的格框线 all 显示全部格框线 groups 表示列组合水平部分 n
9、one 不显示任何格框线 11.标签下的常用属性 属性名称 属性值 说明 width 像素 绝对设置,以像素值设置宽 百分比 相对设置,以百分比设置宽 height 像素 绝对设置,以像素值设置高 百分比 相对设置,以百分比设置宽 bgcolor 英文或十六进制（6 位）字符 数据栏的颜色设置 align(水平方向) left 数据靠左 center 数据靠中 right 数据靠右 valign(垂直方向) top 数据靠上 middle 数据靠中 bottom 数据靠下 nowrap 无 在单元格中换行 12. 拆分与合并单元格 属性名称 属性值 说明 colspan 数字 向两边扩展栏位
10、rowspan 数字 向下扩展栏位 13.表格的结构化、直列化、标题 (1).结构化格式： 第 9 页 共 50 页 -表头区 -表体区 -表尾区 (2).直列化格式：. 属性名称 属性值 说明 align left 靠左 center 靠中 right 靠右 valign top 靠上 middle 靠中 bottom 靠下 span 数字 直列数目 width 像素/百分比 宽度 格式:功能完全和一样. (3).表格的标题： . 下的属性值有: 属性名称 属性值 说明 align top 标题在表格上方 bottom 标题在表格下方 14.背景图案的设置 格式： 15.将图片插入到网页中去
11、 格式: 功能:将图片插入到网页中去,单一标签 下的属性 第 10 页 共 50 页 属性名称 属性值 说明 src（图片的注解） URL 图片的路径 alt（图象大小的设置） 字符串 给图片做注解 width 像素 绝对设置,宽 百分比 相对设置,宽 height 像素 绝对设置,高 百分比 相对设置,高 border（图象边框的设置） 数字 图象边框 文字图象的排列 属性名称 属性值 说明 align left 图象靠左,文字靠右 right 图片靠右,文字靠左 top 文字往上靠 middle 文字靠中 bottom 文字靠下 vspace 像素 垂直上下两端与物件的距离 hspace
12、像素 水平左右两段与物件的距离 16.用图像作为超链接 格式: 注意点:边框的问题. 17.地图索引 格式: 声明整张图使用地图链接方式进行连接. name,id 指此图的名称. 第 11 页 共 50 页 表示我们所要链接其中一点的区快 shape 表示我们所选择的形状, 如:rect 矩形；circle 圆 ；poly 多边形； coords 表示地 图的坐标位置! 18.切片索引 使用 Firework 来进行!用表格进行定位! 19.为网站添加图标 超链接也叫 URL，中文翻译为资源定址器。这个定址器的功能主要告诉浏览器 根据 URL 的地址找到所需的资源。 20.超链接的基本格式 格
13、式:scheme:/host:post/path/filename scheme 指的是 http,ftp,file,mailto,news,gopher,telnet 七种 host 指的是 IP 地址或计算机名称 post 指的是服务器端口 path 指的是文件路径 filename 指的是文件名 21.超链接的种类 一般常用的分为四种: 1. http 声明 网易 logo 2. file 声明 图片 3.ftp 声明 进入 4.mailto 声明 E-MAIL 22.书签的链接 下的属性 属性名称 属性值 说明 name 字符串 设置超链接的标记 第 12 页 共 50 页 基本格式：
14、 瞄点 链接点 链接到别的网页的书签项目,基本格式： 瞄点 链接点 23.基准参考点 基本格式： 24.超链接事件 link 颜色的设置 基本格式： link:超链接尚被选中的文字 alink:超链接点选但未被放开的颜色 vlink:超链接已被点选过的颜色 25.为链接创建键盘快捷键 accesskey=“w“ (Alt+w) (Ctrl+w) 26.为链接设置制表符次序 tabindex=“n“ 表单是提供让读者在网页上输入，勾选和选取数据，以便提交给服务器数据库 的工具。 27.表单的功能结构 主标记结构： 属性 值 说明 name 字符串 给这个表单起个名字 method get/pos
15、t 表单的传输方式 action url 传输目标 28.文本栏、密码栏、隐藏栏 文本栏： 第 13 页 共 50 页 密码栏： 隐藏性栏位： 29.复选栏、单选栏 多重勾选栏位： 单选栏位 : 30.窗体栏位、区块栏位 窗体选项栏位设置: /分组 /多选 multiple 文字区块的设置: 31.按钮、图像按钮 按钮设置: 第 14 页 共 50 页 按钮图像: 图像按钮: 32.允许上传文件 上传栏位: 33.表单加上外框和标题 外边框:. 标 题:. 34.元件的次序和快捷键 accesskey=“w“ (Alt+w) (Ctrl+w) tabindex=“n“ 35.多窗框的基本结构格式 功能说明: 用来设置多窗框结构的声明 下的属性： 属性名称 属性值 说明 cols 像素 设置直排的多窗框环境 百分比 同上 rows 像素 设置横排的多窗框环境 百分比 同上 border 像素 边框的宽度 framespacing 像素 页面与页面的边距 第 15 页 共 50 页 属性格式： 下的属性： 属性名称 属性值 说明 src URL 链接的页面 noresize true 允许浏览器自行改变框架大小 false 不允许 scrolling yes 不管网页内容的大小，都出现滚动条
