第一章：html
第 1 节01_html入门
1.HTML(Hyper Text Markup Language) 超文本标记语言
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
第 2 节02_字体标签
1.font标签，face属性指定文本显示的字体样式
实例： <font face="微软雅黑">字体</font>
2.特殊字符
< <
> >
& &
" "
® ®
© ©
空格
™ ™
第 3 节03_列表标签
无序列表
<ul> <!-- 符号标签（○●■）-->
<li>游戏</li>
<li>部门</li>
</ul>
注：ul中 type 属性有三个值 [ circle|disc|square ]，用于规定列表的项目符号， 但不赞成使用。
有序列表
<ol> <!-- 数字标签（a A 1 i I）-->
<li>游戏</li>
<li>部门</li>
</ol>
注：ol中 type 属性同样不赞成使用。
定义列表（definition list）
<dl>
<dt>游戏</dt>
<dd>穿越火线</dd>
<dd>英雄联盟</dd>
<dt>部门</dt>
<dd>研发部门</dd>
<dd>销售部门</dd>
</dl>
第 4 节04_图像标签
<img src="1.jpg" border="3px" title="鼠标移动上提示文字" alt="资源加载不到，提示文本" width="500px" height="200px"/>
alt:用来为图像定义一串预备的可替换的文本,不能超过1024字符。
第 5 节05_表格标签
1.表格标签 <table>
<table border width cellpadding cellspacing>
<caption>标题</caption>
<thead>
<tr>
<th>姓名</th> <!--对表格的第一行或者第一列进行 -->
<th>年龄</th> <!--格式化，就是粗体居中显示 -->
</tr>
</thead>
<tbody>
<tr> <!--行标签 -->
<td>张三</td>
<td>20</td> <!--单元格标签 -->
</tr>
<tr>
<td>李四</td>
<td>25</td>
</tr>
</tbody>
</table>
2.<table>常用属性
border：框线粗细 0代表无
width：宽度 接收整数值、百分数
cellpadding：单元格内容与边框的距离
cellspacing：单元格与相邻单元格之间的距离
3.<td>常用属性
colspan：合并同行单元格
rowspan：合并同列单元格
4.解决单元格边框重合问题
style="border-collapse:collapse;"
5.table内可以放多个tbody 提高下载速度
tbody 可以控制表格分行下载，从而提高下载速度（网页的打开是先表格的的内容全部下载完毕后，才显示出来，分行下载可以先显示部分内容，这样会减少用户等待时间）。
第 6 节06_超链接1
1.href：要打开资源的路径，可以是URL，也可以是本地文件。
2.target：指定在哪个窗口或者帧中打开。有四个值：
_blank：在一个新开的空白窗口中打开链接
_parent：在父级窗口中打开
_self：在自身页面中打开链接（默认）
_top：在整个浏览器的最顶端(前端)开始打开链接
第 7 节07_超链接2
锚点链接：
<a href="#标记名称">跳到标记名称</a>
...文字省略
<a name="标记名称" id="标记名称" ></a>
...文字省略
第 8 节08_框架1
1.框架格式
<html>
<frameset rows="20%,*">
<frame src="top.html">
<frameset cols="25%,75%">
<frame src="left.html">
<frame src="right.html">
</frameset>
</frameset>
</html>
注意：所有框架标记 要放在一个总起的 html 档，这个档案只记录了该框架 如何划分，不会显示任何资料，所以不必放入 <body> 标记。
2.<frameset>常用属性
COLS="20%,*"：垂直切割画面(如分左右两个画面)，接受整数值、百分数，* 则代表占用余下空间。数值的个数代表分成的视窗数目且以逗号分隔。
ROWS="120,*"：就是横向切割，将画面上下分开，数值设定同上。
frameborder="0"：设定框架的边框，其值只有 0 和 1 ，0 表示不要边框，1 表示要显示边框。
border="0"：设定框架的边框厚度，以 pixels 为单位。
bordercolor="#999"：设定框架的边框颜色。
framespacing="5" ：表示框架与框架间的保留空白的距离。
3.<frame>常用属性
src="top.html"：设定此框窗中要显示的网页档案名称，每个框窗一定要对应著一个网页档案。
name="top"：设定这个框窗的名称，这样才能指定框架来作连结，必须但任意命名。
scrolling="auto"：设定是否要显示卷轴，YES 表示要显示卷轴，NO 表示无论如何都不要显示，AUTO是视情况显示。
noresize：设定不让使用者可以改变这个框框的大小，亦没有设定此参数，使用者可以很随意地拉动框架，改变其大小。
4.<NOFRAMES>
当使用的浏览器太旧，不支援框架这个功能时，他看到的将会是一片空白。为了避免这种情况，可使用 <noframes> 这个标记，当使用者的浏览器看不到框架时，他就会看到 <noframes> 与 </noframes> 之间的提示内容，而不是一片空白。
<frameset rows="80,*">
<noframes>
<body>
很抱歉，您使用的浏览器不支持框架功能，请转用新的浏览器。
</body>
</noframes>
<frame name="top" src="a.html">
<frame name="bottom" src="b.html">
</frameset>
5.<IFRAME>
它的作用是在一页网页中间插入一个框窗以显示另一个链接资源。它是一个围堵标记，但围着的字句只有在浏览器不支持 iframe 标记时才会显示。
<body>
<iframe src="a.html">
如果您看到该文字，说明您的浏览器不支持IFRAME标签。
</iframe>
</body>
6.<a href="加载页面" target="要显示的框架name">链接名称</a>
第 9 节09_框架2
第 10 节10_框架3
第 11 节11_框架4
第 12 节12_表单input
<input type="text" value="" />
type标签指定输入标签的类型，共有10个值：文本框text、密码框password、单选框radio、复选框checkbox、隐藏字段hidden、提交按钮submit、重置按钮reset、按钮button、文件上传file、图像image.
第 13 节13_表单input2&form标签
第 14 节14_表单select
第 15 节15_表单textarea&label
1.<label>标签：
<label for="male">Male</label>
<input type="radio" name="sex" id="male" />
<label for="female">Female</label>
<input type="radio" name="sex" id="female" />
如果您在 label 元素内点击文本，就会触发此控件。
for的属性值指向绑定表单元素的 id 值。
第 16 节16_div+span
<div> 是块级元素，它是可用于组合其他HTML元素的容器。
<span> 元素是内联元素，可用作文本的容器。
第 17 节17_头标签
title：指定浏览器标题栏显示的内容
base：标签为页面上的所有链接规定默认地址或默认目标
href属性：规定页面中所有相对链接的基准 URL
target属性：指定打开超链接的方式
<base target="打开方式" href="基准URL"/>
meta：可提供有关页面的元信息
content属性：定义与 http-equiv 或 name 属性相关的元信息
http-equiv属性：把 content 属性关联到 HTTP 头部
name属性：把 content 属性关联到一个名称
<meta http-equiv="refresh" content="3;url=跳转url" />
link：
rel属性：目标文档与当前文档的关系
type属性：文档类型
<link rel="stylesheet" type="text/css" href="style.css"/>
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
