<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标签不要用来做拼版,主要用来做调试。
实体
字符 | 实体名称 |
---|---|
空格 |  ; |
< | <; |
> | >; |
“ | "; |
表格
默认情况下,网页的布局是流布局(排队),不能够随意摆放位置,想要解决就得通过表格来解决。表格的作用就是用来布局的。
与表相关的标记
标记符号 | 标记名称 |
---|---|
<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格式的图片
格式转换
打开源图,文件->另存为->选格式->保存
不可以直接改后缀名