HTML

<meta>

• 作用：给搜索引擎搜索，或者告知浏览器使用什么编码解析页面。
• 例如：

<meta name="keywords" content="php学习，PHP自学"／>
<meta name="description" content="php学习，PHP自学"／>

插入图片

• 语法：<img src='图片的路径' width='宽度' height='高度' alt='图片的说明' title='图片的说明' />
• 网上图片格式为jpg，gif，png格式。
• alt的作用：
  1.当图片不存在时，在应该出现图片的地方除了会出现X，还会显示该图片的说明；
  2.给搜索引擎来用，目前搜索引擎确定图片还是通过alt属性
• title的作用：当鼠标移动到图片上时，现实图片的说明

热点

• 点击同一张图的不同的区域，跳转到不同的页面。DW中选中图片，在属性栏上就会出现热点的按钮，点击热点按钮（矩形rect，圆形circle，多边形poly）画出热点形状，选中热点形状做超链接。最终形成的代码如下

<img src=' ... .jpg' usemap='#Map' border='0' />
<map name='Map' id='Map'>
<area shape='rect' coords=' ........' href='' target='_blank'/>
</map>

Object标签

• 作用：一般是用来插入flash的。

pre标签

• 作用：主要用来做调试。pre元素可定义预格式化的文本。被包围在pre元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
• 提醒：pre标签不要用来做拼版，主要用来做调试。

实体

字符	实体名称
空格	&nbsp；
<	&lt；
>	&gt；
“	&quot；

表格

• 默认情况下，网页的布局是流布局（排队），不能够随意摆放位置，想要解决就得通过表格来解决。表格的作用就是用来布局的。

• 与表相关的标记

标记符号	标记名称
<table>...</table>	表标记
<tr>...</tr>	行标记
<td>...</td>	单元格标记
<th>...</th>	列标记

• 单元格中数据的对齐方式(td的属性)
  对齐分为水平对齐和垂直对齐：
  水平对齐是align=left／center／right
  垂直对齐是valign=top／middle／bottom

• 单元间隔和单元填充
  单元格间距(cellspacing)：单元格和单元格之间的距离,
  单元格填充(cellpadding)：内容距离单元格的距离,
  默认情况下，单元格间距是2像素，单元格填充是1像素

• 合并单元格
  合并单元格分为合并行和合并列，合并行就是把不同的行合并起来，合并列就是把不同的列合并起来。
  colspan：合并列
  rowspan：合并行

表单

• 用途：用来收集用户提交的数据。
• 表单域：表单的区域，用来控制表单提交时候的数据范围。
  <form></form>

表单元素

• 文本框(单行文本)

<input type='text' name='username' size='20' maxlength='10'  />

size=20表示宽度是20个字符的宽度；
maxlength=10表示 最多输入10个字符。

• 密码框

<input type='password' name='pwd' maxlength='6' />

• 单选按钮

<input type='radio' name='sex' value='男' checked='checked'/>男
<input type='radio' name='sex' value='女' />女

• 复选框(多选按钮)

<input type='checkbox' name='hobby' value='游泳' checked='checked'/>游泳
<input type='checkbox' name='hobby' value='爬山'/>爬山
<input type='checkbox' name='hobby' value='读书'/>读书

注意：
1.同一组的name要一致；
2.必须给无法输入的表单元素赋值；
3.默认选中：checked='checked'。

• 下拉菜单

<select name=''>
     <option value='大学' selected='selected'>大学</option>
     <option value='研究生'>研究生</option>
     <option value='博士'>博士</option>
</select>

• 下拉列表

<select name='' size='4' multiple='multiple'>
     <option value='财务部' >财务部</option>
     <option value='研发部'>研发部</option>
     <option value='技术部'>技术部</option>
     <option value='保安部' >保安部</option>
     <option value='后勤部'>后勤部</option>
     <option value='硬件组'>硬件组</option>
</select>

注意：
size='4'表示同时显示4个选项；
multiple='multiple'表示按住control可以多选。

• 多行文本(文本域)

<textarea name='' cols='30' rows='5'></textarea>

cols表示容纳的列数，调节的是宽；
rows表示容纳的行数，调节的是高。

• 提交按钮
  用来向服务器提交数据。

<input type='submit' name='submit'  value='提交' />

• 重置按钮
  用来清空填写的数据，将表单恢复到初始值。

<input type='reset' name='button'  value='重置' />

• 普通按钮
  提交按钮和重置按钮都是带有功能的按钮，在很多情况下，我们点击按钮的时候不是需要提交和重置，而是执行我们自己需要的功能，这时候就需要一个不带功能的按钮。

<input type='button' name='back'  value='返回' />

使用表单

表单中有2个属性

• action='数据提交的位置'
  action=' '表示提交到本页面
• method='get/post' 数据提交的方法
  get和post的区别：

	get	post
外观上	在地址栏上看到'?'	地址栏上没有'?'
提交的数据量上	少量数据，一般低于2k	大量数据，PHP默认可以提交8M的数据，还可以更改
安全性上	不安全	安全
提交原理	提交的数据之间都是独立的	将所有的数据作为一个整体，一起提交
灵活性	很灵活，只要页面跳转就可以传递数据	不灵活，必须要有表单的参与

用的最多的就是get提交

框架

• 框架属于将要被淘汰的标签
  为了实现在一个浏览器上看到多个页面，我们需要使用框架，w3c建议以后使用内嵌框架，主要应用在后台管理处。
• 插入->HTML->框架->...
• 框架集：<frameset>
• 框架：<frame>
• 如果有N个框架，则保存N+1个文件
• 在保存框架的时候注意：
  光标放在哪个框架中，就保存哪个框架中的页面，这样保存麻烦，如果要保存所有的页面，文件->保存全部(先保存框架集，再保存框架)
• 如何将已有的页面显示到框架中
  将光标定位到框架中，文件->在框架中打开
• 框架中显示其他页面用src属性
• 在指定框架中显示页面，语法：target='框架的名称'

内嵌框架

• 语法：iframe

关于图片

• 位图图像：由屏幕上的像素点来描述图像。放大失真，会出现马赛克模糊

• 矢量图形：使用线和面描述图形，所以称为矢量，放大不失真

• 分辨率：在单位长度上的像素数，通常以“像素/英寸”，网上一般72像素/英寸

• 网站默认尺寸单位为像素

• 常见的图像形式：
  1.JPG/JPEG
  2.Gif
  二者比较：
  （1）gif颜色数目少，最多256种；jpg颜色细腻丰富，支持颜色多达1600多万种，用于质量要求较高的图像，如人物照片，风景等
  （2）gif支持透明；jpg没有透明色
  （3）gif支持动画；jpg不支持
  3.png
  无损压缩，质量很好，体积小，fireworks默认格式，此格式越来越被广泛应用

• 在项目中，一般用jpg和png格式的图片

• 格式转换
  打开源图，文件->另存为->选格式->保存
  不可以直接改后缀名