details标签和summary标签
代码:
<details open="open">
<summary>幸福度调查结果</summary>
<p>对人们幸福度的调查</p>
<ul>
<li>很幸福 15%:
<meter value="15" max="100" min="10" low="15" high="60"></meter>
</li>
<li>幸福 25%:</li>
<li>一般 15%:
<meter value="55" max="100" min="10" low="15" high="60"></meter>
</li>
<li>不幸福 15%:
<meter value="70" max="100" min="10" low="15" high="60"></meter>
</li>
</ul>
</details>
结果
:
当details标签内无open属性时,打开浏览器,ul里面的内容是隐藏的
details标签常和summary标签一起使用,为details标签添加标题。
details标签和summary标签的更多相关文章
- HTML连载10-details标签&summary标签&marquee标签
1.详情(details)与概要(summary)标签 (1)作用:我们希望用尽可能少的空间来表达更多的信息,利用summary标签来描述概要信息,用details标签来描述详情信息 (2)格式: ...
- 自学HTML5第二节(标签篇---新增标签详解)
HTML5新增标签: <article> 标签 规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> 元素的潜在来源 ...
- Html5标签——Html5新增标签的含义和使用
HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的丰富性网络应用服务(p ...
- 【转】object标签和embed标签
我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...
- @Autowired标签与 @Resource标签 的区别
Spring不但支持自己定义的@Autowired注解,还支持由JSR-250规范定义的几个注解,如:@Resource. @PostConstruct及@PreDestroy. 1. @Autowi ...
- struts标签与jstl标签互换
近期在做struts切换spring mvc时发现代码中使用了大量的struts标签,对常用的struts标签做了总结,首先需要引入 <%@ taglib prefix="c" ...
- JSP自定义标签之简单标签入门
在sun官方文档上有下面这样一段话. 官方文档声明 public interface SimpleTag extends JspTag Interface for defining Simple Ta ...
- 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明:来源于网络]
第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...
- JSTL标签之core标签的使用
参考:http://blog.csdn.net/qq_25827845/article/details/53311722 核心标签库的导入 <%@ taglib prefix="c&q ...
随机推荐
- 制作静态库文件(.a文件)
制作静态库文件(.a文件) 1.创建静态库工程: 在Xcode中new一个新的project,选择IOS下面的Framework&Library,下面有一个Cocoa Touch Static ...
- 解决sublime联网失败,点击package control后没有反应
在中国大陆有可能出现这种情况,这是因为国内不支持https访问引起的(再次吐槽万恶的GFW ). 这时只需要"preferences -> package settings -> ...
- 5 approach to load UIView from Xib
After the past few years I found that the only manageable way for creating/maintaining view (or any ...
- Centos6.x X64 飞信安装
Centos6.x X64 飞信安装 1,安装飞信依赖包 yum -y install glibc.i686 krb5-libs.i686 libstdc++.i686 zlib.i686 --set ...
- S2SH邮件注册激活后注册成功
首先我的思路是这样的:①接收从客户端接收过来的数据(密码,用户名,邮箱) ②将密码进行MD5加密,然后将信息用"_"连接起来(用于后面分解) ③将信息交个一个工具类中实现生成邮件信 ...
- btrace 笔记
转载请注明原链接地址 http://www.cnblogs.com/dongxiao-yang/p/6134393.html btrace 是一个可以不用重启线上java业务查问题的神器,记一下自己折 ...
- js修改编辑器内容、修改iframe子页内容
$('#question-stem-uploader').on('click','',function(){ //获取编辑器内容(ke-edit-iframe: 编辑器iframe的classm名称) ...
- Anniversary Party
Time limit: 0.5 second Memory limit: 8 MB Background The president of the Ural State University is g ...
- LabSharp莱博夏普简介
莱博夏普提供实验室信息化解决方案,为实验室提供LIMS系统建设方案咨询,并为中小型LIMS系统供应商提供系统解决方案咨询.
- 深入理解C++中的explicitkeyword
深入理解C++中的explicitkeyword kezunhai@gmail.com http://blog.csdn.net/kezunhai C++中的explicitkeyword仅仅能用于修 ...