In H5, interactive elements are elements that interact with users. This part is very important, and unlike the previous JS control effect, H5 adds a lot of interactive elements compared to HTML, such as hiding and displaying footnotes. One of the interactive effects.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>交互元素<details>的使用</title>
<style type="text/css">
body{
font-size: 12px;
}
span{
font-weight: bold;
}
details{
overflow: hidden;
height: 0;
padding-left: 200px;
position: relative;
display: block;
}
details[open]{
height: auto;
}
</style>
</head>
<body>
<span>隐藏脚注</span>
<details open="open">
本页面生成于 2016-010-21
</details>
<!--<span>显示注脚</span>
本页面生成于 2016-010-21
<details open="open">
</details>
-->
</body>
</html>There are so many ways to use interactive elements in html5. I believe you have learned a lot after our introduction. For more exciting content, please pay attention to other related articles on the php Chinese website!
Related reading:
Why do we need to set CSS styles for DIV?
The above is the detailed content of How to use interactive elements in html5. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
