HTML学习笔记
来源：互联网 发布：微博刷粉软件ios 编辑：程序博客网 时间：2024/06/09 23:50
html:是一种超文本标记语言，它是由标签组成的。html中的数据都封装在标签中，通过对标签中的属性值的改变来实现对封装内数据进行操作。
html规范格式：
首先要确定html的代码范围:<html></html>。在该范围中可以定义两个部分，一个是头一个是体。
<html>
<head> 这中间写网页的一些属性信息 </head>
<body> 这中间写网页显示的数据 </body>
</html>
标签对数据进行封装那么就有开始标签和结束标签，也有一些标签只实现单一功能，所以不需要结束标签。
标签格式：<标签名 属性名="属性值">数据</标签名>
或<标签名 属性名="属性值" />
常见标签：
1.字体：<forn>。 <fort size="7" color="#ffff000">数据</fort>
标题：<h1><h2><h3><h4>...<h6>
2.列表标签：<dl></dl>
上层项目<dt>
下层项目<dd>
项目符号标签：<ul><ol>。这两个标签都有<li>进行封装
3.图像标签：<img>
<img src="" alt="图像说明文字" />
4.表格标签：<table>
` 用于对数据格式化的，表格由行组成，行有单元格组成。
表格中默认都有一个tbody标签。
标题标签：<caption>
<table>
<tr>
<td></td>
<th></th>
</tr>
</table>
5.超链接：<a>
<a href="链接地址"> </a>
定位标签：<a name="top">回到顶点 </a>
6.表单标签：
该标签是可以和服务端进行交互的。
<form>
表单标签中的属性：
<input>：因为type属性值不同，所对应的组件也不一样。
type属性：（1）text:文本框，输入的文本可见。
（2）password:密码框，输入不可见。
（3）radio:单选框
（4）checkbox:复选框
（5）file:进行文件选择的组件，常用于附件，或上传文件。
（6）hidden:隐藏组件，
（7）button：按钮组件，自定义按钮，无效果
（8）reset：重置按钮
（9）submit：提交按钮
（10）image：图像组件，链接一个好看的提交图案。
下拉菜单：<select>
都由option进行封装
<select>
<option></option>
</select>
文本区域：<textarea>
form标签中的常见属性：
action:制定数据提交的目的地。method：提交方式。get和post。get为默认。
get：会将数据显示在地址栏中，
数据体积受地址栏的限制，
对敏感信息不安全。
它会将信息封装在请求行，http消息之前。
post：不会显示在地址栏，
可以提交大体积数据，
对敏感信息安全。
它会将信息封装在数据体中，http消息头之后的空行后。
对服务端而言，表单提交尽量用post，因为涉及编码问题。
使用表单的组件不一定要定义form标签。只有将数据提交服务端的时候才会用到。
下面是一个注册页面事例：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>注册表格</title>
</head>
<body>
<a href="http://192.168.1.100:10000?user=dfs&psw=123&sex=nv">提交数据</a>
<fieldset>
<legend>注册区域</legend>
<form action="hppt://192.168.1.100:10000" method="post">
<table border="1" bordercolordark="#3366FF" width="60%" cellpadding="10" cellspacing="0">
<tr>
<th colspan="2">
账号注册
</th>
</tr>
<tr>
<td ><label accesskey="u" for="userid"> 用户名(u)：</td>
</label>
<td> <input type="text" name="user" id="userid"/></td><dr/> </tr>
<tr>
<td > 密码:</td>
<td> <input type="password" name="paw"/></td><dr/>
</tr>
<tr>
<td > 性别：</td>
<td> <input type="radio" name="sex" value="男" /> 男
<input type="radio" name="sex" value="女" /> 女
</td><dr/>
</tr>
<tr>
<td > 国籍：</td>
<td>
<select name="country">
<option value="none">选择国家</option>
<option value="cn">中国</option>
<option value="usa">美国</option>
<option value="jp">日本</option>
</select>
</td><dr/>
</tr>
<tr>
<td >技术：</td>
<td> <input type="checkbox" name="tech" value="java"/>java
<input type="checkbox"name="tech" value="html"/>html
<input type="checkbox"name="tech" value="Android"/>Android
</td><dr/>
</tr>
<tr>
<th colspan="2">
<input type="submit" value="提交数据"/>
<input type="reset" value="重置数据"/>
</th><dr/>
</tr>
</table>
</form>
</fieldset>
</body>
</html>
- 【HTML】HTML学习笔记
- 【学习笔记】 html学习
- HTML学习笔记
- HTML基础学习笔记
- HTML 学习笔记
- html学习笔记1
- html学习笔记2
- HTML学习笔记(1)
- HTML 学习笔记(2)
- HTML学习笔记(3)
- HTML学习笔记(4)
- HTML学习笔记
- html学习笔记
- 学习HTML的笔记
- HTML学习笔记一
- HTML学习笔记二
- HTML学习笔记三
- HTML学习笔记四
- POJ2524 Ubiquitous Religions
- hashmap和hashtable的区别
- oracle数据库 sql%found,sql%notfound,sql%rowcount
- 我是个爱改Bug的程序员
- hdu1232 畅通工程
- HTML学习笔记
- unp.h的使用
- 使用测试
- 交换机上的指示灯狂闪
- 开源 免费 java CMS - FreeCMS1.7 站点设置
- C#模拟post请求
- 2014-3-18 对filter下有两个节点的优化
- 安桌文件上传和数据上传到服务器
- IC卡和ID卡区别
