h5交互元素details标签

details是h5新增的交互元素,details与 summary 标签配合使用可以为 details 定义标题。默认情况下,不显示 details 标记中的内容。当用户点击标题时,会显示出 details。

details元素的常用属性如下: 
open:值为open,功能是定义details是否可见。 
subject:值为sub_id,功能是设置元素所对应项目的ID号。 
draggable:值为true或false,功能是设置是否可以拖动元素,默认值是false。

简单的details示例:

效果如下:

时间: 2024-10-13 13:47:47

h5交互元素details标签的相关文章

【HTML5】用脚本控制交互元素details元素的使用

1.源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Con

HTML5新增元素、标签总结

总是遇到h5新标签的笔试题目,就查阅了资料来总结一下: 1.form相关: (1)form属性:在HTML5中表单元素可放在表单之外,通过给该元素添加form属性来指向目标表单(form属性值设为目标表单id)即可. (2)formaction属性:HTML5给提交按钮(如button.submit.image等)增加了formaction属性,以便提交到不同的服务器地址. <input formaction="new.html" type="submit"

H5新增语义化标签

一.根据页面的结构,由div派生的标签. <header> <footer> <nav> 导航 在H4中导航栏一般用ul-li标签,H5中可以直接用<nav>标签 eg. <nav> <a href="#">导航标题1 </a> <a href="#">导航标题2 </a> </div> <hgroup> 页面上得一个标题组合(一个标题

【HTML5】summary交互元素

1.源码 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"/> <title>交互元素summary的使用</title> <style type="text/css"> body{ padding:5px; font-size:14px; } summary{ font-weight:bold; } </style>

Native与H5交互的一些解决方法

一. 原生代码中直接加载页面 1.    具体案例 加载本地/网络HTML5作为功能介绍页 2.    代码示例 //本地 -(void)loadLocalPage:(UIWebView*)webView { NSString* htmlPath = [[NSBundle mainBundle]pathForResource:@"demo" ofType:@"html"]; NSString* appHtml =[NSString stringWithContent

HTML5 &lt;details&gt; 标签

HTML5 中新增的<details>标签允许用户创建一个可展开折叠的元件,让一段文字或标题包含一些隐藏的信息. 用法 一般情况下,details用来对显示在页面的内容做进一步骤解释.其展现出来的效果和jQuery手风琴插件差不多. 其大致写法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <details> <summary>Google Nexus 6</summary> <p>商品详情:</p> <

03.Web大前端时代之:HTML5+CSS3入门系列~H5功能元素

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(section)的标题进行组合 2.figure <figure> 标签规定独立的流内容(图像.图表.照片.代码等等). figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响. Figcaption figure的标题 一般格式: <figure> <figcap

iOS与H5交互

前提:在oc控制器中加载UIWebView,设置代理,遵守UIWebViewDelegate协议. 一.iOS调用JS方法 通过iOS调用JS代码实现起来比较方便直接调用UIWebView的方法- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; 1.查询标签 // 查询标签      NSString *str = @"var word = document.getElementByI

AndroidManifest.XML文件功能、元素、标签汇总

原文地址:http://developer.android.com/guide/topics/manifest/manifest-intro.html 每一个 Android 应用都有一个 AndroidManifest.xml 文件,用于告知 Android 系统应用程序运行需要的各种资源.作为Android开发的初学者,很多时候都是不经意间跟着教程使用Manifest文件,配置程序的各种功能.但是,对于Manifest文件本身的各个属性缺乏系统的了解.本文参照官方的API文档,将系统介绍An