Html5新标记

<video>

<video src="movie.ogg" controls="controls">   
 您的浏览器不支持 video 标签。    
</video> 

<audio>

<audio src="someaudio.wav">    
您的浏览器不支持 audio 标签。    
</audio>

<canvas>

HTML5 的canvas 元素使用JavaScript在网页上绘制图像

<canvas id="myCanvas"></canvas>    
<script type="text/javascript">    
    var canvas=document.getElementById('myCanvas');    
    var ctx=canvas.getContext('2d');   
    ctx.fillStyle='#FF0000';    
    ctx.fillRect(0,0,80,100);   
 </script>

<figure>

<figure>
    <img src="img.gif" alt="figure标签"  title="figure标签" />
    <figcaption>这儿是图片的描述信息</figcaption>
</figure>

增型表单标签

<input type="number" name="demoNumber" min="1" max="100" step="1"/>

name: 标识表单提交时的key值 min: 标识当前输入框输入的最小值 max: 标识当前输入框输入的最大值 step: 标识点击增大/减小的时候,增加/减小的步长

<input type="email" name="email" placeholder="请输入注册邮箱"/>

当表单在提交前,此文本框会自动校验是否符合邮箱的正则表达式

<input type="url" placeholder="请输入网址" name="url"/>
<input type="tel" placeholder="输入电话" name="phone"/>
 <input type="range" min="0" max="100" step="5" name="range" value="0"/>
 <output name="output">0<output/>
<input type="date" name="datedemo"/>

日期属性还包括:monthtimeweekdatetime-localdatetime

颜色选择

<input type="color" name="colordemo"/>

实现自动完成或者输入提示功能

<input type="text" autocomplete="on" name="demoAutoComplete" list="autoNames" />
<datalist id="autoNames">
       <option  value="AA" ></option>
       <option  value="BB" ></option>
       <option  value="CC" ></option>
</datalist>

 

posted @   慕尘  阅读(159)  评论(0编辑  收藏  举报
(评论功能已被禁用)
编辑推荐:
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛(1)
点击右上角即可分享
微信分享提示