代码:

<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标签的更多相关文章

  1. HTML连载10-details标签&summary标签&marquee标签

    ​1.详情(details)与概要(summary)标签 (1)作用:我们希望用尽可能少的空间来表达更多的信息,利用summary标签来描述概要信息,用details标签来描述详情信息 (2)格式: ...

  2. 自学HTML5第二节(标签篇---新增标签详解)

    HTML5新增标签: <article> 标签 规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> 元素的潜在来源 ...

  3. Html5标签——Html5新增标签的含义和使用

    HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的丰富性网络应用服务(p ...

  4. 【转】object标签和embed标签

    我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...

  5. @Autowired标签与 @Resource标签 的区别

    Spring不但支持自己定义的@Autowired注解,还支持由JSR-250规范定义的几个注解,如:@Resource. @PostConstruct及@PreDestroy. 1. @Autowi ...

  6. struts标签与jstl标签互换

    近期在做struts切换spring mvc时发现代码中使用了大量的struts标签,对常用的struts标签做了总结,首先需要引入 <%@ taglib prefix="c" ...

  7. JSP自定义标签之简单标签入门

    在sun官方文档上有下面这样一段话. 官方文档声明 public interface SimpleTag extends JspTag Interface for defining Simple Ta ...

  8. 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明:来源于网络]

    第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...

  9. JSTL标签之core标签的使用

    参考:http://blog.csdn.net/qq_25827845/article/details/53311722 核心标签库的导入 <%@ taglib prefix="c&q ...

随机推荐

  1. jQuery CSS 的操作函数

    jQuery CSS 操作函数 下面列出的这些方法设置或返回元素的 CSS 相关属性. CSS 属性 描述 css() 设置或返回匹配元素的样式属性. height() 设置或返回匹配元素的高度. o ...

  2. Idea实现WebService实例 转

    作者:http://blog.csdn.net/dreamfly88/article/details/52350370 因为工作需要,数据传输部分需要使用webservice实现,经过两天的研究,实现 ...

  3. Java中的三目运算符 详解

    对于有些选择分支结构,可以使用简单的条件运算符来代替. 如: if(a<b)    min=a;else    min=b; 可以用下面的条件运算符来处理 min=(a<b)?a:b; 其 ...

  4. 我的第一个 Rails 站点:极简优雅的笔记工具-Raysnote

    出于公司开发需求,这个暑假我開始搞Ruby on Rails.在业余时间捣鼓了一个在线笔记应用:http://raysnote.com.这是一个极简而优雅的笔记站点(至少我个人这么觉得的). 笔记支持 ...

  5. C# 保存和读取TreeView展开的状态

    附件 http://files.cnblogs.com/xe2011/ReadAndSaveTreeViewState.rar 保存和读取TreeView展开的状态  节点{ImageIndex,Is ...

  6. Android MediaPlayer Error/Info Code

    1. 常见错误 error(-38, 0) 我觉得-38表示在当前的MediaPlayer状态下,不能运行你的操作. 详细怎样做请參考:Android MediaPlayer 另外我在其它资料中.发现 ...

  7. [Node.js] Web Scraping with Pagination and Advanced Selectors

    When web scraping, you'll often want to get more than just one page of data. Xray supports paginatio ...

  8. Unity3d + NGUI 多分辨率适应

    更多型号适合的移动终端 现在我们要介绍的<链战争>游戏改编方法,这种适应方法UI这是一个基本维度,背景是一个基本的尺寸.背景比UI没有实际影响某一部分的额外部分,这样就避免了适应iPhon ...

  9. IOS Remote Notification

    1. 本地证书合成 rm *.pem echo "export cert..." openssl pkcs12 -clcerts -nokeys -out push_cert.pe ...

  10. C++ 读取XML文件(tinyXML库的应用)

    C++读取xml有很多第三方的xml解析库,最近使用tinyxml库来解析,下面直接上应用例子: Skin.xml文档内容如下: <UI> <Image name="ban ...