HTML标签的使用

最新推荐文章于 2023-07-15 21:07:45 发布

呦呦啊哟

最新推荐文章于 2023-07-15 21:07:45 发布

阅读量1.5k

点赞数

分类专栏：前端文章标签： html servlet java

本文链接：https://blog.csdn.net/yoyoayo/article/details/126712861

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

标题(h1~h6)

水平线(hr)

段落(p)

段落缩进(blockquote)

上下标(sup和sub)

换行(br)

原样输出(pre)

有序列表ol li

无序列表ul li

项目列表标签(dl dt dd)

行内标签(span)

块标签<div>

列表标签

（1）<dl><dt><dd>

<dl>：定义了定义列表

<dt>：上层项目

<dd>：下层项目封装的内容是会被缩进的，有自动缩进效果。

图像地图

当要在图像中选取某一部分作为连接的时候。如：中国地图每个省所对应的区域。

map 标签要和img标签联合使用。href是超链接。

表格标签

table

align

border

width

cellspacing 单元格的外边距列与列之间的距离

cellpadding 单元格的内边距

caption 标题标签（居中）

tr 行标签表示一行

td 一列单元格标签 (cell)

th 表头标签列数据效果：居中、加粗

align 定位

页面中的单位：

像素 px 固定像素

按百分比会根据屏幕的大小进行自动缩放

不规则表格

colspan 表示合并列

rowspan 表示合并行超链接

超链接

href属性值可以是URL，也可以是本地文件（比如图片）。

target属性是指定在哪个窗口或者帧中打开。

取消超链接效果：<a href="javascript:void(0)" οnclick="alert('我弹')">这是一个超链接</a>

四个保留的目标名称：target
  _blank - 在一个新的未命名的窗口载入文档
  _self - 在相同的框架或窗口中载入目标文档
  _parent - 把文档载入父窗口或包含了超链接引用的框架的框架集
  _top - 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架

定位标记 <a name=””>

一般在本页面中使用，当网页内容过长，定位标记会比拖动滚动条方便快捷。

注：定位标记要和超链接结合使用才有效。

例：

<a href=”#标记”>返回标记位置</a>

注：使用定位标记时一定在href值的开始加入#标记名。

框架标签<frameset>

注：框架标签不可以放到<body>，一般为了代码的可读性，会到<head>和<body>之间。

如：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Frameset</title>
</head>
<frameset cols="50%,50%">
<frame src="2018-7-10.html"/>
<frame src="2018-7-10Frame-1.html" name="framename" />
</frameset>

注意：一个窗体只能显示一个资源（一个页面或图片）；<frameset>有两个参数，cols和rows。cols：列的数目和尺寸。rows：行的数目和尺寸。要特别注意的：<frameset>中只能用一个参数。要么是 rows，要么是 cols，不能同时定义。

当框架大小不想被鼠标拖动而改变，可以在frame标签中加入noresize属性，这个属性没有属性值，称为标记属性，加上就为固定，xhtml的规范中，所有的属性都要有属性值，那么标记属性的属性值就是自身。

HTML(画中画标签)：<iframe>

定义内联的子窗口（框架）

表单标签

html表单用于收集不同

action表示动作，值为服务器的地址，把表单的数据提交到该地址上处理

method:请求方式：get 和post

get和post的区别：

1.get提交，提交的信息都显示在地址栏中。

post提交，提交的信息不显示在地址栏中。

2.get提交，对于敏感的数据信息不安全。

post提交，对于敏感信息安全。

3.get提交，对于大数据不行，因为地址栏存储空间有限。

post提交，可以提交大量的数据。（没有长度限制）

4.get提交，将信息封装到了请求消息的请求行中。

post提交，将信息封装到了请求消息的请求体中。

在服务端的一个区别：

如果出现将中文提交到tomcat服务器，服务器默认会用iso8859-1进行解码会出现乱码，

通过iso8859-1进行编码，在用指定的中文码表解码。即可。

这种方式对get提交和post提交都有效。

但是对于post提交方式提交的中文，还有另一种解决办法，就是直接使用服务端一个对象，request对象的setCharacterEncoding方法直接设置指定的中文码表就可以将中文数据解析出来。这个方法只对请求体（post方式）中的数据进行解码。

综上所述：表单提交，建议使用post。

补充:

如果是get提交，request.setCharacterEncoding(“GBK”)，该方法对乱码解决不了，必须先进行ISO8859-1编码，然后再进行GBK的解码。这种方式虽然对post提交的乱码也通用，但是麻烦，所以建议表单提交使用post。

和服务端交互的三种方式：

1，地址栏输入url地址。get

2，超链接。 get

3，表单。 get 和 post

input元素

属性值	描述	代码
text	单行文体框	< input type="text"/>
password	密码框	< input type="password"/>
radio	单选按钮	< input type="radio"/>
checkbox	复选框	< input type="checkbox"/>
date	日期框	< input type="date"/>
time	时间框	< input type="time"/>
datetime	日期和时间框	< input type="datetime"/>
email	电子邮件输入	< input type="email"/>
number	数值输入	< input type="number"/>
file	文件上传	< input type="file"/>
hidden	隐藏域	< input type="hidden"/>
range	取值范围	< input type="range"/>
color	取色按钮	< input type="color"/>
submit	表单提交按钮	< input type="submit"/>
button	普通按钮	< input type="button"/>
reset	重置按钮	< input type="reset"/>
image	图片提交按钮	< input type="image"/>

select 元素(下拉列表)

单选下拉列表：< select>< /select>

默认选中属性：selected="selected"

如：

<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>