(2)HTML5-内容标记方法

原创 2016年08月28日 22:55:29

C++的注释方法在我的电脑上用不了,所以只能用html的注释方法。

<!doctype html>
 <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <!--调用jquery库-->  
    <script src="https://code.jquery.com/jquery-2.1.0.js"></script>  
 </head>
 <body>
  <!--绘图元素-->

 <!--id替代当前画布命名,在多个画布时有助于识别-->
<canvas id="Canvas" width="480" height="180" style="background-color:gray;border:5px">
 </canvas>
 <!--分组元素-->

 <!--
 此标签可以声明一组包含图片标题,信息的分组。浏览器会将(figure)内的所有元素(包括文字,图像)视为一个对象。
 -->
 <figure>
     <img id="map" width=400 height=400 src="http://nostarch.com/images/treasuremap.png">  
     <p>
     宝藏<br>
     大宝藏
     </p>
 </figure>

 <!--
 此标签是(figure)下的一个子标签,放在figcaption标签内的文字代表
 “图片的标题”。(figcaption)子标签应该被置在(figure)下的一个子标签,放在figcaption标签内的文字代表第一个
 或最后一个位置。
  -->
 <figure>
   <img id="map" width=400 height=400 src="http://nostarch.com/images/treasuremap.png">  
   <figcaption>宝藏</figcaption>
    <p>大宝藏</p>
 </figure>

 <!--文字层级元素-->
 
 <!--
 放置在此标签内的文字,可以具有独立的方向格式,适用来标记方向不明的文字。
-->
 <ul>
     <li>Username:50 points</li>
     <li>Username<bdi></bdi>:98 points</li>
 </ul>
 
<!--使用此标签可以在画面中启动文字提示框。-->
 <dialog open>
    你好!
 </dialog>
 
 <!--使用此标签可以将部分文字加上荧光标记-->
 <p>路飞<mark>是海贼王</mark>哈哈</p>
 
 <!--
 (rt)是(ruby)下的一个子标签,主要用于排版“注释”或“发音”,可以将其补充信息排版在主体上方。
 -->
 <ruby>
     马<rt>ma</rt>
 </ruby>

 <!--
 (rp)也是(ruby)下的一个子标签,可将其补充信息排版在主体右方。
 -->
 <ruby>
     马<rp>ma</rp>
 </ruby>

<!--
加注在此标签中的文字信息会被浏览器视为“时间格式”进行解析。若是使用datetime属性,代表在HTML中为此文字加上时间标记
-->
<p>早上<time>8:20</time>上课</p>
<p>早上<time datetime="2014.11.22">日期</time>上课</p>

<!--交互式元素-->

<!-- 《details> 与《summary》是一起使用的标签,这两个标签的配合可以设计出信息隐藏与展开的互动效果 《details》标记的文字代表可以隐藏于展开的部分;《summary》标记的文字作为触发隐藏于展开的标题 -->

<details>
    <summary>中国</summary>
    <p>
    中华人民共和国<br>
    新中国建于公元1949年<br>
    是亚洲面积最大的国家
    </p>
</details>

<!-- 放在《command》标签内的文字可依具备“按钮”功能,配合
《command》的属性可以指定单击按钮后要执行的操作 -->

<menu>
    <command onclick="alert('Hi There!')">
    Click Here!
    </command>
</menu>
 </body>
</html>



版权声明:本文为博主原创文章,转载必须声明出处,thank。

HTML5标记省略 语法规则

  • 2011年11月25日 14:06
  • 32KB
  • 下载

HTML5新特性及标签标记概要

近期微软宣布在IE9使用HTML5标准并仅支持H.264视频格式,不再支持FLASH,不过天缘感觉有点不可思议,应该是仍然兼容插件支持FLASH才对,毕竟取代FLASH不可能一朝一夕就会完成,Adob...

html5 超文本标记语言最新

  • 2011年12月29日 09:33
  • 409KB
  • 下载

HTML5标记省略 语法规则

 HTML5的标记可以省略,在不影响页面布局的情况下,可以节省网页体积大小。减少代码量。某些标记可以省略。省略标记的开始标记并不意味着标记不存在,它是隐含的,但它仍然存在。一个HTML文件总是有一个根...

HTML5教程-超文本标记语言编程

1、由来 万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点...

cocos2d-html5 碰撞检测的几种方法

游戏中的碰撞还是比较多的,比如角色与角色的碰撞,角色与墙壁的碰撞,角色与怪物的碰撞等,都需要 进行碰撞的检测,来触发一定的事件 最近在尝试制作一个小游戏的时候需要用到碰撞检测,然后就查了下资料,并...
  • lzan13
  • lzan13
  • 2014年06月12日 14:35
  • 13773

cocos2d-html5 javascript 通过C++绑定,调用java方法

1、java中的写法 public class XConnectPlugin { public static void pay(String str) { Log.d("mylog ", "s...

html5学习笔记之一(新的页面组织标记)

看视频,做笔记: html5主要专注于内容不注重形式。 一、头部标记 1.header:一般用于头条醒目的新闻,但可以用于页面的任何部分。可以嵌套,但不能嵌套在footer和adress中(ad...

html5学习笔记之五(扩展图形标记)

看视频,做笔记: 1.字体信息 context.font = [CSS font property] 属性有:font-style、font-variant、font-size、font-fam...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:(2)HTML5-内容标记方法
举报原因:
原因补充:

(最多只允许输入30个字)