慕课网HTML5学习笔记 (下)

3新增属性和废除属性

1.新增属性

（1） 表单属性

（2） 链接属性

（3） 其他属性

（1）<htmlmanifest="cache.manifest">——规定这个页面需要用到定义离线营运文件

（2）<metacharset="utf-8">——字符集

（3）<metahttp-equiv="pragma" conset="no-cache">——

（4）<link rel="icon"href="demo_icon.gif" type="image/gif"sizes="16*16">——定义icon

（5）<baseherf="http://localhost/" target="_blank">——该页面内所有链接在新网页中打开，网址显示为http://localhost/+相对路径

（6）<script defersrc="http://code.jquery.com/jquery-1.10.1.min.js"οnlοad="alert('a')"></script>——全部加载完页面才执行

<script asyncsrc="http://code.jquery.com/jquery-migrate-1.2.1.min.js"οnlοad="alert('b')"></script>——一加载完马上执行，执行同时不停止加载其他内容

（7）优化

<a media="handheld" herf="#">手持</a>

           <a media="tv"herf="#">电视</a>

        <ahref="http://www.mukewang.com/" herflang="zh"ref="external">慕课网</a>

（8）起始值50，倒序

<ol start="50" reversed>

              <li>coffee</li>

              <li>tea</li>

              <li>milk</li>

        </ol>

（9）<div>

               <style type="text/css" scoped>

              h1{color:red;}

              p{color:blue;}

              </style>

              <h1>this is ahead</h1>

              <p>this is apragragh</p>

        </div>

（10）<iframe seamlesssrcdoc="<h1>hello</h1>" sandboxsrc="http://www.baidu.com"></iframe>——1seamless无边框无边距,2srcdoc出现会覆盖src,3sandbox内嵌框架安全级别，禁止在页面中提交表单，禁止在内嵌页面中运行javascript，内嵌页面与外部页面不是相同元

2.删除的属性

（1）可以用css代替的属性

（2）多余属性

（3）其他属性

3全局属性

（1） data-yourvalue

（2） hidden

（3） Spellcheck

（4） Tabindex ——Tab键跳转顺序

（5） Contenteditable ——改变网页局部内容

（6） desginMode ——改变网页全部内容

<script>

    window.document.designMode='on';

</script>

<form data-type="comment"class="container">

              <h3>留言板</h3>

              <labelhidden>看见了吗？</label>

              <p><label>

                  <span>姓名</span>

                  <inputtabindex="1">

              </label></p>

              <p><label>

                  <span>邮件</span>

                  <inputtabindex="3"/>

              </label></p>

              <p><label>

                  <span>留言</span>

                  <textareaspellcheck="ture" cols="60"rows="50"></textarea>

              </label></p>

              <tablecontenteditable="ture">

                  <tr>

                     <td>数据一</td>

                     <td>数据二</td>

                  </tr>

              </table>

              <pcontenteditable="ture">请您留言</p>

           </form>