Html笔记.docx

1、Html笔记网页主体标记body常用属性：1、 背景色：bgcolor = “颜色值” 例如： 2、 背景：background 设置网页的背景图片3、 文字颜色：text=“颜色值“4、 Link属性：设置链接的颜色 例如5、 Vlink属性：设置访问过后的链接的颜色6、 Alink：7、 边距属性：topmargin，leftmargin相对路径和绝对路径1、 绝对路径：例如：D：test.txt2、 相对路径：标题字设置文字格式的标签标题字标签：1、字体大小: h1h6 字体逐渐减小2、 字体分布（布局）：align 值为left（默认值）、right、center3、 Center标签

2、：使标签内的文字居中；效果与 一样4、 Right标签：使标签内的文字靠右；效果与 一样5、 left标签：使标签内的文字靠左；效果与 一样设置网页的默认文字大小的标签 其中：n的值为17文本基本标记1、 font：设置文本样式；用来控制字体，颜色等1）、face属性：face设置字体样式 例如：face = “黑体”，其默认是宋体2）、size：字体大小，整数17代表绝对字号，-4+4是相对于3号字体的相对大小3）、color：字体颜色2、换行标记：文本格式化标记1、 粗体标记：2、 斜体标记：3、 上标标记：4、 下标标记：5、 big标签：6、 small标签：7、 strong标签：加

3、粗标签，与 一样8、 em标签：倾斜标签，与一样9、 strike标签：删除线标签，10、 u标签：下划线标签11、 del标签：删除标签12、 ins标签：插入标签，效果与u标签一样13、 tt标签：设置字体等宽标签14、 在之间，用以设定默认打开窗口常用的段落标记1、 p：段落标签，,属性：1）、align属性：对齐方式,值为：left、right、center、justify（两端对齐） 2）、dir属性：设置段落的文字方向，值为：LTR:从左至右，RTL：从右至左 从右至左时，标点符号还是在最左边； 3）、lang属性：为不同的段落设置不同的段落语言，有利于搜索引擎的搜索；例如：；语言

4、代码的值有：中文：zh 中文（中国）：zh-cn 等4）、title属性：设置标题属性，当一个段落的内容很长时，才会为段落设置标题，以方便读者浏览时知道该段的主题是什么。当设置标题后，鼠标停留在该段的文字上时，会在鼠标附近显示一个小小的黄色注释框，注释框的内容就是标题的内容；设置标题的语法为： 段落内容2、:换行标签3、：换行并清除格式，格式有：left、right、cneter、all、none3、:禁止换行，浏览器默认是自动换行。4、软换行wbr：只是在nobr区域里的一个点，而且这个“换行”不是一定需要换行，只是在浏览器窗口显示不下文字时才在软换行标签处进行换行；语法为： 注意：因为no

5、br和wbr不是HTML4.01中的标准元素，internet explorer能支持，有的浏览器不一定支持；水平线标记1、 语法：2、 高度属性 ：size = “3” 只能设置像素3、 宽度：width=“30%”4、 颜色：color = “#foadjo”5、 去掉水平线的阴影:noshade，默认是显示阴影；6、 对齐属性：align=” 值为：right、left、cneter预定义格式如果想要在浏览器中显示源代码中所设置的格式，可以用pre元素，pre元素相当于设置了一个“块”，这个块可以将源代码中的所有文本（除了HTML标签）在浏览器中按原样显示出来；语法格式：内容其中：lan

6、g和title属性与段落中的功能一样；width是设置pre块的宽度，但不提倡，因为不是所有的浏览器都支持；块引用块引用通常是用来突出一段引用别处的文字，比如引用书中的一段文字。在浏览器中通常是以缩进的方式来显示，有少数的浏览器是以斜体来显示该段文字；语法格式：引用文字其中：cite是引用地址，可以是URL，也可以是纯文字。Lang、dir、title属性均与P元素的相同；还有其他的引用元素：特殊效果设置文字闪烁使用blink可以使网页中的文字闪烁，但它不是HTML4.01中的标准元素，所以不是所有的浏览器都支持这种效果，其中IE就不支持；语法格式：设置滚动效果marquee标签语法格式：1、

7、 利用一对marquee标签实现滚动效果，其中滚动内容包括文字、图片、表格等2、 direction：利用该属性，可以设置滚动的方向，值为：up、down、left、right。3、 behavior：设置滚动方式：值为：scroll（默认值）：表示循环滚动、slide：只滚动一次就停止、alternate：表示来回交替进行滚动4、 scrollamount：设置滚动速度。其实是设置每次滚动时移动的长度，以像素为单位。5、 scrolldelay：滚动延迟，设置滚动时的时间间隔、单位是毫秒。6、 loop：设置滚动次数，默认情况下是不断的循环下去。如果希望滚动n次就停下，则loop属性值就为n

8、。7、 滚动范围：通过设置width和height属性完成。如果不设置滚动的面积，默认情况下，水平滚动的文字背景与文字同高、与浏览器同宽。如果想设置滚动范围，就需要设置width和height属性。单位为像素。8、 hspace：设置滚动区域与其他内容的水平空白区域的像素个数9、 vspace：设置滚动区域与其他内容的垂直空白区域的像素个数其他特殊效果Acronym：缩写元素Abbr：缩写元素Def：定义元素第三章 HTML中的超链接1、创建超链接外部超链接1、 定义：设置超链接的链接地址是其他网站，而不是网站内部的页面，一般多数用在网站的友情链接部分内部超链接1、 定义：链接地址是在同一个网

9、站内的页面，链接对象是在同一个网站中的资源 target属性：用来控制目标窗口的打开方式，target有四个属性值，先学两个：1、-self：表示在当前的页面打开链接，这是默认值 2、-blank：表示在全新的空白窗口中打开链接超链接元素语法超链接文字其中：name：用于设置超链接的锚名称； Href：用于设置超链接的链接地址，很多协议：例如：http:/、ftp:/等 Title：用于设置超链接的标题内容； Target：用于设置打开超链接的目标地址，属性值有两种：第一种是内置属性值：“_blank”：代表在新窗口中打开超链接“_self”：代表在当前窗口打开超链接，这是默认值“_paren

10、t”：与页面框架有关，代表在父窗口中打开超链接“_top”：与页面框架有关，代表在顶级窗口中打开超链接第二种属性值是命名值，可以直接指定浏览器的窗口名，在该窗口打开超链接创建本页锚链接第一步：在要跳转到的区域设置文字第二部：创建一个跳转到锚点名称的超链接链接文字创建链接到其他网页的锚链接第一步：在目标网页上设置锚点名称：文字第二部：在当前网页上设置好超链接：链接文字超链接的其他属性及应用1、 Tabindex属性：设置超链接的Tab顺序，使用tab键来激活超级链接，以及一些可以与客户交互信息的客户端组件。语法格式：超链接文字例如：tab次序为2tab次序为1tab次序为32、 accesske

11、y属性：设置超链接的快捷键，使用键盘上的快捷键来激活超级链接。 语法格式：超链接文字例如：例一（请按alt+2）例二（请按alt+1）例三（请按alt+3）3、 charset属性：设置超链接指定的目标网页的字符编码。语法格式：超链接文字例如：例一4、 hreflang属性：设置超链接指定的目标网页的字符编码。语法格式：超链接文字例如：例一5、 type属性：指定链接目标的文件类型语法格式：超链接文字例如：例一6、 rel属性和rev属性：表示当前网页和目标网页的关系； rel属性表示从当前网页到目标网页的关系，而rev表示从目标网页到当前网页的关系；两个属性的属性值可以为：alternate

12、（备选）、stylesheet（样式表）、start（开始）、next（下一页）、pre（上一页）、contents（内容）、index（索引）、Glossary（词汇）等。（可上网搜索或者是找W3C帮助文档）；语法格式：超链接文字例如：下一页超链接妙用1、 锚点：不用拖动滚动条就可以直接跳到指定的页面，网页中可以有多个锚点，但不能有相同名称的锚点，若锚点名称是英文字母，最好区分大小写。例子：2、 锚点链接和普通链接有点区别，需要用#号加上刚才建立的锚点名称作为href的属性值！3、 跳转到其他页面中指定链接地址：说明文字4、 利用链接下载文件：例如：说明 插入特殊符号1、 如何插入空格：&n

13、bsp；2、 插入特殊符号时，一般以&开头，加上特殊符号的代码，再加上；就可以了。例如：空格   ;第四章HTML中的图片语法格式：img标签：只有开始，没有结束图像标签常用属性1、 src属性：用于指定图片的位置；图片路径可以用本地的相对路径，也可用网址2、 alt属性：指定用于替代图片的文字，当图片不能正常显示时，可以使用该文字替代图片3、 高度和宽度：width 、 height；指定图片的宽度和高度4、 border属性：指定图片的边框大小5、 align属性：设置图片的环绕方式；当值为：left、right时，指定的是图片在文字的左侧（left）还是右侧（right属性）；当

14、值为：top、middle、bottom时。指定的是文字和图片是以顶部（top）对齐、中间对齐（middle）还是底部（bottom）对齐；6、 name属性：指定图片名称，可以省略7、 id属性：图片的编号，可以省略；在同一个文档中，不允许出现相同的ID，但可以有相同的name 图像的其他属性1、 垂直边距vspace：图片距离上方和下方文字的距离2、 水平边距还space：图片距离左方和右方文字的距离3、 低品质图片属性：lowsrc4、 可以将图片分为多个单击区域：服务端映射、客户端映射图片超链接：通过嵌套图像格式与图像标签1、网页中的图像格式：三种 Png、gif、jpeg 常用后两种

15、；2、gif格式：3、交错方式：4、jepg：5、png：第四章HTML中的列表认识列表1、 列表常用的数据排列方式2、 种类：有序列表、无序列表、定义列表3、 菜单列表无序列表语法： 项目列表1项目列表2其中：ul：无序列表开始/ul：无序列表结束li：列表项目开始。/li：列表项目结束Type：无序列表的项目前的标识符类型：值为：disc（实心圆点）、circle（空心圆点）、square（实心方块）Compact：该属性可以减少无序列表项目之间的行距；大多数浏览器已经不支持该属性；有序列表语法格式： 项目列表1项目列表21、 ol：副标签、li：子标签2、 type属性：有15种:A、a

16、、i、I、13、 起始数值属性：start 设置标号的起始数值4、 Compact：该属性可以减少无序列表项目之间的行距；大多数浏览器已经不支持该属性；定义列表1、语法格式： 项目项目说明1目录列表语法格式：属于无序列表 项目1项目2菜单列表 项目1项目2注意：HTML4.01中已经不建议使用目录列表和菜单列表列表嵌套1、 无序列表嵌套2、 有序列表的嵌套3、 列表的混合嵌套第五章HTML中的表格语法格式： 表头第一列 表头第二列 第一行第一列 第一行第二列 第二行第一列 第二行第二列其中：1、构成：table：表格标签 tr：行标签 td：单元格标签（列标签）2、表格标题标签：表格标题3、表

17、格表头标签：表头内容表格属性1、 宽度：width2、 高度：height3、 表格的对齐方式：align 属性值：left、right、center 表示表格相对浏览器的对齐方式，通过该属性，也可以设置对齐与文字的环绕方式。4、 表格边框颜色：bordercolor5、 单元格间距：cellspacing 例如：cellspacing=166、 表格内容与边框的距离：Cellpadding7、 背景颜色：bgcolor8、 背景图：background 例如：background=”baidu.jpg” 背景图属性与背景颜色属性不能同时设置9、 设置了文字与单元格的间距后，在设置行内容的对齐

18、方式就不准确了10、 指定表格列数：cols，该属性不是标准属性，不建议使用11、 表格与外部文本的间隔：hspace和vspace，有的浏览器不支持，不是标准元素12、 表头行thead：若表格内容占多页，则设置该属性可使每一页的第一行为表头，语 法格式：表头13、 表注行tfoot：效果与thead一样，语法格式：表注内容14、 行组元素和列组元素：上网搜标题属性：语法格式：标题属性：对齐方式：align和valign的组合。行属性：行属性：align，单元格文字的对齐方式（整行），值：left、center、right Valign ：单元格文字垂直对齐方式（整行），值：top、bott

19、om、middleHeight:行高度bordercolor：行的边框颜色bgcolor：行的背景颜色background：行的背景图片 bordercolorlight：亮边框属性：设置右边和下边 bordercolordark：亮边框属性：设置上边框和左边框tr标签可以通过bgcolor属性设置行背景颜色，通过background设置行背景图。行的bgcolor或者background属性仅作用于当前行，而且会覆盖table标签的bgcolor或者background属性距离目标元素最近的标签属性起作用，表格包含行，对行属性进行了背景颜色的设置，那么表格的背景颜色就对这一行没有了作用！行的

20、背景颜色会覆盖表格的背景颜色单元格属性：默认情况下，如果不设置单元格的高度和宽度属性，那么单元格会根据内容自动调整，而且一行内一个单元格设置了高度，那么其他单元格的高度也会随着这个设置了高度的单元格变化align，单元格文字的水平对齐方式（仅一个单元格），值：left、center、rightValign ：单元格文字垂直对齐方式 （仅一个单元格），值：top、bottom、middleHeight:单元格高度bgcolor：单元格的背景颜色bordercolor：单元格的边框颜色bordercolorlight：亮边框属性：设置右边和下边bordercolordark：亮边框属性：设置上边框

21、和左边框nowrap：禁止单元格文字自动换行colspan：单元格跨列属性，例如:colspan=”3”,表示该单元格宽度跨3列rowspan：单元格跨行属性，例如: rowspan =”3”,表示该单元格宽度跨3行在设计表格的时候，有时候需要让一个单元格横跨两个单元格的宽度，这个时候就需要用到单元标签的水平跨度属性-colspan，值为整数，也就是单元格要横跨的列数垂直跨度rowspan：用来设置一个单元格在垂直方向上的跨行数；若该行是最后一行，在下面没有行了，此时，该属性也就没有作用，表格边框属性HTML4.01为表格提供了多个属性用于设置表格边框。1、 Border：设置边框大小2、 F

22、rame：用于表格只显示哪几条边框。1. 值为：void：不显示边框，但显示区分行与列的内部边界线，与border=0不同a) above：只显示上边框b) below：只显示下边框c) hsides：只显示上边框和下边框，d) lhs：只显示左边框e) rhs：只显示右边框f) vsides：只显示左边框和右边框g) box：frame的默认值，显示所有边框h) border：与box相同，显示所有边框3、 rules：修饰表格的内部边界线a) none：不修饰内部边界线b) groups：根据列组合行组的信息显示边界线；c) rows：显示行边界线d) cols：显示列边界线e) all：

23、显示所有边界线；设置表格亮边框和暗边框1、 bordercolorlight：设置亮边框的颜色2、 bordercolordark：设置暗边框的颜色第六章HTML中的框架如何在网页中使用框架结构1、 : :2、 框架技术：可以在一个浏览器窗口中显示多个文档。利用这个特点，框架技术可以广泛的应用到网站导航和多页文档浏览中！方便访问者对网页的浏览 框架的基本属性1. 放在和之间2. rows属性：设置水平分割窗口，就是将页面水平方向切割，把页面分成上下排列的窗口，参数值就是灭个框架窗口的高度。这个值可以像素值，也可以是比例值，可以有多个值，用逗号分开；例如：固定值：百分比：、3. cols属性：设置垂直分割窗口，就是将页面垂