• Html5新增标签的学习。


    随笔,记录的比较随便。

    今天新学习了9个标签、

    <audio> 简单的说就是一个音频标签,他的主要常用属性有src=""音频的路径 controls="controls" 控制参数,他就是可以让其在页面显示一个播放器的效果autoplay="autoplay"自动播放属性 loop="loop"循环次数

    <video>同audio标签一样。是一个视频标签。主要常用的属性同上面一样

    <datalist>定义选项列表。这个其实是一个比较大的改进,不过也有不足,这个标签其实组合了《input标签中的text》和select标签、生产的一个可以输入和下拉选项的输入组合框》。不足之处在于如果不通过JS控制,只有当输入框中为空,定义的下拉选项中才会生效

    <details>定义文档细节。这个标签其实用的地方也比较多,常和summary标签用。summary标签里面写文档的标题。p标签写文档的细节

    <mark>一个高亮的显示标签,再也不用标记某一段文字要用font属性了。

    <menu>快速创建一个list列表。用法是menu li结合

    <address>存放地址的标签

    <progress>这个是一个进度条标签。他的主要属性有value和max。value表示当前进度条位置,max表示进度条的总共长度。

    <time>标签放时间的标签。

    初步接触html5的标签。给人的第一感觉就是望文知义。这个标签能够很容易让人记住。

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html >
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Html5学习之路</title>
    </head>
    <body>
    <header style="text-align: center; color: blue;">欢迎来到Html5的学习之路,我是header标签。</header>
    这是一个定义选项列表的标签datalist 这个的作用就是将text文本框与select标签结合起来
    
    <input type="text" list="phone">
    <datalist id="phone">
    	<option></option>
    	<option>IPhone</option>
    	<option>华为	</option>
    	<option>小米	</option>
    	<option>三星</option>
    </datalist>
    <br/>
    <br/>
    <font color="red">这里我发现了两者一个不同之处在于,datalist只有在输入框为空的时候才会有自己定义下拉的内容!</font>
    <br/>
    而这个select选项框是不管什么内容它都会存在的
    <select>
    	<option>IPhone</option>
    	<option>华为	</option>
    	<option>小米	</option>
    	<option>三星</option>
    </select>
    <br>
    <br>
    <br>
    
    ------------------------
    <br><br><br>
    这是一个定义文档细节的标签。detail标签。它的主要作用很简单。
    <details>
    	<summary>这是一个detail标签,下面就是他的使用方法</summary>
    		<p>detail标签是什么?</p>
    		<p>detail标签有什么作用?</p>
    		<p>detail标签能干什么?</p>
    		<p>detail标签我改怎么用它?</p>
    </details>
    <br>
    detail标签常与sunmmary标签用在一起。比如这个标签是高亮标签<mark>mark</mark>比重不一样。
    <br><br>
    接下来这个标签是定义列表标签。menu。
    <menu>
    	<li>西游记</li><li>水浒传</li><li>红楼梦</li><li>三国演义</li>
    </menu>
    <br><br>
    进度条标签我们用的比较多。比如这个。<mark>progress</mark>
    <progress value="5" max="10">value=5 max=10</progress>
    <br>
    <audio src="" controls="controls" autoplay="autoplay" loop="loop"></audio>
    <footer>我是底部footer标签</footer>
    </body>
    </html>
    

      

  • 相关阅读:
    旧贴-在 win7 / win8 下安装苹果系统 (懒人版)
    解决ios13摇一摇不能触发
    html+css面试合集
    Windows 2012 Server R2 添加用户
    Windows10专业版身份验证错误,可能由于CredSSP加密数据库修正
    STM32F4 7.STM32F4 独立看门狗
    STM32F4 6.STM32F4 外部中断
    STM32F4 5.STM32F4串口通讯
    STM32F4 4.STM32F4时钟系统
    STM32F4 3.GPIO按键输入,实现开关灯
  • 原文地址:https://www.cnblogs.com/SnowBaby/p/6701617.html
Copyright © 2020-2023  润新知