国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > HTML > 正文

HTML5教程:detalis標簽使用詳細說明

2024-08-26 00:17:04
字體:
來源:轉載
供稿:網友

武林網(m.survivalescaperooms.com)文章簡介:details標簽的出現,為我們帶來了更好的用戶體驗,不必為這種收縮展開的效果再編寫JS來實現。

details標簽的出現,為我們帶來了更好的用戶體驗,不必為這種收縮展開的效果再編寫JS來實現。
注:目前僅Chrome支持此標簽。

details有一個新增加的子標簽——summary,當鼠標點擊summary標簽中的內容文字時,details標簽中的其他所有元素將會展開或收縮。

detalis標簽:

案例1:



如果details中不存在summary標簽會怎樣呢,其實當details元素內沒有summary標簽的時候,瀏覽器在解析的時候會提供一個默認的文字,比如“查看詳細”諸如此類的本地化文字,瀏覽器同樣再會提供一個諸如上下箭頭之類的圖標。比如下面的案例2就是一個不存在summary子標簽的例子。


案例2:



有的時候,我們需要detalis中的內容默認為展開狀態怎么辦?
其實HTML5也已經為我們想到了,如果有著方面的需求,我們只需要加入一個屬性即可,如案例3。


Open屬性:

將案例1的代碼修改后如下:

案例3:


由此可見,HTML5為我們的確帶來了很大方便。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 荆门市| 舟山市| 台北县| 湘潭县| 会东县| 县级市| 噶尔县| 繁昌县| 鹤峰县| 军事| 南京市| 牡丹江市| 广宁县| 抚远县| 汉川市| 舟山市| 准格尔旗| 东港市| 共和县| 开化县| 军事| 云和县| 淳安县| 河曲县| 富民县| 来安县| 辽阳市| 抚松县| 常州市| 保康县| 镇远县| 洛扎县| 深水埗区| 朔州市| 英吉沙县| 股票| 松原市| 南投市| 漳平市| 当阳市| 当阳市|