html基础
一、什么是html
HTML（HyperText Mark-up Language）即超文本标记语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、劢画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的 具体内容。
- HTML5正在成为前段最热技术
二、html语法
- html的标签要求小写
- 如果标签中有属性，则属性必须有值，且值必须被引号（单、双引号都行）引起
- 标签不能交叉嵌套
html的注释是<!-- -->，注释不能嵌套
三、head与body元素
<head>元素出现在文档的开头部分。<head>与</head>之间的内容不会在浏览器的文档窗口显示，但是其间的元素有特殊重要的意义:– 对文档做整体的控制– SEO(Search Engine Optimization)的重要内容！
<body>元素表明是HTML文档的主体部分。在<body>与</body>之间，通常都会有很多其它元素；这些元素和元素属性构成HTML文档的主体部分。bgcolor
bgcolor属性将背景设置为颜色，它的值可以是一个十六进制数、RGB值或者一种颜色名称。
<body bgcolor="#000000">
<body bgcolor="black">
• background
background属性将背景设置为图像，它的值是你所要使用图像的URL地址。图像文件的容量尽量不要超过10K。
<body background=“./images/sky.jpg” >
bgcolor和background不能同时使用！
四、常用标签
1、文字部分
|
标签名 |
描述 |
|
p |
段落 |
|
h1到h6 |
标题 |
|
br |
换行 |
|
hr |
水平线 |
|
del |
删除文字 |
|
b |
粗体字 |
|
i |
斜体字 |
|
sub |
下标 |
|
sup |
上标 |
|
pre |
如实显示 |
2、图像
<img>标签的属性
– src:图像文件地址
– width：图像宽
– height：图像高
– border:图像边框
– title：表示鼠标在图片上停留时，显示一个文
字悬浮框。
– alt：用于图片没显示时，显示一个说明文字。
3、嵌入多媒体
<embed>标记用于在页面中嵌入多媒体文件，但是用户计算机上需要事先安装相应的处理程序.(一般用于IE和基于IE内核
的浏览器。火狐需要安
装插件才行。)
• html5使用video标签和audio标签
常用嵌入式文档的格式：
mp3, mid, wma, asf, swf, flv, rm, ra, ram, avi
4、超链接
<a href=“5.htm”>5.htm</a> 超链接
• 图片作为链接。
<a href="lastpage.htm">
<img border="0" src=".\images\next.gif">
</a>
• target属性(定义从什么地方打开链接地址 )
<a href="http://www.163.com/" target="_blank">163!</a>
5、列表
有序列表 （orderlist）
<ol type=I >
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
无序列表 （unorderlist）
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
6、表格
<table>
• <tr>行
• <th>表格头
• <td>列
– colspan=“2”跨两列
– rowspan=“2”跨两行
– align=left,right,center 对齐方式
7、表单
表单用于收集和提交用户输入的数据。表单提交后，表单中的数据会被浏览器发送到服务器，
服务器通过相关的程序获取。是客户端和服务器端交互的重要手段。是我们服务器端程序设计人员需要
重点掌握的HTML标记。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>表单练习</title>
</head>
<body>
<from action="" metion="get" enctype="application/x-www-form-urlencoded">
用户名：<input type="text" name ="user" placeholder="请输入用户名"></br>
密码：<input type="password" name="pwd" ></br>
确认密码：<input type="password" name="pwd_copy"></br>
Email：<input type="email" name="uemail" ></br>
MSM:<input type="text" name="msm"></br>
天阳从哪边升起？<select>
<option>东边</option>
<option>西边</option>
</select></br>
高级选项：<input type="checkbox" name="high_option" value="显示高级用户选项">显示高级用户选项设置</br>
安全提问：<select>
<option >我的生日是什么？</option>
<option>我的家在哪</option>
</select></br>
回答：<input type="text" name="answer"></br>
性别：<input type="radio" name="gender" value="男">男 <input type="radio" name="gender" value="女">女</br>
生日：<input type="date" name="birthday"></br>
来自：<input type="text" name="home"></br>
主页：<input type="url" name="homepage"></br>
QQ：<input type="text" name="qq"></br>
ICQ:<input type="text" name="icq"></br>
yahoo:<input type="text" name="yahoo"></br>
</from>
</body>
</html
