html5中的fieldset/legend元素和keygen元素
html5中的fieldset/legend元素和keygen元素
一、总结
一句话总结:
fieldset/legend元素和figure和figcaption很像,只不过是作用于表单,前者表示内容,后者表示标题
keygen元素用来建立一个密钥生成器
1、keygen元素使用实例?
form中放<keygen name="mykey">后,会让你选择加密方式,后台会收到加密后的表单信息
2、fieldset/legend元素使用实例?
fieldset放在form中,legend放在fieldset中做标题,呈现的效果就是有边框,标题在边框上
<fieldset>
<legend>用户注册</legend>
用户名:<input type="text" name="name"><br>
密码:<input type="password" name="password"><br>
<input type="submit" value="确定">
</fieldset>
二、html5--3.20 新增的keygen元素
学习要点
- 掌握fieldset/legend元素的用法(和figure和figcaption很像,只不过是作用于表单)
- 了解keygen元素的用法
- fieldset元素:可将表单内的相关元素分组。
- 当一组表单元素放到fieldset标签内时,浏览器会以特殊方式来显示它们,通常会有一个边框。
- 没有必需的或唯一的属性。form/disabled属性可用。
- legend元素:为 fieldset 元素定义标题
学习要点
- 了解keygen元素的用法
- keygen元素
- 是HTML5中新增的元素,用来建立一个密钥生成器
- 当提交表单时,私钥存储在本地,公钥发送到服务器。主要作用是提供一种用户验证身份的方法
- 使用时注意不同浏览器支持程度不同;目前Internet Explorer 和 Safari暂不支持
- 因为涉及到服务器的一些知识,本节课我们近对该元素了解即可,和服务器相关的知识不在本套课程范围内。
- keygen元素元素的属性:
- name/form/autofocus/disabled
- challenge属性:将 keygen 的值设置为在提交时询问。
- keytype属性:定义密钥类型,如设置为rsa(一种密码的算法),则生成 RSA 密钥。
了解内容,非本课程内容,有兴趣的同学课下课自己查阅相关资料:RSA是目前最有影响力的公钥加密算法,它能够抵抗到目前为止已知的绝大多数密码攻击,已被ISO推荐为公钥数据加密标准。
实例



<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<p style="color:#FF0000">
掌握fieldset/legend元素的用法(和figure和figcaption很像,只不过是作用于表单)
</p>
<form action="L3_01.html" method="get" >
<fieldset>
<legend>用户注册</legend>
用户名:<input type="text" name="name"><br>
密码:<input type="password" name="password">
<br><input type="submit" value="确定">
</fieldset><br> keygen元素用法:<br>
加密:<keygen name="mykey"><br>
<br><input type="submit" value="确定">
</form>
<body>
</body>
</html>
html5中的fieldset/legend元素和keygen元素的更多相关文章
- HTML5中DOM元素的querySelector/querySelectorAll的工作机制
在HTML5中,提供了强大的DOM元素选择API querySelector/querySelectorAll,允许使用JavaScript代码来完成类似CSS选择器的DOM元素选择功能.通常情况下, ...
- HTML5中a标签的锚点使用
前几天有个用户问我关于在线手册功能里的锚点问题.因为他通过代码发现,在编辑手册内容时,锚点的设置是通过id选择器来制定的,而不是带有name属性的a标签.其实这是HTML5和HTML4(XHTML)等 ...
- HTML5中改变了哪些东西?
HTML5 推出的理由 想要把目前web上存在的各种问题一并解决 Web浏览器之间的兼容性很低 文档结构不够明确 Web应用程序的功能受到了限制 HTML5重新定义了浏览器的统一标准 HTML5 与 ...
- html5,新增的元素,fieldset legend
<form action=""> <fieldset> <legend>用户注册</legend> ...
- fieldset、legend、display html元素
fieldset 定义和用法 fieldset 元素可将表单内的相关元素分组. <fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段. 当一组表单元素放到 <fi ...
- html5-fieldset和legend和keygen元素的用法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- HTML5中已经不支持元素汇总,持续更新
HTML5中已经不支持以下的元素,不建议在进行开发时再使用以下的元素. 1.acronym(建议abbr) : 定义首字母缩写 2.applet(建议object): 定义 applet 3.bas ...
- 第一章 用HTML5中的结构元素构建网站
1.当一个容器需要直接定义样式或通过脚本定义行为时,推荐使用div元素而非section元素. 2.section是需要标题的,而nav或aside没有标题也是可以的. 3.html5轮廓工具 htt ...
- html5中新增的非主体结构的元素
html5中出了新增了article.section.nav.aside.time主要结构元素外,还增加了一些表示逻辑结构或附加信息的非主体结构元素. 一.header元素 header元素是一种具有 ...
随机推荐
- python 操作excel实现替换特定内容
本文介绍使用python语言,借助openyxl库来实现操作excel(xlsx)文件,实现替换特定内容的需求. 目前实现了3个小功能: 1. 全字匹配替换(mode1):(如:全字匹配 yocich ...
- RedisCluster的rename机制失败报错,解决又是数据倾斜问题
需求说明:spring session中的用户session更新是更新key的名字,所以对于key的操作时需要用newkey 替换oldkey value值只允许存在一个,这里用到rename就很合适 ...
- Mysql学习之事务的隔离性
今天咱们说说事务,相信大家都知道事务的 ACID (Atomicity.Consistency.Isolation.Durability,即原子性.一致性.隔离性.持久性). 原子性:表示一个事务不可 ...
- Redhat下Oracle 12c单节点安装
操作系统:Redhat6.7 64位[root@Oracle12CDB ~]# more /etc/redhat-release Red Hat Enterprise Linux Server rel ...
- 从零开始配置MacBook Pro
购买macbook, 是因为它的效率性.由于我第一次使用macbook,所以按照我开发的习惯和参照了其他人的文章进行配置我的个人mac,希望我的设置对你们也有所帮助 1.基本配置 查找我的Mac 系统 ...
- ARP欺骗之ettercap图形化界面
ARP欺骗原理: 在每台主机中都有ARP缓存表,缓存表中记录了IP地址与MAC地址的对应关系,而局域网数据传输依靠的是MAC地址(网络设备之间互相通信是用MAC地址而不是IP地址) 一.ARP欺骗 工 ...
- k8s证书之etcd,api,front-proxy配置文件
这几个文件,是要结合前面的master安装脚本的. 所以有的json文件中会出现一些LOCAL_HOSTS_L,THIS_HOST之类的变量. 如果手工单独使用这些文件,要将这些变量替换为合适的IP或 ...
- Java静态代理与动态代理 理解与应用场景
角色 抽象角色:接口类 实现角色: 实现类 代理角色:代理实现的类,最终使用的对象 静态代理 1. 接口 /** * description * * @author 70KG * @date 2018 ...
- C#技巧与解析(部分)
DesignMode 以下项目在设计器界面,需判断DesignMode OnPaint(e)/Form_Paint 自定义控件中需要特殊方法进行判断,如下: public partial class ...
- Django REST framework认证权限和限制 源码分析
1.首先 我们进入这个initial()里面看下他内部是怎么实现的. 2.我们进入里面看到他实现了3个方法,一个认证,权限频率 3.我们首先看下认证组件发生了什么 权限: 啥都没返回,self.per ...