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. number(NOIP模拟赛Round 3)

    好吧,神奇的题目.. 原题传送门 这道题目,神奇的字符单调栈.. 首先预处理出1~n个数(大家都会.) 然后塞进字符串里,输出答案(水~) 然后.. 我们需要将所有的字符存入单调栈中,然后乱搞,就可以 ...

  2. LVDS 数据通道详解 单8 单6

    1.1.1           LVDS接口分类 1.1.1.1              单路6bit LVDS 这种接口电路中,采用单路方式传输,每个基色信号采用6位数据,共18位RGB数据,因此 ...

  3. Scala学习随笔——Scala起步

    实验楼学习Scala语言的笔记,课程网址为https://www.shiyanlou.com/courses/490 一.Scala简介 Scala 是一门多范式的编程语言,类似于 Java .设计初 ...

  4. appium+python自动化26-模拟手势点击坐标(tap)【转载】

    ​# 前言:有时候定位元素的时候,你使出了十八班武艺还是定位不到,怎么办呢?(面试经常会问)那就拿出绝招:点元素所在位置的坐标 tap用法 1.tap是模拟手指点击,一般页面上元素的语法有两个参数,第 ...

  5. 二十六个月Android学习工作总结【转】

    原文:二十六个月Android学习工作总结 1.客户端的功能逻辑不难,UI界面也不难,但写UI花的时间是写功能逻辑的两倍.     2.写代码前的思考过程非常重要,即使在简单的功能,也需要在本子上把该 ...

  6. axure8.1.0.3377授权码

    被授权人:zdfans.com 授权密钥:gP5uuK2gH+iIVO3YFZwoKyxAdHpXRGNnZWN8Obntqv7++FF3pAz7dTu8B61ySxli

  7. Git从入门到速成

    什么是Git Git是Linux发明者Linus开发的一款新时代的版本控制系统,那什么是版本控制系统呢?怎么理解?网上一大堆详细的介绍,但是大多枯燥乏味,对于新手也很难理解,这里我只举几个例子. 熟悉 ...

  8. HDU 1496 Equations(哈希表)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=1496 [题目大意] 给出一个方程ax1^2+bx2^2+cx3^2+dx4^2=0,求-100到1 ...

  9. lua的深拷贝和浅拷贝

    --- Deep copies a table into a new table. -- Tables used as keys are also deep copied, as are metata ...

  10. idea点击RUN启动报错: Broken configuration due to unavailable plugin or invalid configuration dat

    今天照常打开idea,突然发现之前的启动配置出问题了,随后报了一个这个错: Run Configuration Error: Broken configuration due to unavailab ...