码迷,mamicode.com
首页 > 其他好文 > 详细

5月29号=》第41页-第45页

时间:2014-05-30 21:26:03      阅读:242      评论:0      收藏:0      [点我收藏+]

标签:c   style   java   tar   http   a   

2.4 HTML5头部和元信息

 

    <script>:该元素用于包含JavaScript脚本。

    <style>:该元素用于定义内部CSS样式。

    <link>:该元素用于链接外部CSS样式等资源。

    <title>:该元素用于定义文档标题。

    <base>:该元素用于指定该页面中所有链接的基准链接。

       该元素属性如下:

          href:指定所有链接的基准链接。

          target:指定超链接默认在哪个窗口打开=>(_blank、_parent、_self、_top)

      代码示范:

        <head>

        <base target="_blank" href="http://www.crazyit.org"/>

        </head>

        <a href="index.php">疯狂HTML5<a/>

        该代码表示<a>标签的实际URl为 http://www.crazyit.org/index.php,并且使用新窗口打开该链接。

 

    <meta>:该元素用于定义HTML页面的元数据。

      该元素属性如下:

         

        name:指定元信息的名称,该名称值可以随意指定。

 

        content:指定元信息的值。

 

        http-equiv:指定元信息的名称,该属性指定的名称具有特殊意义,

               他可以向浏览器传回一些有用的信息,帮助浏览器正确地处理网页内容。

          http-equiv属性所支持的值主要有如下几个:

            Expires:指定网页的过期时间。一旦网页过期,必须重新从服务器上下载。

              代码示范<meta http-equiv="Expires" content="Sat Sep 27 16:12:36 CST 2008"

            Pragma:指定禁止浏览器从本地磁盘缓存中调阅页面内容,浏览器一旦离开该网页就无法脱机访问。

              代码示范<meta http-equiv="Pragma" content="no-cache"/>

            Refresh:指定浏览器多长时间后自动刷新指定页面。

              代码示范<meta http-equiv="Refresh" content="2"/>设置2秒后自定刷新本页面

                  <meta http-equiv="Refresh" content="2;URL=http://www.crazyit.org"/>

            Set-Cookie:设置Cookie。如果 网页过期,那么客户端上的Cookie也将被删除。

              代码示范<meta http-equiv="Set-Cookie"

                   content="name"=value expires=Set Sep 27 16:12:36 CST 2008,path=/""/>

            Content-Type:设置该网页的内容类型和所用的字符集。

              代码示范<meta http-equiv="Content-Type" content="text/html" charset="GBK"/>

 

2.5 HTML5新增的拖放API

    2.5.1  启动拖动

          draggable:该属性用于设置元素是否可拖动,该属性的值可为"true"和"false"。

                给元素使用该属性值为"true"时元素可以拖动,但元素携带数据无

                法实现拖动效果因此需要为该元素的ondragstart事件指定监听器,

                在监听器中让拖动操作可以携带数据。

            代码示范:

              <div id="source" style="border:1px solid;" draggable="true">要拖动的元素</div>

              <script type=text/javascript>

                var source = document.getElementById("source");

                source.ondragstart = function(evt)

                {

                  //让拖动操作携带数据

                  evt.dataTransfer.setData("text/plain","www.fkjava.org" );

                }

              </script>

 

    2.5.2  接受“放”

          以上拖动的代码示范可以实现元素被鼠标拖动的样式,但无法达到元素真正被拖动到

          指定的位置,拖动时都会有一个“禁止”标志,这表明“目的地”并不接受被拖动的元素,

          这是因为document对象默认阻止了拖动事件,可以为document的ondragover事件

          指定监听器,在监听器中取消document对拖动事件的默认行为,达到拖动实现效果。

            代码示范:

            document.ondragover = function(evt)

            {

              //取消事件的默认行为

              return false;

            }

           

         当用户把元素拖动到指定位置释放后,某些浏览器默认会打开一个新的页面来显示拖动元素,

         某些浏览器则会默认在用户操作拖动的“目的地”显示其结果,因此可以为document的ondrop

         事件绑定监听器,实现浏览器都以操作者拖动的“目的地”的位置来显示该元素。

           代码示范:

            document.ondrop = function(evt)

            {

              //取消在新页面打开拖动元素

              return  false;

            }

 

  在用户拖放HTML元素的过程中,可能触发下列所示的事件。

 拖放操作相关的事件
事件 事件源 描述
ondragstart 被拖动的HTML元素 开始拖动操作时触发该事件
ondrag 被拖动的HTML元素 拖动过程中会不断地触发该事件
ondragend 被拖动的HTML元素 拖动结束时触发该事件
ondragenter 拖动时鼠标经过的元素 被拖动的元素进入本元素的范围内时触发该事件
ondragover 拖动时鼠标经过的元素 被拖动的元素进入本元素的范围内拖动时会不断触发该事件
ondragleave 拖动时鼠标经过的元素 被拖动的元素离开本元素时触发该事件
ondrop 拖动时鼠标经过的元素 其他元素被放到了本元素中时触发该事件

5月29号=》第41页-第45页,布布扣,bubuko.com

5月29号=》第41页-第45页

标签:c   style   java   tar   http   a   

原文地址:http://www.cnblogs.com/duzuoyan/p/3760053.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!