Html

来源：互联网发布：徐留平一汽改革知乎编辑：程序博客网时间：2024/06/05 15:22

1. Html定义

Hyper Text Markup Language 超文本标记语言

html 1.0 -> html 2.0 -> ... -> html 4 -> html 5

2. 网页的基本结构

<html>

<head>

<title>这里显示标题文字</title>

</head>

<body>

这里显示正文内容。

</body>

</html>

title：网页的标题

body：网页的正文部分

父子关系：父元素、子元素。兄弟关系：兄弟元素。

祖先后代关系：祖先元素、后代元素。

3. 浏览器

用于查看运行网页文件。

IE、360、猎豹、谷歌、火狐、欧鹏、世界之窗... ...

4. 网页开发工具

记事本、Dreamweaver、sublime text、... ...

5. 网页编码(乱码)

文件在保存时使用的编码、网页文件在浏览器中查看时使用的编码

现在有很多字符编码格式：ascii(256:字母、数字、常用符号)、gbk、gb2312、UTF-8

6. 常用网页标签

1>. 标题标签 h1 h2 h3 h4 h5 h6

2>. 段落标签 <p></p>

3>. 换行标签 <br />自闭合标记

4>. 水平线标签 <hr />

5>. 加粗：strong 斜体：em

6>.特殊符号（实体字符）

< <

> >

" "

@ ©

空格

7. 注释

让开发人员看的，以后维护网页非常方便。

8. 图片标记

src属性：设置要显示的图片路径

alt属性：当图片路径不存在时，使用指定文字代替

title属性：当鼠标悬浮到元素上时，提示的文字信息

width和height属性：设置图像的宽度和高度（其他html元素也可以使用这两个属性控制大小）。

9. 超链接

用途：用于实现页面间导航、锚链接（跳转到页面指定元素的位置）、功能性链接（文件下载|发送邮件）

<a href="目标页面地址" target="">文字或图片</a>

target属性：_blank(打开新窗口加载目标页面)、_self(在当前窗口加载目标页面)

10. 文件扩展名

不同类型的文件，有不同的文件扩展名。

音频文件：.mp3

视频文件：.mp4 .avi .rmvb .rm

安装文件：.exe

图片文件：.png .jpg .gif *.bmp

网页文件：.html .htm

设置计算机显示和隐藏文件的扩展名：

打开计算机（我的电脑）->工具菜单->文件夹选项->查看->隐藏文件的扩展名

11. 列表

定义：由很多相同或相似的列表项组成的集合就是列表。

分类：无序列表、有序列表、定义列表

12. 无序列表

ul：无序列表 li：列表项

<ul>

</ul>

无序列表type属性：disc（实心圆=默认值）、square（实心方块）、circle（空心圆）

13. 有序列表

ol：无序列表 li：列表项

<ol>

</ol>

有序列表type属性：1（数组=默认值）、A|a（大|小写字母）、I|i（大|小写的罗马数字）

14. 表格

组成元素：table、tr、th、td

用途：呈现数据；布局

边框：<table border="1" cellspacing="0" cellpadding="10">

border：边框线的宽度

cellspacing：单元格与单元格之间的距离

cellpadding：单元格与内容之间的距离

对齐方式（td）：

水平对齐：align:left|right|center

垂直对齐：valign:top|bottom|middle

<table>

<tr>

</tr>

<tr>

</tr>

</table>

跨行：rowspan="n" 跨列：colspan="n"

15. 框架：frameset

注意：使用frameset时，不能使用Html（head|body）标记

cols属性：设置框架划分为几列。cols="20%,*" *代表占据所有剩余空间。

rows属性：设置框架划分为几行。*代表占据所有剩余空间。

</frameset>

禁止改变框架的大小：<frame noresize="noresize"></frame>

去掉框架的边框：<frameset frameborder="0"></frame>

16. 框架：iframe

注意：iframe可以嵌入到html结构中。

scrolling：是否允许出现滚动条

17. form表单标记

method：控制表单的提交方式。method属性值可以是：post和get。

l get：表单中提交的数据会显示到Url地址中。

l post：表单中提交的数据不会显示到Url地址中。

action：控制表单提交的地址。

注意：form不会在页面中呈现任何可视化的内容。

http://www.baidu.com/search.html?name=zhangsan&password=123456

url ?后面的内容都是参数，?前面的是页面地址，上面Url中包含2个参数：name、password

18. 表单元素

1>.单行文本框

2>.密码框

3>.按钮

提交按钮：<input type="submit" value="按钮上显示的文本" />

重置按钮：<input type="reset" value="重置" />

普通按钮：<input type="button" value="显示的文本" />

图片按钮：<input type="image" src="图片路径" />

4>.单选按钮

注意：如果多个单选按钮要具有互斥的效果，应该保持他们的name属性值相同。

5>.复选框

6>.下拉列表框

</select>

7>.多行文本框

8>.文件域

3.语义化表单

1>.fieldset 和 legend

......

</fieldset>

2>.label

0 0