HTML常用标签查询
JAVA开发避免不了要接触前端,所以我不得不从0开始学习前端内容！下面分享我自己总结的HTML常用标签查询代码；将下面代码复制粘贴到文本文档，然后另存为html格式;通过file:///文档保存路径的方式可以通过网页直接访问，获取HTML常用标签用法。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML速查列表，为了方便日常开发使用</title>
<style type="text/css">
h2{font-size:16px;font-family:"楷体"}
span{font-size:14px;font-family:"楷体"} </style>
</head>
<body>
<div style="background:#F0FFF0; width:1900px; height:1200px;float:left;">
<h1 style="text-align:center;">HTML常用标签查询</h1>
<div style="background:#FDF5E6; width:600px; height:1200px;float:left;" >
<div>
<h2>HTML基本文档模板</h2>
<div style="background:#F0FFF0;width:590px;">
<hr />
<span><</span>
<span>!</span>
<span>DOCTYPE </span>
<span>html</span>
<span>></span> <br /> <span><</span>
<span>html</span>
<span>></span> <br /> <span><</span>
<span>head</span>
<span>></span> <br /> <span><</span>
<span>meta charset="utf-8"</span>
<span>></span> <br /> <span><</span>
<span>title</span>
<span>></span>
<span>html模板</span>
<span><</span>
<span>/title</span>
<span>></span> <br /> <span><</span>
<span>/head</span>
<span>></span> <br />
<span><</span> <span>body</span>
<span>></span> <br />
<span>        </span> <br /> <span><</span>
<span>/body</span>
<span>></span> <br /> <span><</span>
<span>/html</span>
<span>></span> <br />
<hr />
</div>
</div> <div>
<h2>基本标签</h2>
<div style="background:#F0FFF0;width:590px;">
<hr>
<span><</span>
<span>h1</span>
<span>></span>
<span>最大的标题</span>
<span><</span>
<span>/h1</span>
<span>></span> <br /> <span><</span>
<span>h2</span>
<span>></span>
<span>..........</span>
<span><</span>
<span>/h2</span>
<span>></span> <br /> <span><</span>
<span>h3</span>
<span>></span>
<span>..........</span>
<span><</span>
<span>/h3</span>
<span>></span> <br /> <span><</span>
<span>h4</span>
<span>></span>
<span>..........</span>
<span><</span>
<span>/h4</span>
<span>></span> <br /> <span><</span>
<span>h5</span>
<span>></span>
<span>..........</span>
<span><</span>
<span>/h5</span>
<span>></span> <br /> <span><</span>
<span>h6</span>
<span>></span>
<span>最小的标题</span>
<span><</span>
<span>/h6</span>
<span>></span> <br /> <span><</span>
<span>p</span>
<span>></span>
<span>段落标签</span>
<span><</span>
<span>/p</span>
<span>></span> <br /> <span><</span>
<span>br /</span>
<span>></span>
<span>换行标签</span> <br /> <span><</span>
<span>hr /</span>
<span>></span>
<span>添加水平线标签</span>
<hr />
</div>
</div> <div>
<h2>文本编辑相关标签</h2>
<div style="background:#F0FFF0;width:590px">
<hr />
<span><</span>
<span>b</span>
<span>></span>
<span>加粗标签</span>
<span><</span>
<span>/b</span>
<span>></span> <br /> <span><</span>
<span>strong</span>
<span>></span>
<span>加粗标签2</span>
<span><</span>
<span>/strong</span>
<span>></span> <br /> <span><</span>
<span>code</span>
<span>></span>
<span>计算机代码</span>
<span><</span>
<span>/code</span>
<span>></span> <br /> <span><</span>
<span>i</span>
<span>></span>
<span>斜体标签</span>
<span><</span>
<span>/i</span>
<span>></span> <br /> <span><</span>
<span>em</span>
<span>></span>
<span>斜体标签2</span>
<span><</span>
<span>/em</span>
<span>></span> <br /> <span><</span>
<span>kbd</span>
<span>></span>
<span>键盘输入</span>
<span><</span>
<span>/kbd</span>
<span>></span> <br /> <span><</span>
<span>pre</span>
<span>></span>
<span>预格式化文本,能根据敲 空格符 显示空格或者 空行 的文本处理标签</span>
<span><</span>
<span>/pre</span>
<span>></span> <br /> <span><</span>
<span>small</span>
<span>></span>
<span>字体变小标签</span>
<span><</span>
<span>/small</span>
<span>></span> <br /> <span><</span>
<span>tt</span>
<span>></span>
<span>打字机文本</span>
<span><</span>
<span>/tt</span>
<span>></span> <br /> <span><</span>
<span>samp</span>
<span>></span>
<span>计算机代码样式</span>
<span><</span>
<span>/samp</span>
<span>></span> <br /> <span><</span>
<span>var</span>
<span>></span>
<span>计算机变量</span>
<span><</span>
<span>/var</span>
<span>></span> <br /> <span><</span>
<span>abbr /</span>
<span>></span>
<span>缩写标签</span> <br /> <span><</span>
<span>address</span>
<span>></span>
<span>超链接标签</span>
<span><</span>
<span>/adress</span>
<span>></span> <br /> <span><</span>
<span>a</span>
<span>></span>
<span>超链接标签2</span>
<span><</span>
<span>/a</span>
<span>></span> <br /> <span><</span>
<span>bdo dir="rtl"</span>
<span>></span>
<span>文字方向</span>
<span><</span>
<span>/bdo</span>
<span>></span> <br /> <span><</span>
<span>blockquote</span>
<span>></span>
<span>从一个源引用的部分;还没有用过！</span>
<span><</span>
<span>/blockquote</span>
<span>></span> <br /> <span><</span>
<span>cite</span>
<span>></span>
<span>工作的名称，没用过！</span>
<span><</span>
<span>/cite</span>
<span>></span> <br /> <span><</span>
<span>del</span>
<span>></span>
<span>删除文本的标签</span>
<span><</span>
<span>/del</span>
<span>></span> <br /> <span><</span>
<span>ins</span>
<span>></span>
<span>插入文本的标签</span>
<span><</span>
<span>/ins</span>
<span>></span> <br /> <span><</span>
<span>sub</span>
<span>></span>
<span>文本下标的标签</span>
<span><</span>
<span>/sub</span>
<span>></span> <br /> <span><</span>
<span>sup</span>
<span>></span>
<span>文本上标的标签</span>
<span><</span>
<span>/sup</span>
<span>></span> <br /> <hr />
</div>
</div> </div> <div style="background:#FDF5E6; width:700px; height:1200px;float:left;" > <div>
<h2>图片</h2>
<div style="background:#F0FFF0;width:590px;">
<hr>
<span><</span>
<span>img src="图片路径" alt="描述" height="高度" width="宽度"</span>
<span>></span>
<span>图片链接</span>
<span><</span>
<span>/img</span>
<span>></span> <br />
<hr />
</div> <div>
<h2>无序列表</h2>
<div style="background:#F0FFF0;width:590px;">
<hr>
<span><</span>
<span>ul</span>
<span>></span><br />
<span><<span>
<span>li</span>
<span>></span>
<span>列表1</span>
<span><</span>
<span>/li</span>
<span>></span> <br />
<span><<span>
<span>li</span>
<span>></span>
<span>列表2</span>
<span><</span>
<span>/li</span>
<span>></span> </br>
<span><</span>
<span>/ul</span>
<span>></span> <br />
<hr />
</div>
</div> <div>
<h2>有序列表</h2>
<div style="background:#F0FFF0;width:590px;">
<hr>
<span><</span>
<span>ol</span>
<span>></span><br />
<span><<span>
<span>li</span>
<span>></span>
<span>有序列表1</span>
<span><</span>
<span>/li</span>
<span>></span> <br />
<span><<span>
<span>li</span>
<span>></span>
<span>有序列表2</span>
<span><</span>
<span>/li</span>
<span>></span> </br>
<span><</span>
<span>/ol</span>
<span>></span> <br />
<hr />
</div>
</div> <div>
<h2>自定义列表</h2>
<div style="background:#F0FFF0;width:590px;">
<hr>
<span><</span>
<span>dl</span>
<span>></span><br />
<span><<span>
<span>dt</span>
<span>></span>
<span>自定义列表1</span>
<span><</span>
<span>/dt</span>
<span>></span> <br />
    <span><</span>
<span>dd</span>
<span>></span>
<span>自定义列表1.1</span>
<span><<span>
<span>dd</span>
<span>></span><br />     <span><</span>
<span>dd</span>
<span>></span>
<span>自定义列表1.2</span>
<span><<span>
<span>dd</span>
<span>></span><br /> <span><</span>
<span>dt</span>
<span>></span>
<span>自定义列表2</span>
<span><</span>
<span>/dt</span>
<span>></span> </br>
    <span><</span>
<span>dd</span>
<span>></span>
<span>自定义列表2.1</span>
<span><<span>
<span>dd</span>
<span>></span><br />     <span><</span>
<span>dd</span>
<span>></span>
<span>自定义列表2.2</span>
<span><<span>
<span>dd</span>
<span>></span><br /> <span><</span>
<span>/dl</span>
<span>></span> <br />
<hr />
</div>
</div> <div>
<h2>表格</h2>
<div style="background:#F0FFF0;width:590px;">
<hr />
<span><</span>
<span>table border="1"</span>
<span>></span><br /> <span><<span>
<span>tr</span>
<span>></span><br />     <span><</span>
<span>th</span>
<span>></span>
<span>表格标题1</span>
<span><<span>
<span>th</span>
<span>></span><br />     <span><</span>
<span>th</span>
<span>></span>
<span>表格标题2</span>
<span><<span>
<span>th</span>
<span>></span><br /> <span><</span>
<span>/tr</span>
<span>><span><br /> <span><<span>
<span>tr</span>
<span>></span><br />     <span><</span>
<span>td</span>
<span>></span>
<span>表格数据1</span>
<span><<span>
<span>td</span>
<span>></span><br />     <span><</span>
<span>td</span>
<span>></span>
<span>表格数据2</span>
<span><<span>
<span>td</span>
<span>></span><br /> <span><</span>
<span>/tr</span>
<span>><span><br /> <span><</span>
<span>/table</span>
<span>></span> <br />
<hr />
</div>
</div> </div> <div >
<h2>框架</h2>
<div style="background:#F0FFF0;width:590px;" >
<hr />
<span><</span>
<span>iframe src="要链接得html文件名"</span>
<span>></span>
<span>使用框架,你可以在同一个浏览器窗口中显示不止一个页面。</span>
<span><</span>
<span>/iframe</span>
<span>></span> <br />
<hr />
</div>
</div>
</div>
<div style="background:#FDF5E6; width:600px; height:1200px;float:left;"> <div>
<h2>表单</h2> <div style="background:#F0FFF0;width:590px;">
<hr />
<span><</span>
<span>form action="demo_form.php" method="post/get"></span>
<span>></span><br /> <span><</span>
<span>input type="text" name="email" size="40" maxlength="50"></span>
<span>></span><br /> <span><</span>
<span>input type="password"></span>
<span>></span><br /> <span><</span>
<span>input type="checkbox" checked="checked"</span>
<span>></span><br /> <span><</span>
<span>input type="radioo" checked="checked"</span>
<span>></span><br /> <span><</span>
<span>input type="submit" value="提交"</span>
<span>></span><br /> <span><</span>
<span>input type="reset" value="重置"</span>
<span>></span><br /> <span><</span>
<span>input type="hidden"</span>
<span>></span><br /> <span><</span>
<span>select</span>
<span>></span><br /> <span><</span>
<span>option</span>
<span>></span>
<span>苹果</span>
<span><</span>
<span>/option</span>
<span>></span><br /> <span><</span>
<span>option selected="selected"</span>
<span>></span>
<span>香蕉</span>
<span><</span>
<span>/option</span>
<span>></span><br /> <span><</span>
<span>option</span>
<span>></span>
<span>樱桃</span>
<span><</span>
<span>/option</span>
<span>></span><br /> <span><</span>
<span>/select></span>
<span>></span><br /> <span><</span>
<span>textarea name="comment" rows="60" cols="20"</span>
<span>></span>
<span><</span>
<span>/textarea</span>
<span>></span><br /> <span><</span>
<span>/form></span>
<span>></span><br />
<hr />
</div>
</div> <div>
<h2>实体</h2>
<div style="background:#F0FFF0;width:590px;">
<hr />
<span> & lt: 等同于< </span><br />
<span> & gt: 等同于> </span><br />
<span> & copy: 等同于© </span><br />
<span> & reg: 等同于®</span><br />
<span> nbsp: 等同于空格 </span><br />
<hr />
</div>
</div>
<div>
<h2>链接<h2>
<div style="background:#F0FFF0;width:590px">
<hr />
<span>普通的链接:</span>
<span><</span>
<span>a href="http://www.baidu.com/"</span>
<span>></span>
<span>链接文本,普通链接</span>
<span><</span>
<span>/a</span>
<span>></span> <br /> <span>图像的链接:</span>
<span><</span>
<span>a href="http://www.baidu.com/"</span>
<span>></span>
<span><</span>
<span>img src="图片路径" alt="图片描述" width="宽度" height="高度" (图片四要素：路径、描述、宽度、高度)</span>
<span>></span>
<span>链接文本,图像链接</span>
<span><</span>
<span>/a</span>
<span>></span> <br /> <span>邮件的链接:</span>
<span><</span>
<span>a href="mailto:webmaster@example.com"</span>
<span>></span>
<span>链接文本,邮件链接</span>
<span><</span>
<span>/a</span>
<span>></span> <br /> </div>
</div> </div>
</div> </div>
</body>
</html>
HTML常用标签查询的更多相关文章
- [刘阳Java]_MyBatis_映射文件的常用标签总结_第5讲
MyBatis中常用标签的总结,简单给出自己的总结 MyBatis映射文件中的标签使用介绍1.<select>:用于编写查询语句用的标签 id:表示当前<select>标签的唯 ...
- JSTL与EL常用标签（转）
JSTL与EL EL相关概念 JSTL一般要配合EL表达式一起使用,来实现在jsp中不出现java代码段.所以我们先来学习EL表达式 EL主要用于查找作用域中的数据,然后对它们执行简单操作:它不是编程 ...
- java struts2入门学习--OGNL语言常用符号和常用标签学习
一.OGNL常用符号(接上一篇文章): 1.#号 1)<s:property value="#request.username"/> 作用于struts2的域对象,而不 ...
- mapper.xml中的常用标签
mybatis的mapper xml文件中的常用标签 https://blog.csdn.net/qq_41426442/article/details/79663467 SQL语句标签 1.查询语句 ...
- day45——html常用标签、head内常用标签
day45 MySQL内容回顾 数据库 DBMS mysql -RDBMS 关系型 数据库分类 关系型:mysql\oracle\sqlserver\access 非关系型:redis,mongodb ...
- MyBatis - 常用标签与动态Sql
MyBatis常用标签 ● 定义sql语句:select.insert.delete.update ● 配置JAVA对象属性与查询结构及中列明对应的关系:resultMap ● 控制动态sql拼接:i ...
- HTML常用标签
HTML常用标签: HTML文档格式: 首先,HTML是一种超文本标签语言,它是制作网页的基础. 其次,HTML文档中至少包含基本的和成对的<html> </html>.< ...
- html常用标签介绍
常用标签介绍 文本 最常用的标签可能是<font>了,它用于改变字体,字号,文字颜色. 点击查看效果 <font size="6">6</font&g ...
- HTML常用标签总结
HTML 的常用标签总结 <font size="字体大小1-7" color="red或0xff00ff" face="字体类型(楷体等)&q ...
随机推荐
- 实验三 敏捷开发与XP实践-1
实验内容 XP基础 XP核心实践 相关工具 实验要求 1.没有Linux基础的同学建议先学习<Linux基础入门(新版)><Vim编辑器> 课程 2.完成实验.撰写实验报告,实 ...
- PhpStorm2016.2版本 安装与破解
1.PhpStorm2016简介以及下载地址 1.1.PhpStorm介绍 PhpStorm是一个轻量级且便捷的PHP IDE,其旨在提高用户效率,可深刻理解用户的编码,提供智能代码补全 快速导 ...
- 20155302 2016-2017-2 《Java程序设计》第4周总结
20155302 2016-2017-2 <Java程序设计>第4周学习总结 教材学习内容总结 有关类的继承的理解:类实现继承的格式:class 子类名 extends 父类名 类的继承有 ...
- 20155307《Java程序设计》实验二实验报告
一.单元测试和TDD 用程序解决问题时,要学会写以下三种代码: 伪代码 产品代码 测试代码 正确的顺序应为:伪代码(思路)→ 测试代码(产品预期功能)→ 产品代码(实现预期功能),这种开发方法叫&qu ...
- 20155319 《Java程序设计》实验一（Java开发环境的熟悉）实验报告
20155319 <Java程序设计>实验一(Java开发环境的熟悉)实验报告 一.实验内容及步骤 (一)使用JDK编译.运行简单的java程序 命令行下的程序开发 步骤一:打开mac下的 ...
- 20145209 实验一《Java开发环境的熟悉》实验报告
20145209 实验一<Java开发环境的熟悉>实验报告 实验内容 1.使用JDK编译.运行简单的Java程序. 2.使用Eclipse 编辑.编译.运行.调试Java程序. 提交 Li ...
- 微信小程序点击事件
<---------------------------------------------------index文件夹:------------------------------------ ...
- 系统分析与设计——WordCount
成果: https://gitee.com/ZMLJZ/codes/0k19q4upgmrfde265l7vx36 作业要求: 根据WordCount的需求描述,先编程实现,再编写单元测试,最后撰写博 ...
- 成都优步uber司机奖励政策(持续更新)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://didi-uber.com/archiv ...
- 【转载】Direct3D基础知识
原文:Direct3D基础知识 重新从头开始学习DX,以前太急于求成了,很多基础知识都没掌握就开始写程序了,结果出了问题很难解决. 1. D3D体系结构 D3D与GDI处与同一层次,区 ...