一、常用的标签

<h1>~<h6> 表示是一个标题

<p> 段落标签

<hr/> 水平线标签

<br/> 换行标签

<sub> 下标

<sup> 上标

<pre> 原样标签： 原样标签会保留空格和换行符。

<ol> <li> 有序的列表标签、

<ul> <li> 无序的列表标签。

项目列表标签(dl dt dd)

行内标签(span)

块标签<div> div标签的内容会独立占一行。

二、实体标签

空格 &nbsp;

小于号 &lt;

大于号 &gt;

-----------------------------

人民币 &yen；

版权 &copy;

商标 &reg;

三、媒体标签

<embed></embed>

hidden ： 设置隐藏插件是否隐藏。

src ：用于指定音乐的路径

<embed src="1.mp3" ></embed>

<marquee> 飘动标签direction : 指定飘动的方向

scrollamount : 指定飘动的速度。

loop :指定飘动的次数

四、超链接标签

<a> 超链接标签

a标签常用的属性：

href : 用于指定链接的资源

target: 设置打开新资源的目标。

_Blank 在独立的窗口上打开新资源

_self 在当前窗口打开新资源

file: file协议（文件协议）这种协议主要是用于搜索本地机器的资源文件的。

格式：

file:///f:/美女/1.jpg

邮件 的协议： mailTo迅雷的协议： thunder

超链接标签的作用：

1. 可以用于链接资源。

2. 锚点点位.

1. 首先编写一个锚点 锚点的格式： <a name="锚点名字"> 数据</a>

2. 使用a标签 的herf属性连接到锚点出。 href=”#锚点的名字“

五、图片标签

img标签常用的属性:

width： 设置图片宽度

height 设置图片高度

alt: 如果图片资源无法找到，那么就显示对应的文字对图片进行说明。

六、表格标签

表格使用到的标签：

<table> 表格

<tr> 行

<td> 单元格

<th> 表头 默认的样式是居中，加粗。

<caption> 表格的标题

表格常用的属性：

border 设置表格的边框

width : 设置表格的宽度

height: 设置表格的高度的。

colspan: 设置单元格占据指定的列数。

rowspan : 设置单元格占据指定的行数。

<thead> 标签用于组合 HTML 表格的表头内容。

<thead> 元素应该与<tbody>和<tfoot>元素结合起来使用，用来规定表格的各个部分（表头、主体、页脚）。

通过使用这些元素，使浏览器有能力支持独立于表格表头和表格页脚的表格主体滚动。当包含多个页面的长的表格被打印时，表格的表头和页脚可被打印在包含表格数据的每张页面上。

<thead> 标签必须被用在以下情境中：作为 <table> 元素的子元素，出现在 <caption>、<colgroup> 元素之后，<tbody>、 <tfoot> 和 <tr> 元素之前。

七、表单标签

<html xmlns="http://www.w3.org/1999/xhtml">

<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<!-- 表单标签： 表单标签的作用是用于提交数据给服务器的表单标签的根标签是<form>标签常用的属性action: 该属性是用于指定提交数据的地址。method： 指定表单的提交方式。get : 默认使用的提交方式。 提交的数据会显示在地址栏上。post ： 提交的数据不会显示在地址栏上。注意： 表单项的数据如果需要提交到服务器上面，那么表单项必须要有name的属性值 -->

</head>

<body>

<form action="http://www.baidu.com" method="post"> <!-- 文本输入框 单 行- -> 用户名：<input name="userName" type="text"/><br/>

<!-- 密码框 -->

密码：<input name="password" type="password"/><br/>

<!-- 单选框 -->

性别： 男<input checked="true" value="man" name="sex" type="radio"/>

女<input name="sex" value="woman" type="radio"/><br/>

< !-- 下拉框 -->

来自的城市：<select name="city">

<option value="BJ">北京</option>

<option value="SH">上海</option>

<option value="GZ">广州</option>

<option value="SZ">深圳</option>

</select><br/>

<!-- 复选框 同一组的复选框name的属性值要一致 -->

兴趣爱好：java <input value="java" name="hobit" checked="checked" type ="checkbox" />

javascript <input type="checkbox" value="javascript" name="hobit" />

android <input value="android" name="hobit" type="checkbox" /><br/> <!-- 文件上传框-->

大头照：<input name="image" type="file" /><br/>

个人简介:

<!-- 文本域 -->

<textarea name="intro" rows="10" cols="30"></textarea><br/>

<!-- 提交按钮 -->

<input type="submit" value="注册"/>

<!-- 重置按钮 -->

<input type="reset" value="重置"/>

</form>

</body>

</html>

HTML5常用标签总结的更多相关文章

  1. html5常用标签table表格布局

    html5常用标签table表格布局 一.总结 一句话总结: 二.html5常用标签table表格布局 用表格显示信息调理清楚,使浏览者一目了然.表格在网页中还有协助布局的作用,可以把文字.图像等组织 ...

  2. HTML5 常用标签整理

    <!--1.  html5 文本 --> <div> <header> <hgroup> <h1>h1</h1> <h2& ...

  3. HTML5常用标签

    section 板块,用于划分页面的不同区域或者划分文章里不同的节 ↓  header 页面头部或者板块section头部 ↓  footer 页面底部或者section底部 ↓  nav 导航(包含 ...

  4. HTML5常用标签分类

    1.行级元素标签:a.span.sup.sub.em.b.big.i.strong 2.块元素标签:div.p.h1~h6.ul.ol.li.table.form.article.footer.hea ...

  5. 第六课 Html5常用标签 html5学习1

    HTML标签的认识一.标签的分类1.双标签 如<html> </html>2.单标签 如<br \> 换行标签 二.标签的关系1.嵌套关系 如<head> ...

  6. HTML5常用标签及特殊字符表

    *http://html5doctor.com/nav*http://html5doctor.com/article*http://html5doctor.com/section*http://htm ...

  7. html新增一些常用标签

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. HTML5与HTML4的区别-----新增的常用标签

    做前端工程师这么长时间了, 对HTML5的一些标签的用法还不是很熟悉.这篇随笔算是对学过的知识的梳理.常言道,温故而知新  ~哈哈.里面有不正确的地方还望各位大牛们指正,评论. 在做网页时习惯把网页分 ...

  9. HTML语义化：HTML5新标签——template

    一.前言 当我们使用String-base的模板引擎(如Handlebars.js等)时,要么就通过外部文件存放模板文本,需要时再通过XHR或script标签加载进来:要么通过<script t ...

随机推荐

  1. WebApi接口请求失败，找不到资源。

    WebApi开发接口,实现同步数据库的数据给安卓. public class UserInfoController : ApiControllerBase { private UserBLL user ...

  2. 基于Selenium2+Java的UI自动化（8）- 显式等待和隐式等待

    一.隐式等待 package com.automation.waits; import java.util.concurrent.TimeUnit; import org.openqa.seleniu ...

  3. 4063: [Cerc2012]Darts

    4063: [Cerc2012]Darts Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 85  Solved: 53[Submit][Status] ...

  4. 【Javascript】搞定JS面试——跨域问题

    什么是跨域? 为什么不能跨域? 跨域的解决方案都有哪些(解决方法/适用场景/get还是post)?  一.什么是跨域?       只要协议.域名.端口有任何一个不同,就是跨域.           ...

  5. 有个程序猿要去当CEO了：（一）事情始末

    事情大概是这样的: 去年年底,我从原公司离职,原因大概是公司绩效不好,呆着也没意思. 后来听说,年终结算遣散了所有人. 今年年初的时候,前老板又找上我,说希望能和我再合作. 起先是想分我一部分干股,让 ...

  6. 【Yii系列】Yii2.0基础框架

    缘起 因为一个月的短暂停留,我在给朋友搞事情,所以Yii系列的文章耽搁了很长时间,现在又重拾当时的知识,给大伙好好撸下这一系列的博客 提起Yii,虽然是国外的开发者搞的,但是它的作者是华人,这才是让我 ...

  7. iOS开发之Quartz2D

    1.         Quartz2D概述及作用 Quartz2D的API是纯C语言的,Quartz2D的API来自于Core Graphics框架. 数据类型和函数基本都以CG作为前缀,比如: CG ...

  8. python服务器环境搭建（3）——参数配置

    前面我们已安装好了python服务器运行所需要的相关软件,而最重要最繁琐的就是参数配置,写这篇就踩了好多坑,花了好多时间,遇到了各种各样的问题.好了费话少说,直接进入本篇话题. PS:本人不是专业的运 ...

  9. 解决子元素用css float浮动后父级元素高度自适应高度

    1.在最后一个子元素后面清除浮动 2.父元素加over-flow:hidden;(副作用:子元素定位不能超出父元素的范围) 3.父元素也一样浮动(最笨的方法): 4.子元素使用inline-block ...

  10. mybatis generator 插件安装及使用

    现在Mybatis特别火,但是在开发中却要经常写实体类和配置文件,会不会特别烦人,所以可以利用Mybatis的代码生成插件来生成这部分代码: 1,打开eclipse,点击Help>Softwar ...