明輝手游網(wǎng)中心:是一個免費提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺!

html5里交互元素的使用方法

[摘要]在H5里,交互元素就是和用戶進(jìn)行互動的元素,這一部分非常的重要,并且和之前的JS控制的效果不同,H5相比于HTML增加了很多的交互元素,比如隱藏顯示注腳就是其中的一個交互效果。<!DOCTYPE html><html><head><meta charset...
在H5里,交互元素就是和用戶進(jìn)行互動的元素,這一部分非常的重要,并且和之前的JS控制的效果不同,H5相比于HTML增加了很多的交互元素,比如隱藏顯示注腳就是其中的一個交互效果。

<!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>

html5里交互元素的使用方法就這么多,相信我們介紹之后你已經(jīng)了解了不少。更多精彩請關(guān)注php中文網(wǎng)其它相關(guān)文章!

相關(guān)閱讀:

為什么要對DIV設(shè)置CSS樣式?

HTML5 <nav>標(biāo)簽怎么用

html 的<header>標(biāo)簽需要怎么使用

以上就是html5里交互元素的使用方法的詳細(xì)內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!


網(wǎng)站建設(shè)是一個廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。