1.html
1.html标签中一般分为两个部分,分别是head和body
<head></head>表示头部信息,一般包含三部分信息,title标签、css样式、js代码
<body></body>表示整个html里的内容
<html>
<head>
<title></title>
</head>
<body>
页面主要内容
</body>
</html>
2.标签
(1)标签的格式 <标签名>封装的内容</标签名>
(2)标签的属性
(1)基本属性 `bgcolor="red"`可以修改简单的样式结果
(2)事件属性 `onclick="alert('你好');" `可以直接设置响应后的代码
(3)分类
单标签和双标签
(4)语法
(1)标签不能交叉嵌套
(2)标签必须正常关闭
(3)属性必须要有值,属性值必须加引号
(4)注释也不能嵌套
3.常用的标签
font字体标签,可以用来修改文本的字体
(1)color 用来修改字体的颜色
(2)face 用来修改字体
(3)size 用来修改字体的大小
<font color="红色" face="宋体" size="4"></font>
4.特殊字符
<br>换行标签
> --- >
< --- <
空格--
标题标签h1-h6
align 属性是对齐
Left 左对齐(默认)
center 居中
right 右对齐
<h1 align="left">标题1</h1>
5.超链接
网页中所有点击后可以跳转的内容都是超链接
<a>是超链接
herf属性是设置连接的地址
target属性是设置哪一个目标进行跳转
_self 表示当前页面
_blank 表示打开新的页面来进行跳转
<a herf="http://baidu.com">百度</a>
<a herf="http://baidu.com" target="_self">百度</a>
<a herf="http://baidu.com"target="_blank">百度</a>
6.列表标签
无序列表
<ul type="none">
<li></li>
</ul>
type属性可以改变列表前的符号
有序列表
<ol>
<li></li>
</ol>
7.img标签
img标签是图片标签,用来显示图片;src属性可以设置图片的路径;width可以设置图片的宽度;height可以设置图片的高度
1.在JavaSE中,分为相对路径和绝对路径
相对路径:从工程名开始算
绝对路径:盘符:/目录/文件名
2.在web中路径分为相对路径和绝对路径
相对路径:
. 表示当前文件所在目录
.. 表示当前文件所在目录的上一级目录
文件名 表示当前文件所在目录的文件,相当于./文件名(./可以省略)
绝对路径:
<img src="../imgs/1.jpg " width="100" height="100" border="1"/ alt="图片找不到">
7.表格标签
table 是表格标签
1.普通表格
border:设置表格标签
width:设置表格宽度
height:设置表格高度
align 设置表格相对于页面的对齐方式
cellspacing:设置单元格间距
tr 是行标签
th 是表头标签
td 是单元格标签
b 是加粗标签
align 设置单元格文本对齐方式
<table border="1" width="300" height="300">
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
2.跨行跨列表格
colspan 属性设置跨列
rowspan 属性设置跨行
<table border="1" width="300" height="300">
<tr>
<td colspan="2">1</td>
<td>3</td>
</tr>
<tr>
<td rowspan="5">4</td>
<td>5</td>
</tr>
</table>
8.iframe框架标签(内嵌窗口)
iframe标签可以在html页面上打开一个小窗口,去加载一个单独的页面
iframe和a标签组合使用步骤:
1.在iframe标签中使用name属性定义一个名称
2.在a标签的target属性上设置iframe的name属性值
<iframe src="xxx.html" width="400" height="300" name="abc"></frame>
<ul>
<li> <a herf="xxx.html" target="abc">将表单1展示在iframe那个窗口中 </a></li>
</ul>
9.表单标签
表单就是html页面中,用来收集用户信息的所有元素集合,然后把这些信息发送给服务器。
基本用法:
<form></form>标签就是表单
input type=text 是文本输入框 value设置默认值显示内容
input type=password 是密码输入框(输入的时候默认隐藏) value设置默认值显示内容
input type=radio 是单选框 name属性可以对其分组 一个组的只能选一个 checked="checked"表示默认选中
input type=checkbox 是复选框
input type=reset 是重置按钮 value属性修改按钮上的文本
input type=submit 是提交按钮 value属性修改按钮上的文本
input type=button 是按钮 value属性修改按钮上的文本
input type=file 是文件上传域
<select></select>是下拉列表框
<option></option>标签是下拉列表中的选项 selected="selected"设置默认选中
<textarea></textarea>是多行文本输入框(起始标签和结束标签里的内容是默认值)
rows 属性值设置可以显示几行的高度
cols 属性设置每行可以显示几个字符宽度
把表单放在表格里面就可以实现表单格式整齐
form 是表单标签
action属性设置提交的服务器地址
method属性设置提交的方式GET(默认值)或POST
表单提交的时候,数据没有发给服务器的三种情况:
1.表单项没有name属性值
2.单选、复选(下拉列表中的option标签)都需要添加value属性,以便于发送给服务器
3.表单项不在提交的form标签中
GET请求的特点是:
1.浏览器地址栏中的地址是:action属性+?+请求参数
请求参数的格式:name=value&name=value
2.不安全
3.它有数据长度的限制
POST请求的特点:
1.浏览器中只有action的属性值
2.相对于GET请求更安全
3.理论上没有数据长度的限制
<form action="http://www.baidu.com" method="">
<h1 align="center">用户注册</h1>
用户名称:<input type="text" value="默认值"/><br/>
用户密码:<input type="password" value="abc"/><br/>
确认密码:<input type="password" value="abc"/><br/>
性别:<input type="radio" name="sex" checked="checked"/>男<input type="radio" name="sex"/>女<br/>
兴趣爱好:<input type="checkbox" checked="checked"/><br/>java<input type="checkbox"/>javascript<input type="checkbox"/>c++</br
国籍:<select>
<option>---请选择国籍---</option>
<option selected="selected">中国</option>
<option>美国</option>
</select></br>
自我评价:<textarea rows="10" cols="20">在这设置默认值</textarea></br>
重置:<input type="reset" value="重置"/></br>
提交:<input type="submit" value="提交"/></br>
按钮:<input type="button" value="按钮"/>
</form>
10.其他标签
<div></div>标签,默认独占一行
<span></span>它的长度是封装数据的长度
<p></p>段落标签 默认会在段落的上方或者下方各空出一行来(如果已有就不再空)