html复习

HTML复习（一）

一、html概念

1、Html超文本标记语言，在网页上显示文字、图片、视频、音频等。

2、Html语言是通过标签来声明的。

3、Html的标签都是闭合的，有开始有结束，如果标签内没有内容可简写成：<img src=””/>。

4、Html的标签是由属性名和属性值构成：<标签 属性名=属性值>。

5、HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。

二、html标签

1、标题标签

<h1>-<h6>,<h1>这是标题h1</h1>,h1显示字号最大，h6最小，以后做搜索引擎优化时会能用到，h1权重最大，h6权重最小。

2、段落标签

<p>,p是段落paragraph缩写，定义一个段落。

3、换行标签

<br/>,插入单个折行（换行）。

4、关于文本格式的标签

<b>定义粗体文本。

<strong>定义加重语气。

<sub>定义下标字。H²O。

<sup>定义上标字。3²=9.

<pre>定义预格式文本，标签中内容在web页面显示出来的格式和原格式一样。

<blockquote>定义长的引用。

<q>定义短的引用语。

5、超链接标签

<a href=”http://www.baidu.com”  target=”” name></a>

Href属性规定连接的目标,target属性定义被连接的文档在何处显示，_blank弹出一个新的窗口，_self替换当前窗口，_parent在父窗口基础上打开。Name属性使用命名锚（named anchors）时，我们可以创建直接跳至页面中某个节的链接，这样使用者就无需不停的滚动页面来寻找他们需要的信息。

      <a name="tips">定义锚</a>

     <a href="#tips">链接锚</a>

6、水平线

<hr/>标签在HTML页面中创建水平线

7、注释

<!--这是注释-->

注意：html所有的标签，都会有title、class、name、id、style属性

三、属性

1、class规定元素的类名；

Id规定元素的唯一样式

Style规定元素的行内样式；

Title规定元素的额外信息。

2、style属性

Style包含所有的样式属性，align定义文本的对齐方式，bgcolor定义背景颜色,color定义文本颜色，现在分别被background-color  text-align   font-family  font-size 代替。

四、表格<table>

1、表格边框：border

2、表格中的表头：<th>

3、表格中的列与行：<td><tr>

4、表格的标题：<caption></caption>

5、单元格跨行跨列：colspan,rowspan

6、单元格边距：cellpadding

7、单元格间距;cellpacing

单元格边距：cellpadding 单元格内容和边框之间的距离

单元格间距：cellspacing  单元格与单元格之间的距离

 

五、列表

1、有序列表ol

OL 标记符具有两个常用的属性：type 和 start，分别用来设置数字序列样式和数字序列起始值。start 属性的值可以是任意整数， type 属性的值如下表所示

值	含义
1	阿拉伯数字：1、2、3等，此项为默认值
A	大写字母：A、B、C等
a	小写字母：a、b、c等
I	大写罗马数字：I、II、III、IV等
i	小写罗马数字：i、ii、iii、iv等

        <OL>
　　　<LI>子列表项 1
　　　<LI>子列表项 2
　　　<LI>子列表项 3
　　</OL>

2、无序列表ul

无序列表类型通过type属性定义每项前的图案，属性值有circle（空心圆）、disc（实心圆）、square（实心正方形）。

六、表单

1、表单使用表单标签（<form>）定义

Name属性，用来找到某个表单的

Action 属性，表单提交的地址

Method属性，表弟那提交的方式，get   post

Enctype属性，如果需要上传图片，enctype属性的值，必须是 multipart/form-data

2、文本域         <input type="text" name="firstname" />

Value属性，控制默认值

Size 属性，控制表单显示多少个字符

Maxlength属性，限制表单最多输入几个字符

Readonly属性，控制表单的内容为只读的

3、单选框    <input type="radio" name="sex" value="male" /> Male

Name属性 和 id属性通常都是用来定位到某个表单的

单选框，必须分组

4、复选框         <input type="checkbox" name="car" />

5、下拉列表     <select> 和  <option> 预选值selected

下拉列表是通过 select标签实现的

每一个列表项是 option

Option有 value 属性，当表单提交过去之后能够根据value属性获得他的值

6、文本域         <textarea>

Textarea用于提交多行的文本

7、表单提交     action 属性、提交方式 和 submit提交按钮

8、隐藏域         hidden属性

在浏览器端，是看不到的，为了数据更安全，偷偷的提交过去的

9、上传文件

Type=file

必须保证表单的编码是 ectype=”multipart/form-data”

七、图像

、背景图片     background="eg_background.jpg">

2、排列图片     align属性  对齐方式：bottom   middle   top

3、调整图像尺寸     "height" 和 "width" 属性

4、替换文本       alt属性

5、制作图像链接        <a href="xxx"><img src="xxx" /></a>

6、img图像映射      通过<img/>后添加<map>和<area>设置

<map>元素表明映射的开始，他只有一个name属性

<area>元素表明每个区域，如果要把一个图片分4个区域，则用4个area。

 area元素的属性：

  hape：rectangle\poly\circle  映射区的形状

  coords：指定区域的坐标。

  href和nohref：href指定目的的链接，如果不指定href属性，则需要指定nohref，nohref="nohref"

   target：和<a>一样