html、CSS笔记.doc
1、Html/Css语言剖析 紫竹林 HTML语言剖析 Html简介-目录 全写： HyperText Mark-up Language 译名： 超文本标识语言 简释：一种为普通文件中某些字句加上标示的语言，其目的在于运用标签（tag）使文件 达到预期的显示效果。由文字（字母，数字、标点符号）及标签组合而成。任何文字编辑器都可以，这里推荐用：Dreamweaver。 1. Html特点： ► 描述性语言，结构语言，用于决定网页内容以什么样的形式显示； ► 通过标签来控制网页的文档、字符和段落等的格式，以及对脚本语言等的调用； ► 纯文本文件，可以使用各种文本编
2、辑器编写； (Dreamweaver是首选) ► 文件扩展名： .htm 或 .html； ► html文件必须在Web浏览器上运行；（运行环境） ► 具有跨平台性。 2. HTML语法结构： ► HTML文件是由一系列的元素和标签（tag）组成的； ► 元素：网页中的内容； ► 标签：用于规定元素的属性和它在文件中的位置； ► 格式：<元素名称 属性="值"...>元素资料,<元素名称 属性="值"...> ► 不区分大小写。 3. HTML文件结构： ► 起始标记： 表示HTML网页的起始； ► 文件
3、头部：
设置初始化文档信息和文档管理标注； ► 文件主体： 设置格式化的浏览器显示的文档（内容）； ► 注释部分： 可以放在任何位置； ► ※ 例:4、网页内容--> n 标签写法： ► 任何标签皆由"<>"所包含，如 ► 标签名与小于号之间不能留有空白字符。 ► 某些标签 要加上参数，某些则不必。如 大家好 ► 参数只可加于起始标签中。 ► 在起始标签之标签名前加上符号" / "便是其终结标签，如 ► 标签字母大小写皆可。 n 成对标签与单标签： 标签按型态分为成对标签与单标签 1. 成对标签 顾名思义，它以起始标签及终结标签将文字围住，令其达到预期显示效果。 例
5、如 HTML 源码 ： 我愿意和大家显示成：我愿意和大家一起学好html/css!大家有信 心吗？
其中 便称为成对标签。
它以起始标签 及结尾标签 标示文字我愿意和大家一起学好html/css!令它显示成粗体，两者失其一都会发生错误显示。
2. 单标签
是指标签单独出现，只有起始标签没有终结标签。
※ 例如 HTML 源码：
I love my hometown.
It's a beautiful place.
显示成：
I love my hometown.
It's a beautiful
6、place.
其中换行标签
便属单标签。
它的作用便是将标签后所有东西显示于下一行，可见结尾标签对于它是没意义的， 但有些人会为空标签加上终结标签，如果加上结尾标签，对 HTML没有影响。 便于记忆。
HTML语言剖析
Html标记一览-目录
标记
类型
译名或意义
作 用
备注
文件标记
●
文件声明
让浏览器知道这是HTML文件
17、 http-equiv="refresh" content="2;url=">
18、整个文件处于标记与之间。用以声明这是HTML文件，让浏览器认出并正确处理此HTML文件。 ► 文件分两部分，由
至称为开头 ，至称主体（或者称之为正文）。 基本上两者各有适用的标记，如20、tp-equiv="refresh" content="10">
► 跳转：
► 文档过期：
► 基础地址：
23、各种颜色的值及名称可参考【调色原理】一节。 ► link ="#0000FF" 设定一般文字链接颜色。（默认为蓝色） ► alink ="#FF0000" 设定鼠标刚按下时文字颜色。 ► vlink ="#0000FF" 设定链接访问后的颜色。（被点击过）。 ► background ="bg1.gif" 设定背景图片。GIF 或 JPEG 皆可，可以是绝对途径或相对途径。 ► bgcolor ="#FFFFFF" 设定背景颜色。当己设定背景图片时会失去作用，除非图片有透明部分。 ► leftmargin =2 设置网页的左边距，单位为像素。 『
24、只适用于IE』
► topmargin =2
设置网页的上边距。 『只适用于IE』
► bgproperties ="fixed"
固定背景图片，当滚动条拖动时背景图片不会跟着滚动。 『只适用于IE』
注：标记及参数之字母大小都可以。
HTML语言剖析
字体标记-目录
标记。 n
► 可令每字母有相等宽度且每字母之间的距离稍为加宽。但于 NC 不见得如此。
► 是加底线的标记，一些特别的浏览器并不支援，因顾虑到与连结混淆。
► 加上删除线的标记。
► 令字体加大。
► 令字体变细。
► 为下标字 ；
；
； ； ； ； ；
n ：
► 为文中不同部份加上说明，方便日后修改。
※ 例：
► 用作版权声明。
假如你不希望别人使用或复制你的网页，可加上警告字眼。
※ 例：
n ：
称为段落标记。作
是一成对标记，标于一段落的头尾，但从 HTML 2.0 开始己不需要
作结尾。的常用参数：如：
► align ="center"
可选值：right, left, center。
内定值： align=" left "
n
：
称为 换行标记 。作用：使文字、图、表格等显示于下一行。
由于浏览器会自动忽略原始码中空白和换行的部分，这令到
成为最常用的标记之一。因为无论你在原始码中编好了多漂亮的文章，若不适当地加上换行标记或段落标记，浏览器只
：
称为水平线 。作用：插入一条水平线。
之参数修改：
以：
为例。
► align ="LEFT"
设定线条置放位置，可选择：left；right；center 三种设定值。
► size ="2"
设定线条高度，以像素作单位，默认为 2。
► width ="70%"
设定线条长度，可以是绝对 ：
称为 居中标记 。作用：使文字、图片、表格等显示于中间。
这标记原先是 Netscape 所定义，后来其它浏览器都支似乎多余了，事实上它还是常用的标记之一，其简单易用，常用于文字上，对于己加有align="CENTER"参数的 标记亦要不厌其烦地加上居中标记，因有许多浏览器不支持标记中的align="CENTER"参数。
※ 例：
滚滚长江东逝水
这几天心里颇不宁静
这几天心里颇不宁静
n ：
称为预设格式标记 。作用：令文字按照原始的排列方式显示。
：
称为区域标记 。作用：设定文字、图片、表格等的摆放位置。
应用于Style Sheet（样式表）方面功能会更显得强大，它最终目的是给设计者另一种组织能力，有Class; Style; title ; ID等属性，在CSS部分详细讲解，这处只介绍一个属性设定。
※ 以 为例：
► align ="center"
可选值：center ; left ; righ 的作用和居中标记 一样，前者是由 HTML3.0 开始 的标准，后者是通用己久的标示法。
n ：
称为 不折行标记 。作用：某些文字因太长而分开，以显示于同一行或下一行。它对网址、数学公式、一行数字、程序代码等尤为有用。
n ：
称为 建议折行标记 。作用：预设折行部位。
它没有抵触到
的格式规范，只是作建议而已，若观者的系统解像度够高的话，那么它是不会折行的。
HTML语言剖析
列表标记-目录
<
-
-
n
- :
称为有序列表标记。- 则用以标示列表项目。
所谓有序列表就是在每一项前面加上 1,2,3... 等数目，又称编号列表。
1
type=1
1,2,3, ...
a
type=a
a,b,c,…
A
type=A
A,B,C,…
i
type=i
i,ii,iii,…
Ⅰ
type=I
Ⅰ,Ⅱ,Ⅲ,…
1.
的参数设定（常用）：
※ 例：
- 的参数设定（常用）：
※ 例：
-
► type ="square"
只适用于 非顺序列表 ，设定符号款式，其值有三种，如下，内定为 type=" disc "：
符号 是当 type=" disc " 时的列项符号。
符号 是当 type=" circ
：
称为 无序列表标记。
所谓无序列表就是在每一项前面加上 、 、 等符号，故又称符号列表。
的参数设定（常用）：
※ 例：
► type ="square"
设定符号款式，其值有三种，如下，内定为 type="disc"：
符号 及 - 都有 type 这个参数，两者尽可能选用其一。
n
-
- :
称为定义列表标记。 - 用以标示定义条目，
- 则用以标示定义内容。
所谓定义列表就是一种分二层的项目列表，其不顾符号及数目。
三个标记都没有常用的参数。而
-
- 可以独立使用，只是一些旧的浏览器并不支 援，如 IE 3.0。常用的如
- 标记可用以制造段落
- 古典文学
- 《三国演义》
- 《水浒传》
HTML语言剖析
表格标记-目录
n ：
这三个标记是定义表格的最重要的标记，是一个定义一个表格标记，用以声明这是表格而且其他表格标记只能在他的范围内才适用，属于表格标记的还有其它。
用以表示表格列 （row）
用以表示表格单元格（cell）
1. 的参数设定（常用）：
※ 例：
<
不显示表格边框
只显示表格的上下边框
只显示表格的左右边框
只显示表格的上边框
只显示表格的下边框
只显示表格的左边框
只显示表格的右边框
只显示组与组的分隔线
只显示行与行的分隔线
只显示列与列的分隔线
所有分隔线都不显示
2. 的参数设定（常用）：
※ 例：
► align="RIGHT"
该一列内文字图片等的摆放位置（水平），可选值为： left , center , right 。
► valign="MIDDLE"
该一列内文字图片等的摆放位置（垂直），可选值为： top , middle , bottom 。
► bgcolor="#0000FF"
该一列背景颜色，
► bordercolor ="#FF00FF"
该一列边框颜色『只适用于 IE』
► bordercolorlight ="#808080"
该一列边框亮（外）边框部分的颜色，『只适用于 IE』
► bordercolordark ="#FF0000"
该一列边框暗（内）边框部分的颜色，使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。 『只适用于 IE』
3. 的参数设定（常用）：
※ 例：
©2010-2025 宁波自信网络信息技术有限公司 版权所有
客服电话：4009-655-100 投诉/维权电话：18658249818
浙ICP备2021020529号-1 | 浙B2-20240490
关注我们 ：
