HTML 功能标签

1 图片

1.1 img 标签

<img src="图片地址" title="" alt="">

属性:

alt -- 代表图像的替代文字

src -- 代表一个图像源(就是图像的位置)

border – 代表图片边框的宽度

height -- 代表一个图像的高度

width -- 代表一个图像的宽度

1.2 常见图片格式

GIF -- 最多支持256色,支持透明,支持多帧动画显示效果.

JPEG -- 支持多种颜色,可以有很高的压缩比,使用了有损压缩,不支持透明,不支持动画效果.

PNG -- 是一种新的图片技术,可以表现品质比较高的图片,使用了无损压缩,支持透明,不支持动画.

2 超链接和锚点

2.1 超链接

<a href='要跳转的地址'>超链接文字</a>

① a 标签的属性

href -- 代表一个url链接源(就是链接到什么地方)

url 除了是网页外,还可以是其它的文件(如文本文件,pdf文件等)。 
url 还可以是指向HTML文件中的一个位置。 
url 还可以是Email地址。

target -- 用来指出哪个窗口或框架应该被此链接打开

target=_blank: 将链接内容在新的浏览窗口中打开。 
target=_self:  将链接的内容,显示在目前的窗口中。 (默认)
target=_parent:将链接的内容,当成文件的上一个画面。 
target=_top:这个参数可以解决新内容被旧框窗包围的困扰,使用这参数,会将整个画面重新显示成链接的画面内容。

② 超链接示例

网站链接:     <a href="http://www.atguigu.com">尚硅谷</a>
电子邮件链接: <a href="mailto:fuming@atguigu.com">写信给我</a>
电话             <a href="tel:10086">10086</a>
短信          <a href="sms:10086">发短息给我</a>

2.2 锚点

① 定义锚点

用 <a name=“”> 定义,例如:<a name=“here1”>第一部分</a>,
使用标签配合 id 属性定义,例如 <div id="header"></div>

③ 跳转到锚点

本页面内跳转  <a href="#锚点名">跳转</a>
跳转到指定页面指定锚点  http://www.lampuser.com/index.html#section2

3. 列表标签

标签名 标签的语义和作用 标签的属性 是单标签还是双标签
li 列表项,被嵌套在 ul 或者 ol 的里面
ul 无序列表
ol 有序列表
dl 自定义列表
dt 列表主题
dd 列表描述,对列表主题的描述

4. 表格标签

标签名 标签的语义和作用 标签的属性 是单标签还是双标签
table 表格 width: 设置表格的宽度(建议用css设置)
height: 设置表格的高度(建议用css设置)
border: 设置表格的边框(建议用css设置)
cellspacing: 设置单元格之间的间隙(建议用css设置)
cellpadding:设置单元格内边距(建议用CSS设置)
align: 对齐方式 left/top/center(建议用css设置)
caption 表格标题
thead 表格头部
tbody 表格主体
tr
td 单元格 colspan: 指定跨越的列数
rowspan:指定跨越的行数
th 表头单元格 colspan: 指定跨越的列数
rowspan:指定跨越的行数

注意:

thead、tbody、tfoot 都有属性 align、valign

tr、th、td 都有属性 width、height、align、valign

5 表单标签

标签名 标签的语义和作用 标签的属性 是单标签还是双标签
form 表单 action: 指定表单提交的地址
method: 指定表达的提交方式
target: 同超链接的 target 属性
label 关联其他的表单控件 for:指定其他要关联的表单控件的ID
input 输入框 name: 标识该输入框,后端用改标识获取数据(暂时不用)
type: 指定输入框的类型值:text / password / submit / reset / button / radio / checkbox
value: type 属性的值不同,value具有不同的意义;type值如果是button/submit/reset,value指定按钮的文字;type如果是text/password,value指定默认文字,如果type是checkbox/radio,value指定真正提交到后台的值。
checked: 为 radio 和 checkbox设置默认选项。
length: 设置输入框的最大输入长度(text 和 password)
size: 设置输入框尺寸(text 和 password)
select 下拉选择框 name: 标识该输入框,后端用改标识获取数据(暂时不用)
option 下拉选项 value:指定真正提交到后台的值。(暂时不用)
selected: 表示默认选中
optgroup 下拉选项分组 label: 为选项组规定描述
textarea 文本域 name: 标识该输入框,后端用改标识获取数据(暂时不用)
rows: 文本域行数,能决定文本域的高度
cols:文本域列数,能决定文本域的宽度
fieldset 定位围绕表单的边框
legend 为 fieldset 定义标题

注意:表单控件可以通过添加 disabled 属性,让表单控件不可用

6 框架标签

标签名 标签的语义和作用 标签的属性 是单标签还是双标签
iframe 规定一个内联框架 name 定义iframe的名称
width 定义iframe宽度
height 定义height高度
frameborder 是否显示边框,值为0不显示
src 要显示文档的url

曾经事项框架分帧的还有 <frameset><frame> 标签,但新标准都已经不推荐使用

results matching ""

    No results matching ""