首先,按下h1,再按下Tab键就可以变成<h1></h1>,Ctrl+d可以复制当前行,Ctrl+Alt+Insert可以快速新建文件,Home可以跳到当前行最前面,End同理最后面。

h标签是描述字体大小,1-6从大到小,超出无效

br标签是换行,hr标签是分割线,p标签定义一个段落。

br标签  hr标签  p标签

img标签是插入一个图片,两个必需的属性:src :导入图片路径(../是返回上一级目录)和 alt:描述(没有图片导入时,提供文字说明),width是宽,height是高。

还有一个title属性,鼠标移到图片上面会有文字描述(title属性写的)

img标签

a标签是跳转链接<a href="">这里写点文字</a> href里面输入链接,有个属性target=_self或_blank,前者在当前页面跳转,后者打开一个新标签跳转。

并且不可忘记的是双标签中写上文字,不然没有跳转链接的载体,而且可以把文字改为一个img,效果为点击一个图片跳转。

在head头部那里定义<base target="_blank">的话,所有链接都会定义调转新标签。

跳转链接是一个<a href="#">点我( ⊙ o ⊙ )!1</a> #符号的话,是一个假链接(可以返回顶部),#后面加一个id的话,可以跳到那一个相同id的段落,

扩展:一个链接+#+id 可以跳转到另一个界面的某一相同id的行   除了#还有javascript: 不会发生什么跳转

a标签

列表标签分类

无序列表(最多):没有先后之分的数据  例如中国的所有城市

有序列表(最少):有先后之分,例如排行榜

定义列表(其次):给一堆数据添加语义

ul标签是无序列表,ol是有序列表,dl是定义列表,这些标签是定义语义,和li标签是组合

li标签里面书写列表内容(可多对),也可以在li标签里面添加其他标签,

li标签里面可以包含ul标签,多重列表。简化写法:ul>li*n(n填写生成的li标签) ul>li*n>h2+ul>li*m(双重列表)

ol标签与ul用法和格式差不多

dl标签里面包含dt(标题)和dd(内容),一个dt对应一个dd,dd里面可以有其他标签

li标签

table是表格标签,代表整个表格。包含tr:代表表格的每一行,tr包含td:代表每行的一个数据

例如:三行五列 table>tr*3>td*5   table里有一个边框属性 border,默认为零,改为1.

宽度和高度可以给table和td标签使用;水平对齐可以给table和tr,td标签使用;外边距和内边距只能给table使用

表格的高和宽由数据的大小决定,但可以在table设置修改,在td修改会影响当前单元的宽和高,不会影响整个表格的宽和高

想要达成细线表格(外边距为零只是线重叠在一起),在table设置bgcolor为black,tr设置bgcolor为while,table的间距cellspacing为1px!

caption标签是table标签的标题里面可以设置字体大小和属性align=“center”(居中)等

th标签自动加粗和居中和td标签有所不同

给td标签添加一个colspan属性来指定某一个单元格当成多个单元格,但要删掉一些单元格(水平方向是这个,垂直方向的属性为rowspan)

table标签

form是表单标签,里面可以写多种标签

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form>
账号:<input type="text"><br>
密码:<input type="password"> <br>
确认密码:<input type="password"><br>
性别:<input type="radio" name="1">男
<input type="radio" name="1">女
<input type="radio" name="1" checked>保密 <br>
爱好:
<input type="checkbox">篮球
<input type="checkbox">足球
<input type="checkbox">网球
<input type="checkbox" checked>足疗
</form>
</body>
</html>

input标签:type为text是明文输入框,password是暗文输入框,radio是单选框(想要不重复互斥就添加一个相同name属性),checkbox是多选框, form标签

两者后面加上checked是默认选。

type为button是定义一个普通按钮,作用配合js完成一些操作。value可以设值。type为image是自定义好看图片src后面导入图片即可,

type为reset是定义重置按钮,type为submit是定义提交按钮,说到这里,又讲回form表单。

form表单有个action属性,这个是你需要把表单中的数据提交到哪里的url路径写的地方(通过submit提交)

而哪些数据会被提交上去呢?input标签里面写的name属性就是key,值就是value(要么默认,要么在页面上输入的值)key=value的格式。

如果想要让文字和输入框绑定,将文字利用label标签包裹,输入框设置属性id和label的for一致即可

datalist标签是绑定待选项,设置一个id,标签里面写几个option标签(里面写待选项),然后input标签里面加上属性list,值为datalist的id。(基本不用)

当input标签type为email会自动校验邮箱格式,同理url同理

input标签

select标签可以下拉列表选择内容,里面的option标签添加列表内容,在option标签可以添加属性selected为默认值,数值多的时候可以用optgroup给列表分类

textarea是可以无限换行的多行输入框,默认有自己的宽度和高度,date是日期,number是数字。

form标签里面可以把所有标签用fieldset标签包裹,并且可以在legend起一个标题

video标签可播放视频,src视频的播放地址,autoplay自动播放(默认不会播放),controls可以控制播放,poster用于视频播放前的图片插入等

audio标签可播放音频,跟上方一样,src导入,autoplay。  这两者后接source再接src,autoplay,可以保证格式不会出问题

audio标签

详情和概要details标签包含summary标签,summary写概要,details写详情

字符实体:空格&nbsp;  <&lt;  >&gt;

字符实体


HTML标签归纳的更多相关文章

  1. html5 css选择器。 井号,句号的区别

    .理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:“body”),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的font-family ...

  2. html5 css选择器 井号, 句点的区别

    一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...

  3. 通过自动回复机器人学Mybatis---基础版

    第1章 案例简介 介绍要实现的案例情况,后面会通过这个案例来学习 Mybatis 第2章 实战第一部----黎明前的黑暗 在没有 Mybatis 的情况下,使用 Jsp + Servlet + Jdb ...

  4. HTML标签,简单归纳

    列表标签 有序列表: <ol><li></li></ol> 无序列表: <ul><li></li></ul&g ...

  5. HTML5新增的标签和属性归纳

    收集总结的HTML5的新特性,基本除了IE9以下都可以使用. HTML5语法 大部分延续了html的语法 不同之处:开头的 <!DOCTYPE html> <html lang=&q ...

  6. 微信小程序标签常见知识点归纳整理

    1. <image src='/images/logo.png' mode='widthFix'></image> mode 属性表示图片随着指定的宽度自动拉伸以显示原图的正确 ...

  7. HTML5新标签 w3c

    w3c标准下的HTML5新标签 ,做个归纳总结: H5标签 定义和用法 兼容性 <artical> 规定独立的自包含内容, 支持html中的全局属性, 支持html中的事件属性 IE: 支 ...

  8. css学习归纳总结(三) 转

    原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...

  9. css学习归纳总结(二) 转

    原文地址:css学习归纳总结(二) 标签与元素 <p>标签和p元素有什么区别呢?大多数时候他们表示的是同一样东西,但仍有细微的区别.<p>.<div>等指的是HTM ...

随机推荐

  1. Jsp基本语法 第二章

    今天是星期天,我学习了关于Jsp的一些基本页面元素 首先学习了一些基本页面注释 1.HTML的注释 <!-- htmI注释-->//    客户端可见 2.JSP的注释:  <%-- ...

  2. PageRank算法和谷歌搜索讲解

    PageRank算法和谷歌搜索讲解 吴裕雄 PageRank算法实际上就是Google使用它来计算每个网页价值的算法. Google每次的搜索结果都有成百上千万甚至上亿个相关的查询网页链接.如果将所有 ...

  3. spark pyspark 常用算法实现

    利用Spark-mllab进行聚类,分类,回归分析的代码实现(python) http://www.cnblogs.com/adienhsuan/p/5654481.html 稀疏向量: 关于Spar ...

  4. SAP 数据类型

    数据元素和基本类型对应关系 数据字典预置类型 ABAP类型 运行长度 说明 ACCP N(6) 6 会计计算周期 CHAR C(n) 1-255 字符 CLNT C(3) 3 集团,数据区域代码 CU ...

  5. org注释包

    1.注释包 物种 OrgDB 按蚊(Anopheles) org.Ag.eg.db 拟南芥(Arabidopsis) org.At.tair.db 牛(Brovine) org.Bt.eg.db 蠕虫 ...

  6. Java8中的[方法引用]“双冒号”——走进Java Lambda(四)

    前面的章节我们提及到过双冒号运算符,双冒号运算就是Java中的[方法引用],[方法引用]的格式是 类名::方法名 注意是方法名哦,后面没有括号“()”哒.为啥不要括号,因为这样的是式子并不代表一定会调 ...

  7. scrapy 琐碎的东西

    1.深度指定 DEPTH_LIMIT=1 2.常用命令 scrapy startproject name scrapy genspider name name.com scrapy crawl nam ...

  8. laravel 自定义常量的方法

    注意:laravel版本为5.1  第一种方法 在本地可以用 我上传到服务器发现用不了  有待解决 第二种方法  在本地可以用 上传服务器后 要把 constants.php   文件权限改为 755 ...

  9. 【C++】Mandelbrot集绘制(生成ppm文件)

    曼德勃罗特集是人类有史以来做出的最奇异,最瑰丽的几何图形.曾被称为"上帝的指纹". 这个点集均出自公式:Zn+1=(Zn)^2+C.(此处Z.C均为复数)所有使得该公式无限迭代后的 ...

  10. Kubernetes 之上的架构应用

    规划并运转一个兼顾可扩展性.可移植性和健壮性的运用是一件很有应战的事情,尤其是当体系杂乱度在不断增长时.运用或体系 本身的架构极大的影响着其运转办法.对环境的依靠性,以及与相关组件的耦合强弱.当运用在 ...