• 总结HTML5


    都说项目页面是HTML5写的,但是HTML5的特别之处用了多少?

    1、是不是页面布局都是统一的div,然后class写样式?可是HTML5提供了好多新标签 ,css中直接用标签名即可定义样式,不用费力想class名了!

    其中大多数元素也和div 一样{display:block;},只有figure不同,它自带margin ,表示一段独立的流内容,在文档主体内容中的一个独立的单元。

    <!--标签 header nav article aside footer section figure main mark details-->
    <header style="background-color: aqua; height:20px"></header>
    
    <nav style="background-color: red;height:20px"></nav>
    
    <article style="background-color: yellow;height:20px"></article>
    
    <aside style="background-color: blue;height:20px"></aside>
    
    
    
    <section style="background-color: royalblue;height:20px">
    
    </section>
    
    <figure style="background-color: blueviolet;height:200px">
        <figcaption>PRC</figcaption>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid assumenda cupiditate, dicta distinctio facilis fuga fugiat inventore magnam maiores maxime minima nam necessitatibus praesentium quisquam rem, repellat saepe sed voluptatum?</p>
    </figure>
    
    <main>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium blanditiis dolor dolorum minima nemo non perspiciatis porro sit. At deserunt eius enim modi natus nemo nesciunt numquam reprehenderit totam, voluptatibus!</main>
    
    <mark>hello,world!</mark>
    
    <details>
        <summary>Html5</summary>
        13213
    </details>

    2、form 中的元素可以不在form中,只需要加form="" ,required formtarget formaction 你知道多少?

    <form action="" id="textForm">
        <label for="txt_name">用户名:</label>
        <input type="text"  id="txt_name" autofocus required/>
        <input type="submit" formaction="a.html" formtarget="_blank"/>
    </form>
    <textarea name="" id="" cols="30" rows="10" form="textForm"></textarea>

    3、下拉菜单快速搜索

    <input type="text" list="grouplist"/>
    <datalist id="grouplist">
        <option value="group1">group1</option>
        <option value="name">name</option>
        <option value="haidian">haidian</option>
    </datalist>

     4、details 与summary

    <details>
        <summary>Html5</summary>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut itaque pariatur quae quisquam ut. Asperiores autem consequatur consequuntur 
    exercitationem expedita id, laboriosam nisi officiis omnis, perferendis repellendus sunt tempora vitae!
    </details>

    5、cite 表示作品:如一本书、一篇文章、一首歌曲...

    6、script 新增了defer 和async  属性,他们都可以加快页面的加载速度,使脚本加载不妨碍页面其他元素加载。

    defer :脚本下载完后,继续执行;

    async :异步执行;

  • 相关阅读:
    异步编程案例分享—后台线程事实通知任务进度
    ORACLE 常见错误
    设计模式——工厂模式
    sql 脚本编写之路 常用语句(一)
    C# 深入浅出 异步(八)
    设计模式——单例模式
    Sql Server 学习链接
    SqlServer 常用函数
    2016 ACM/ICPC Asia Regional Shenyang Online
    2016 ACM/ICPC Asia Regional Dalian Online
  • 原文地址:https://www.cnblogs.com/caolidan/p/6973149.html
Copyright © 2020-2023  润新知