参考： http://www.w3school.com.cn/h.asp
卫老师将HTML比作人最基本具备的特质，比如人的眼睛鼻子嘴，css比作对眼睛鼻子嘴的修饰 script比作人的行为 ，
挺不错的类比。
css写在<head></head>中
一
bgcolor 网页背景色
background 网页背景图片
二：超链接
第一种是内部链接：
第二种是外部链接：
第三种是书签式链接 ：转到此页的指定位置 <a name="under">中的under与<a href = "#under">中的under相对应，必须一样
- 超链接中的name属性：以上面第二行代码为例，当把鼠标放在“腾讯”上时，会出现Tencent提示
- 超链接中的target属性
_blank 浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self 这个目标的值对所有没有指定目标的 <a> 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题 <base> 标签中的 target 属性一起使用。
_parent 这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中，那么它与目标 _self 等效。
_top 这个目标使得文档载入包含这个超链接的窗口，用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
三
1
<img src="1.jpg" width="100" height="100" alt="no image">img标签用来操作图片，src后面是图片的名字 width 和 height 分别是图片的宽度和高度 alt 代表的是如果图片加载失败 会出现的提示。
2
<img src="12.jpg" width="100" height="100" alt=" no image">例如：当12.jpg 不存在时 浏览器上这样显示：
四
<br>
<u>下划线</u>
<b>加粗</b>
<i>倾斜</i><br>
斜向上表示： CO<sub>2</sub>
<br>
斜向下表示：X<sup>2</sup>效果
五：列表
1.
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>效果
2.
<ol>
<li>宋佳</li>
<li>古力娜扎</li>
<li>余男</li>
<li>孙燕姿</li>
<li>昆凌</li>
</ol>效果
3 可以在2中的ol 标签后加属性
<ol type="A" start="2">
<li>宋佳</li>
<li>古力娜扎</li>
<li>余男</li>
<li>孙燕姿</li>
<li>昆凌</li>
</ol>type中的类型有下面几种，我选了大写的字母，从第二个开始
效果
如果start大于26后怎么办？
<ol type="A" start="26">
<li>宋佳</li>
<li>古力娜扎</li>
<li>余男</li>
<li>孙燕姿</li>
<li>昆凌</li>
</ol>效果图
六：表格
表格的标签是table，<table> 标签定义 HTML 表格。
简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。
tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。
更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。
<table borderColor="red" border="1" width="100%">
<tr>
<th></th>
<th colspan="2">信息</th>
</tr>
<tr>
<th rowspan="3">详情</th>
<th> name</th>
<th>age </th>
</tr>
<tr align="center">
<td>卢伟</td>
<td>21</td>
</tr>
<tr align="center">
<td> jaychou</td>
<td>39</td>
</tr>
</table>效果
补充：
1.
borderColor="red" border="1" width="100%" borderColor 规定边框颜色 border规定边框宽度 width表示表格宽度 里面参数为百分数，
2
<th colspan="2">信息</th><th rowspan="3">详情</th>colspan 分别表示列合并 rowspan表示列合并
3
<tr align="center">
<td>卢伟</td>
<td>21</td>
</tr><tr>想要让其标签中的内容居中 需要用align来修饰 center 表示居中
<th>标签里面的内容是默认居中的 不需要align修饰
七 、form表单
（一）
<form id="form1" name="form1" method="get" action="">
用户名：<input type="text" name="username"><br/>
密码：<input type="password" name="password"><br/>
你喜欢的男星：
周杰伦<input type="checkbox" value="lh" name="man" checked>
张译<input type="checkbox" value="zy" name="man" checked>
肖佳<input type="checkbox" value="jony j" name="man">
<br/>
你的性别
男 <input type="radio" value="m" name="sex" checked/>
女 <input type="radio" value="f" name="sex"/>
<br/>
你的出生日期
<input type="date" name="birth"/>
你喜欢的颜色<br/>
<input type="color" name="color"/>
<br/>
你的年龄是<input type="number" value="1" name="old" min="1" max="99"/>
<br/>
</form>效果
1.
<input> 元素
<input> 元素是最重要的表单元素。
<input> 元素有很多形态，根据不同的 type 属性。
2.
<input type="text"> 定义用于文本输入的单行输入字段：
<input type="checkbox"> 定义多选框
<input type="radio"> 定义单选框
<input type="date">定义日期
<input type="color">定义颜色
<input type="number">定义数字
（二）
<form id="form2" name="form1" method="post" action="1.html">
你所在的城市
<select name="city" id="city">
<optgroup label="黑龙江">
<option value="haer">哈尔滨</option>
<option value="yc">伊春</option>
<option value="dq">大庆</option>
</optgroup>
<optgroup label="广东">
<option value="sz">深圳</option>
<option value="sd">顺德</option>
<option value="hz">惠州</option>
</optgroup>
</select>
<br/>
<input type="file" name="pic"><br>
<textarea cols="10" rows="10" name="jl"></textarea><br>
<button οnclick="alert('111')">点击</button><br>
<input type="submit" value="submit"><br>
<input type="reset" value="复原"><br>
<input type="image" src="images/1.jpg"><br>
</form>效果：
补充：
1.<select> 表示下拉列表 <option> 元素定义待选择的选项。
2.<textarea> 元素定义多行输入字段 可以设置初始大小 可以用鼠标调整大小
3.<button> 元素定义按钮 onclick 定义点击按钮之后的动作
4.<input type="file"> 该元素定义文件 可以从本地添加文件
5.<input type="image">添加图片
6.<input type="">元素 复原该form中所有的初始值 例如<textarea>中的值清空，<select>中的值恢复默认 等
7.<input type="submit"> 点击submit后 上面所有的操作会被提交并转到action属性所规定的页面 例如上面出现的 下拉表 textarea file等 此时若你在form中 method选择的是get 表单数据存放在URL地址后面并转到1.html页面
- 如果method后面选择get方法
提交前的网址 ：http://localhost:63342/O5/form.html
进行一系类操作后提交的网址 ： http://localhost:63342/O5/1.html?city=dq&pic=P8_NextNodeInBinaryTree1.java&jl=sd
- 如果method后面选择post方法
提交前的网址 ; http://localhost:63342/O5/form.html
进行一系类操作后提交的网址 ： http://localhost:63342/O5/1.html
总结：记住 get post方法的不同，没有代码规定时默认为get 以及 action的作用
八 ：分页
<frameset cols="20%, *">
<frameset rows="20%,*" >
<frame src="1.html">
<frame src="2.html">
</frameset>
<frameset rows="20%,*">
<frame src="http://www.qq.com">
<frame src="http://www.sohu.com">
</frameset>
</frameset>效果
八 在1.html中加入下面代码：
<iframe src="2.html" name="main">
</iframe>
<a href="http://www.sohu.com" target="main">点击</a>效果
点击按钮之前 显示2.html
之后 跳转到搜狐
9万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
