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>
</head>
<body>
<details open="open">
<summary>页面说明</summary>
本页面生成于2017年9月21日,是一个用于测试summary交互元素的页面
</summary>
</body>
</html>

2.页面效果

3.代码解析

在页面样式中,为了突出显示<summary>元素,增加了一个粗体的字体效果,如上面的粗体代码所示。

【HTML5】summary交互元素的更多相关文章

  1. 【HTML5】交互元素menu&command元素

    1.交互元素<menu> 1.1源码 <!DOCTYPE html> <html> <head> <meta charset="utf- ...

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

    1.源码 <!. Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quo ...

  3. HTML(二)HTML元素(整体结构,块级元素,内联元素,结构元素,交互元素,元素嵌套规则)

    HTML整体结构解释 <!DOCTYPE html> // 文件应以"<!DOCTYPE ......>"首行顶格开始,推荐使用"<!DOC ...

  4. h5交互元素details标签

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

  5. HTML5 - 新增的元素,删除的元素

    1,HTML5新增的元素(1)用于构建页面的语义元素:<article>,<aside>,<figcaption>,<figure>,<foote ...

  6. html5的source元素

    html5的source元素 一.总结 一句话总结: 主要是解决视频播放时候的浏览器的兼容问题 二.html5的source元素 学习要点 掌握source元素的用法 source元素-解决浏览器额兼 ...

  7. HTML5 新模块元素兼容问题

    新增块元素默认样式 下列HTML5新模块元素在IE8.9版本浏览器中没有被定义默认样式.为解决该问题,给下列元素添加“block”显示属性. 代码: article, aside, details, ...

  8. HTML5中dialog元素尝鲜

    对话框(别称模态框,浮层)是web项目中用于用户交互的重要部分,我们最常见的就是js中 alert(),confirm(),但是这个对话框的不美观,也不能自定义样式,所以在开发的过程中,一般根据自己自 ...

  9. HTML5 画布canvas元素

    HTML5的canvas元素以及随其而来的编程接口Canvas API应用前景极为广泛.简单地说,canvas元素能够在网页中创建一块矩形区域,这块矩形区域可以成为画布,这其中可以绘制各种图形.可别小 ...

随机推荐

  1. Balanced Lineup(RMQ)

    原题传送门 就是裸RMQ啊.. 求区间最大值和区间最小值,一看就像RMQ,当然线段树貌似也可以. 至于算法嘛.自己学~(好吧,放个传送门...) 然后就是最后把maxsum-minsum就好啦233~ ...

  2. 转 Linux内存管理原理

    Linux内存管理原理 在用户态,内核态逻辑地址专指下文说的线性偏移前的地址Linux内核虚拟3.伙伴算法和slab分配器 16个页面RAM因为最大连续内存大小为16个页面 页面最多16个页面,所以1 ...

  3. glGenTextures

    http://blog.sina.com.cn/s/blog_67ede2d80100w3i8.html glGenTextures(GLsizei n, GLuint *textures)函数说明 ...

  4. shell编程学习笔记【原创】

    本文为本人学习笔记,如有转载请注明出处,谢谢 一.Bourne Shell 有如下四种变量: 用户自定义变量 位置变量,即命令行参数 预定义变量 环境变量 二.位置变量 $ 与键入的命令行一样,包含脚 ...

  5. git使用过程中遇到的错误

    1.使用git add "login.py" 然后git commit -m "add url"的时候报错.分支newtype也是存在的 nothing to ...

  6. aliyun

    阿里云启动不了网站 1  将网站的目录属性-安全中加入IUSER_计算机名字的访问权限     和  加入NER SERVICE的访问权限 2 IIS打开网站属性--目录--执行权限改为顺脚本 3  ...

  7. 腾讯微信支付,程序员是如何让jQuery代码付钱的

    微信支付和支付宝支付已经是我们生活中不可确实的两个金融软件了,也是必备的,小编认为小钱用微信,大钱用支付宝. 下面这个图是我们生活中用腾讯微信支付平台的最后一个页面,大家想不想知道这个页面是如果做出来 ...

  8. UVA 562 Dividing coins【01背包 / 有一堆各种面值的硬币,将所有硬币分成两堆,使得两堆的总值之差尽可能小】

    It's commonly known that the Dutch have invented copper-wire. Two Dutch men were fighting over a nic ...

  9. Linux基本命令参数

    简单复习一下基本命令的参数 1.mkdir 两个参数: -p 递归创建该目录 mkdir -p /user/hadoop/test/raid -m 指定权限   mkdir -m 777 /raid ...

  10. 【强连通分量】tarjan算法及kosaraju算法+例题

    阅读前请确保自己知道强连通分量是什么,本文不做赘述. Tarjan算法 一.算法简介 Tarjan算法是一种由Robert Tarjan提出的求有向图强连通分量的时间复杂度为O(n)的算法. 首先我们 ...