《李炎辉css+html 学习笔记1-12div+css+html 总结》由会员分享，可在线阅读，更多相关《李炎辉css+html 学习笔记1-12div+css+html 总结（16页珍藏版）》请在金锄头文库上搜索。
1、第 1 章 HTML介绍万维网（www worldwide web）是虚拟的。它无数不断变化的、种类不同的文档的集 合，这些文档驻留在因特网的某个地方，都是用某种形式的 HTML编写的。HTML（超文本标记语言）有两个基本特性超文本和普适性。超文本意味着可以在 网页中创建一个链接，从而将访问者链接到其他任何网页，实际上可以链接到因特网上的任 何东西。这意味着可以通过许多不通的路径访问Web 上的信息。Web 的创建者 Tim Berner s - Lee 希望 Web 能像人的大脑那样在信息之间建立广泛的联系，而不是像书籍那样只是静 态数据源。 1.1 普适性的意思是：因为HTML文档保存为纯
2、文本文件，所以实际上任何计算机都可以读 取网页。无论访问者是使用 Macintosh、Windows 还是 UNIX计算机，甚至是 Palm这 样的 手持设备，都可以打开网页。Web 对所有计算机都是开放的 第 2 章 HTML 基本结构 1. HTML 的基本结构 2. HTML 控制标记的格式 3. 最常用的控制标记 本章讲解最基本的 HTML 元素，也就是创建文档结构所需的元素。例如：标题、段落、 页面分隔、注释等等。 2.1 HTML 的基本结构-根控制标记-头控制标记标题-标题标记 -头控制标记（尾）-网页显示区域-根控制标记(尾)(1).根控制标记 开头和结尾成对出 现，双标签 (
3、2).头控制标记1.很单纯的文件标题声明 2.控制标记的动态文件转换声明 3.超链接网址基准参考点 4.Javascript 和 VBScript 程序 5.stylesheet 可用来设置排版来的声明 6.可引用外部文件，如 CSS 排版样本 (3).设置浏览器的视窗标题 (4).页面可见内容 2.2 HTML 控制标记的格式(1). 单一型,无设置值的。 如： (2). 单一型，有设 置值的。如： (3).对称型，无设置值。 如： (4).对称型，有设置值。 如： 2.3 最常用的控制标记 (1).跳行 格式：无属性设置(2).段落格式： 属性名称属性值说明 alignleft往左靠（默认
4、） center往中靠 right往右靠(3).水平直线 格式： 属性名称属性值说明size像素绝对设置，以数字表示，属性值越大，线越粗 百分比相对设置，以%表示，属性值越大，线越粗 width像素绝对设置，长度不会应视窗的改变而改变 百分比相对设置，长度会随着视窗宽度而改变noshade实体线 (4).向中对齐 (被废弃的标签) 格式： (5).背景色与文字设置格式： 整体页面的边距，行距 (6).标题文字设置格式： 属性名称属性值说明 alignleft靠左 center靠中 right靠右(7).特殊字符设置格式：gt;“ quot; (8).在 HTML 备注 格式： (9).实体字符
5、控制标记1. 粗2. 斜3. 删4. 下划5. 电报6. 下标7. 上标 (10).语意字符控制1. 地址 2.大字 3.删除第 3 章 排列清单控制标记 1.无序号条例式清单 2.有序号条例式清单3.无序列表和有序列表的结合应用 4.叙述式清单 排列清单控制标记可以创建一般的列表、编号列表或加着重号列表，以及定义列表。还 可 以在一种列表中嵌套另一种列表。对于概括因特网上的内容，列表是非常方便的。 3.1 无序号条例式清单 与 格式: 功能: 无序条列清单的开始. 表示结束. 表示一个项目.的属性 属性名称属性值说明typedise实心圆(默认值) circle空心圆 square实心方块3
6、. 2 有序号条例式清单 与 格式: 功能: 有序条列清单的开始. 表示结束. 表示一个项目.的属性属性名称 属性值 说明type1 表示以 1,2,3,4 来表示a表示以 a,b,c,d 来表示A表示以 A,B,C,D 来表示i表示以 i,ii ,iii 来表示I表示以 I,II,III 来表示 3.3 无序列表和有序列表的结合应用格式:. 3.4 叙述式清单 (定义列表 ) 格式: 功能: 叙述清单的开始 表示一个项目 表示一个项目下的更详细的内容 第 4 章 表格 1.表格的基本格式 2.标签下的常用属性 3.标签下的边框设置 4.标签下的常用属性 5.拆分与合并单元格 6.表格的结构化
7、、直列化、标题 7.表格的嵌套 在网页中表格是一种经常使用到得设计结构，就像表格的内容中可以包含任何的数据， 如文字、图像、表单、超链接、表格等等，所有在 HTML 中可以使用的数据，都可以被设 置在表格中，所以有关表格设置的标记与属性页特别多。 4.1 表格的基本格式 格式: 功能: 用来声明表格开始与结束. 用来设置表格的行. 用来设置标题栏位. 用来设置数据栏位.4.2 标签下的属性属性名称属性值说明border像素设置表格的边线 cellspacing像素绝对设置, 存储格框线宽度 百分比相对设置, 存储格框线宽度cellpadding像素绝对设置, 数据与框线的距离 百分比相对设置,
8、 数据与框线的距离width像素绝对设置, 像素表示表格宽度 百分比相对设置, 百分比表表格宽度 height像素绝对设置, 像素表示表格宽度 百分比绝对设置, 百分比表表格宽度alignleft表格往左靠( 默认)center表格往中靠right表格网右靠 bgcolor英文/ 十六表格的背景颜色 backgroundURL表格的背景图片 summary字符串用来描述表格数据说明 bordercolor英文/十六边框的颜色 bordercolorlight同上边框的亮色 bordercolordark同上边框的暗色4.3 标签下的边框设置属性名称frame该属性必须在 border 的属性值
9、不为0 的状 态下!rules属性值 说明 void不要显现表格的边线above只要显现出表格的上边线below只显现出表格的下边线hsides只显示表格的上下边线vsides只显现表格的左右边线lhs只显现表格的左边线rhs只显现表格的右边线border/box 会显现出表格的所有边线rows只显示出横行的格框线cols只显示出直行的格框线all显示全部格框线groups表示列组合水平部分none不显示任何格框线4. 4 标签下的常用属性 属性名称属性值说明width像素绝对设置, 以像素值设置宽 百分比相对设置, 以百分比设置宽height像素绝对设置, 以像素值设置高 百分比相对设置,
10、以百分比设置宽 bgcolor英文/ 十六数据栏的颜色设置 align(水平方向) left数据靠左center数据靠中 right数据靠右 valign(垂直方向) top数据靠上 middle数据靠中bottom数据靠下 nowrap无在单元格中换行4.5 拆分与合并单元格属性名称属性值说明colspan数字向两边扩展栏位 rowspan数字向下扩展栏位4.6 表格的结构化、直列化、标题(1).结 构化格式 - -表头区 - -表体区 - 表尾区(2).直列化格式：.属性名称属性值说明alignleft靠左center靠中 right靠右 valigntop靠上 middle靠中 bott
11、om靠下 span数字直列数目 width像素/ 百分比宽度个别直列设置 第 5 章 图像 1.背景图案的设置 2.将图片插入到网页中去 3.用图像作为超链接 4.使用工具建立地图索引 5.切片索引 6.为网站添加图标 5.1 背景图案的设置 格式：5.2 将图片插入到网页中去格式:功能:将图片插入到网页中去 ,单一标签下的属性 属性名称属性值说明srcURL图片的路径图片的注解属性名称属性值说明alt字符串给图片做注解图象大小的设置属性名称属性值说明width像素绝对设置, 宽 百分比相对设置, 宽height像素绝对设置, 高百分比相对设置, 高图象边框的设置 属性名称属性值说明borde
12、r数字图象边框文字图象的排列 属性名称属性值说明alignleft图象靠左, 文字靠右right图片靠右, 文字靠左top文字往上靠 middle文字靠中bottom文字靠下空隙的设置属性名称属性值说明vspace像素垂直上下两端与物件的距离hspace像素水平左右两段与物件的距离 5.3 用图像作为超链接格式:注意点: 边框的问题. 5.4 地图索引格式:声明整张图使用地图链接方式进行连 接 . name,id指此图的名称 .表示我们所要链接其中一点的区快 shape表示我们所选择的形状 , 如:rect 矩形 circle圆 poly多边形 coords 表示地图的坐标位置 ! 5.5 切
13、片索引 使用Firework 来进行!用表格进行定位 ! 5.6 为网站添加图标 link rel=“shortcut icon“ href=“favicon.ico“ type=“image/x-icon“ 第 6 章 超链接 1.超链接的基本格式 2.超链接的种类 3.相对链接和绝对链接 4.书签的链接 5.基准参考点 6.超链接事件 7.为链接创建键盘快捷键 8.为链接设置制表符次序 超链接也叫 URL 中文翻译为资源定址器. 这个定址器的功能主要告诉浏览器根据 URL 的地址找到所需的资源。6.1 超链接的基本格式 格式:scheme:/host:post/path/filenames
14、cheme 指的是 http,ftp,file,mailto,news,gopher,telnet七种 host 指的是 IP 地址或计算机名称post 指的是服务器端口 path 指的是文件路径 filename 指的是文件名 6.2 超链接的种类一般常用的分为四种: 1. http声明 网易 logo2. file声明 图片3.ftp 声明进入4.mailtoE-MAIL6.3相对链接和绝对链接1.index.htm 2.page/index.htm 3.page/top/index.htm 4. /index.htm 5. . /./index.htm 6. /page/index.ht
15、m6.4书签的链接 下的属性属性名称 属性值 说明name字符串 设置超链接的标 基本格式：瞄点 链接点 链接到别的网页的书签项目： 基本 格式：瞄点 链接点 6.5 基准参考点 基本格式： 6.6 超链接事件 LINK 颜色的设置： 基本格式： link 超链接尚被选中的文字 alink 超链接点选但未被放开的颜色vlink 超链接已被点选过的颜色6.7 为链接创建键盘快捷键：accesskey=“w“ (Alt+w) (Ctrl+w) 6.8 为链接设置制表符次序：tabindex=“n“ 第 7 章 表单 1.表单的功能结构 2.文本栏、密码栏、隐藏栏 3.复选栏、单选栏 4.窗体栏位、区块栏位 5.按钮、图像按钮 6.允许上传文件 7.表单的外框和标题 8.元件的次序和快捷键 表单是提供让读者在网页上输入，勾选和选取数据，以便提交给服务器数据库的工具。 7.1 表单的功能结构： 主标记结构： 属性值说明name字符串给这个表单起个名字 methodget/post表单的传输方式 actionurl
