zoukankan      html  css  js  c++  java
  • 杂项标签

    HTML的注释  <!--  --> (浏览器不会显示)

    CSS的注释  /*  */

    JS的注释  /*  */(注释代码块)  //(注释单行)

     

    HTML5新增标签:

      <header>...</header>

        定义文档或文档中某部分的页眉,该元素可作为介绍内容或导航链接栏的容器,同个文档中可定义多个<header>元素

        <header>

          <h1>文章标题</h1>

        </header>

      <nav><a></a><a></a><a></a></nav>

        标注导航链接的区域,若文档中有“前后”按钮,可放到 <nav> 元素中

        <nav>

          <ul>

            <li><a href="">导航1</a></li>

            <li><a href="">导航2</a></li>

            <li><a href="">导航3</a></li>

          </ul>

        </nav>

      <section></section>

        定义文档的区段(节),比如章节、头部、底部或者文档的其他部分

        <section>

          <h1>标题</h1>

          <p>内容</p>

        </section>

      <article></article>

        定义独立的包含内容,内容本身应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发,内容潜在来源为:论坛帖子、博客文章、新闻、评论等

        <article>

          <header>

            <h1>文章标题</h1>

          </header>

          <p>文章内容</p>

        </article>

      <aside></aside>

        定义其<article>内容之外的内容,内容应与附近的内容相关,可用作文章的侧栏

        <article>

          <header>

            <h1>文章标题</h1>

          </header>

          <p>文章内容</p>

          <aside>相关内容</aside>

        </article>

      <footer></footer>

        定义文档或节的页脚,同个文档中可定义多个<footer>元素

        <footer>

          <ul>

            <li>友情链接</li><li>友情链接</li><li>友情链接</li>

          </ul>

        </footer>

      <hgroup></hgroup>

        对标题元素进行分组,标题有多个层级(副标题)时,<hgroup> 元素被用来对一系列 h1~h6 元素进行分组

        <hgroup>

          <h1>主标题</h1>

          <h2>子标题</h2>

        </hgroup>

      <figure></figure>

        规定独立的流内容(图像、图表、照片、代码等),内容应该与主内容相关,同时元素的位置相对于主内容是独立的,如果被删除,则不应对文档流产生影响

      <figcaption></figcaption>

        为 <figure> 元素定义标题,应该被置于 <figure></figure> 之间的第一个或最后一个位置

        <figure>

          <img src="" />

          <img src="" />

          <figcaption>标题</figcaption>

        </figure>

      <mark></mark>

        定义带有记号的文本

      <time></time>

        定义公历的时间(24 小时制)或日期,时间和时区偏移是可选的,该元素能够以机器可读的方式对日期和时间进行编码;例如,用户代理能够把生日提醒或排定的事件添加到用户日程表中,搜索引擎也能够生成更智能的搜索结果

        datetime:规定日期或时间,在该元素的内容中未指定日期或时间时,使用该属性

        <time datetime="2018-02-14 12:00:00">情人节</time>

      <canvas></canvas>

        定义一个图形容器,以供使用脚本(JavaScript)来绘制图形,元素中的文本将会被显示在不支持 <canvas> 标签的浏览器中,每当画布的高度或宽度被重设时,画布内容就会被清空

        height:画布高度

        width:画布宽度

        <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>

     

    解决IE不支持HTML5的方法:

    方法一:在<head></head>部分引用Google的 html5.js 文件

      <!--[if lt IE 9]>

      <script src="/html5.js"></script>

      <![endif]-->

    方法二:使之成为块级元素,在CSS中加上修饰

      /*html5*/

      article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block;}

    方法三:JavaScript代码

      document.createElement("elementName").style.display = "block";

     

    内嵌物件  <embed src="url" width="" height="" type="MIME类型" />  (定义一个容器,用来嵌入外部应用或者插件,如mp3、GIF、Flash等)

      例:网页播放器  <embed src="url/a.mp3" width="300px" height="100px" autostart="true" loop="true" volume="0~100" controls="console/smallconsole/playbutton/pausebutton/stopbutton/volumelever" hidden="false"  />

     

    嵌入对象  <object data=""></object>  (用于包含对象,如html文档、图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash)

        data:定义对象使用资源的URL

        name:对象的名称

        height:对象的高度

        width:对象的宽度

        type:规定 data 属性中指定的数据的 MIME 类型

        form:规定对象所属的一个或多个表单id,多个表单id用空格分隔

        usemap:值为#加上要使用的 map 元素的名称,规定与对象一起使用的图像映射的名称(图像映射是带有可点击区域的图像),该属性与 <map> 元素的 name 属性相关联,创建对象和映射之间的关系

      <object data=""><param name="autoplay" value="true" /><param name="border" value="1" /></object> 

        <param>元素允许您为插入的对象规定 run-time 设置,也就是说,此标签可为父级的 <object> 或者 <applet> 标签提供参数

          name:指定对象支持的任何参数的名称,视对象格式而定

          value:设置name属性中所指定的对象的参数对应值

        

    定义视频(仅支持三种视频格式:mp4、webm、ogg)

      <video src="" width="" height="" controls="controls">

        <source src="a.mp4" type="video/mp4">

        <source src="a.webm" type="video/webm">

        <source src="a.ogg" type="video/ogg">

        浏览器不支持video标签时显示的内容

      </video>

        src:要播放的视频的URL,如果想在所有浏览器播放视频文件,可在 <video> 元素中使用 <source> 元素,可以链接到不同的视频文件,浏览器将使用第一个可识别的格式

        width:视频播放器的宽度

        height:视频播放器的高度

        poster:url/.jpg,视频下载时显示的图像,或者在用户点击播放按钮前显示的图像

        preload:视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性

          auto:指示一旦页面加载,则开始加载音频/视频

          metadata:指示当页面加载后仅加载音频/视频的元数据

          none:指示页面加载后不应加载音频/视频

        单属性:

          autoplay:视频自动播放

          controls:显示播放控件

          loop:视频循环播放

          muted:视频的音频输出为静音

     

    定义音频(仅支持三种音频格式:mp3、wav、ogg)

      <audio src="">

        <source src="a.mp3" type="audio/mpeg">

        <source src="a.wav" type="audio/x-wav">

        <source src="a.ogg" type="audio/ogg">

        浏览器不支持audio标签时显示的内容

      </audio>

        url:音频URL,如果想在所有浏览器播放音频文件,可在 <audio> 元素中使用 <source> 元素,可以链接到不同的音频文件,浏览器将使用第一个可识别的格式

        preload:auto/metadata/none,音频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性

        单属性:

          autoplay:音频自动播放

          controls:显示播放控件

          loop:音频循环播放

          muted:音频输出为静音

         

    简易滚动效果制作:

      <marquee  width=""  height="" direction=""  behavior="" bgcolor="" onmouseover=this.stop()  onmouseout=this.start() >...</marquee>

        width:滚动区域的宽度

        height:滚动区域的高度,作垂直滚动时一定要设height的值

        direction:滚动的方向,默认为 left(←),可选 right(→)、down(↓)、up(↑)

        behavior:滚动的方式,默认为 scroll(循环滚动),可选 alternate(来回滚动),slide(滑动幻灯片效果,滚动一次就停止)

        loop:表示滚动的次数,值为正整数,默认为循环滚动

        scrollamount:滚动速度,值越大速度越快,默认为6,建议1~3

        scrolldelay:停顿时间,默认为0,值越大速度越慢,通常不需要设置

        bgcolor:滚动区域背景色,默认为白色        

        onmouseover=this.stop():鼠标停留滚动区域时停止滚动

        onmouseout=this.start():鼠标离开滚动区域时开始滚动

     

  • 相关阅读:
    剑桥雅思写作高分范文ESSAY96
    剑桥雅思写作高分范文ESSAY95
    剑桥雅思写作高分范文ESSAY94
    剑桥雅思写作高分范文ESSAY93
    剑桥雅思写作高分范文ESSAY92
    剑桥雅思写作高分范文ESSAY91
    PHP 伪静态规则写法RewriteRule-htaccess详细语法使用
    php页面静态常用函数
    正则函数[原则,能用字符串函数解决不用正则,速度问题]s
    使用xshell文件传输
  • 原文地址:https://www.cnblogs.com/zhouwanqiu/p/8882839.html
Copyright © 2011-2022 走看看