HTML4.01

html特点

• HTML不是编程语言，而是一种标记语言，就是用来描述网页内容的特定符号；
• 用该语言编写的文件，以.html 或者.htm 为后缀；
• 由浏览器解释运行；
• HTML是一种扩展性很强的语言，可以嵌套脚本语言，如：JavaScript；

版本信息

  在文档的起始用DOCTYPE声明指定的版本和风格，让浏览器清楚文档的版本和风格。版本信息分为三种：严格型（不包含弃用的元素（比如 font），不允许frameset）、传统型（包含弃用的元素（比如 font），不允许frameset）、框架型（包含弃用的元素（比如 font），允许frameset）；而目前html5统一使用
  注： 声明必须在HTML文档的第一行，位于标签之前；DOCTYPE声明是必不可少的, 声明不是 HTML 标签；它告诉浏览器该页面是使用哪个 HTML 版本编写的；
  注：HTML 4.01 与 HTML5 之间的差异：在 HTML 4.01 中有三种 声明；而在 HTML5 中只有一种：

html标记的语法

标记分为两种：单标记、双标记
  <标记符>没有结束的标记 — 单标记
  <开始标记符> — 双标记
注：在xhtml中规定，所有html标记都要小写，所有的标记都要有关闭符号。如：

---




meta标记

  meta标记是对网页文件的说明，便于搜索引擎查找，放置于之间。
设置关键字：多个关键字之间用“,”分隔
设置描述：
设置页面定时跳转：其中2代表2秒

语义标记

• 普通加粗标记：文字内容 普通倾斜标记：文字内容，二者都没有在语义上突出重点的意思
• 语义加强加粗标记：文本内容 语义加强的倾斜标记：文本内容，二者都告诉了浏览器，加粗或倾斜的是重点
• 下划线文本 删除线文本 上标文本 下标文本
换行标记
• 段落标记
  
  注：用适合的html标记，去描述网页内容，这才是网页优化的核心

标题

标题内容 ，标题标记，n的取值范围是1 – 6，标题标记内的文本会以加粗方式显示。

换行标记


在一个段落内换行。

水平分割线

主要属性：
 size属性，像素值和百分比，数值越大，线越粗；
 width属性，像素值和百分比，决定线的长度。其中，像素值是一个绝对的值，不会随着窗体大小的改变而改变；

xhtml中的属性值

在xhtml中，所有的标签都必须有属性值，如果没有就用属性名，例如：

特殊标记

居中：

…… (在xhtml中已被废弃)；
预格式化：

特殊字符（转义符）的输入

空格： 或者 
"："
＆：&
＜：<
＞：>

列表

• 无序列表
  ...
  [Unordered List]
  语法：

    
列表内容1

说明：符号类型有三种，disc是实心圆圈，circle是空心圆○，square是正方形

• 有序列表
  ...
  [Order List]
  语法：

    
列表内容1

说明： type属性的值有：1、a、A、i、I。
1 表示编号从阿拉伯数字1开始依次往后
a 表示小写英文字母 a、b、c、d
A 表示大写英文字母 A、B、C、D
i 表示小写的罗马数字 i、ii、iii、iv
I 表示大写的罗马数字 I、II、III、IV

图片

语法：
属性：

• src：图片的路径，URL
• alt：图片的替代文本（图片无法显示时）
• title：鼠标悬停时显示的内容

网页布局思想

• 传统的table标记，发展到DIV+CSS；
• 从左到右，从上到下；

table标记

【1】基本结构：
    ●...定义表格
    ●...定义表行
    ●...定义单元格
    ●...定义标题栏（文字加粗）
【2】属性：
    ●，单元格边框与内容之间距离的大小，默认为2，内填充。
    ●，设置单元格之间空间的大小（单元格间距），外填充。
【3】列（单元格）之间没有内容时，默认是不显示边框的，如果想看到，可以加上 
表格的标题
表格的结构化
    
的属性：
    ●
，设置行合并的数目（垂直合并）。
    ●
,设置列合并的数目（水平合并）。
 
 
注：当
 
  
 
...
 
  
 
...，表头区。
        ...，表体区。
        ...，表尾区。
    

表格案例

实现下图效果：

    ab


    cd


    e

超链接

语法：

显示内容

_self在自身窗口中打开（默认值）
_blank在新窗口中打开
超链接的分类：

• 内部链接：
   当前文档与目标文档在同一站点内。
• 外部链接：
   当前文档与目标文档不再同一站点内。
• 局部链接（锚点）：
   跳转到同一网页或其他文档中的指定位置。用法：
     创建锚点：显示内容
     链接锚点：显示内容
• 脚本链接：
   是一种特殊的链接，当单击设置脚本的文本或图像时，就会执行相应的javascript语句。

新浪
关闭窗口：关闭窗口
打开窗口：打开窗口
执行自定义函数弹出一句话

HTML表单

    【1】form（表单）标记用于创建一个表单，定义表单的开始与结束。所有表单元素必须在
标记中才有作用。
    【2】语法：
        

            表单元素
        
    【3】表单元素标记：
        ●单行文本框：
            
        ●密码框：type = "password"
        ●单选框：
            
            注意：单选框的name属性要一样，否则无法单选，即可以使用name属性分组
        ●复选框：
            
        ●提交按钮：submit
        ●重置按钮：，重置按钮会清除表单中的所有数据
        ●列表框：
            下拉菜单式：  
                    
                        列表1
                        列表2
                    
            列表式：    
                    
                        列表1
                        列表2
                    
            注：只要加上size属性并且size大于1，即可实现下拉菜单式到列表式的转换。
        ●文件浏览框：file
        ●按钮：
        ●图形按钮：
        ●多行文本框：
                            初始内容
            
        ●隐藏域：
    【4】input标注...：
        标注内容标签为input元素定义标注。lable元素的for属性应与相关元素的id属性相同。
     eg: 男
        label标记，可以点击里面的“男”而达到选中单选框的效果，改善用户体验度。

html与xhtml 1.0的区别

• xhtml 标签必须被正确的关闭；
• 标签名必须用小写字母；
• 属性名必须小写，必须有值；