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 ext.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