您现在的位置是:网站首页> 编程资料编程资料

浅谈html5增强的页面元素详解HTML5中CSS外观属性总结html5自定义属性有哪些html5实现滑块功能之type="range"属性Html5之自定义属性(data-,dataset)浅析HTML5页面元素及属性

2021-08-31 969人已围观

简介 下面小编就为大家带来一篇浅谈html5增强的页面元素。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

浅谈html5增强的页面元素

XML/HTML Code复制内容到剪贴板
  1. >  
  2. <html>  
  3.     <head>  
  4.         <meta charset="UTF-8">  
  5.         <title>浅谈html5增强的页面元素title>  
  6.     head>  
  7.     <body>  
  8.           
  9.         <figure>  
  10.             <img src="img/QQ截图20160103144626.png"  alt="图片"/>  
  11.             <img src="img/webp.jpg" alt="图片" width="211" height="191"/>  
  12.             <figcaption>我的图片组合figcaption>  
  13.         figure><br />  
  14.           
  15.         <details id="details" ontoggle="detailfn(this)" style=" cursor: pointer;" >  
  16.             <summary>精武风云summary>  
  17.             <p id="p" style="visibility: hidden;">陈真(甄子丹 饰)当年为报杀师之仇,独闯虹口道场。。。p>  
  18.         details><br />  
  19.           
  20.         <mark>html5mark>的高亮显示<br />  
  21.           
  22.         <section>  
  23.             <h2>progress元素的使用实例h2>  
  24.             <p>完成的百分比<progress id="p" max="100"><span>0span>%progress> p>  
  25.         section><br />  
  26.           
  27.         <p>磁盘使用量:<meter value="40" min="0" max="160">40/160meter>GBp><br />  
  28.           
  29.         <input type="button" value="打开对话框"  onclick="document.getElementById('dg').show();"/>  
  30.         <input type="button" value="打开对话框showModal" onclick="document.getElementById('dg').showModal();" />  
  31.         <dialog id="dg" style="width:15%;text-align: center;">  
  32.               <form>  
  33.                  <label for="txtName" value="用户名:">label>  
  34.                  <input type="text"  id="txtName"/><br />  
  35.                  <label for="pwd" value="密码:">label>  
  36.                  <input type="text"  id="pwd"/><br />  
  37.                  <input type="button" value="登录" />  
  38.                  <input type="button" value="关闭" onclick="document.getElementById('dg').close();" />  
  39.               form>  
  40.         dialog><br /><hr />  
  41.           
  42.         <a href="img/QQ截图20160103144626.png" download="文件名"><img src="img/QQ截图20160103144626.png" /> a><br />  

相关内容

-六神源码网