zoukankan      html  css  js  c++  java
  • <canvas>,<caption>,<cite>, <code>,<col>, <colgroup>标签文档

    <canvas>标签

    <canvas id="canvas">浏览器不支持</canvas>
    <script>
    var canvas = document.getElementById('canvas')
    var ctx = canvas.getContext('2d')
    ctx.fillStyle = '#FF0000'
    ctx.fillRect(0,0,100,100)
    </script>
    

    说明:该标签用于定义客户端矢量图,它本身没有行为,但它把绘图API展现给了客户端JavaScript,这也是它同svg不同的地方,svg是使用一个XML文档来描述绘图,他们在功能上是等同的,svg的优点是绘图很容易编辑。该标签有heightwidth属性,单位是px, 用于定义画布宽高,但通常我们使用JavaScript来设置。

    <caption>标签

    我是标题
    语文 数学
    98 98
    <table>
      <caption>我是标题</caption>
      <tr>
        <th>语文</th>
        <th>数学</th>
      </tr>
      <tr>
        <td>98</td>
        <td>98</td>
      </tr>
    </table>
    

    说明:该标签定义表格的标题,它必须紧跟在table后面,这个标题会居中显示。该标签的align属性建议用样式代替。

    <cite>标签

    GitHub是通过Git进行版本控制的软件源代码托管服务

    <p>GitHub是通过Git进行<cite><a href="https://zh.wikipedia.org/wiki/%E7%89%88%E6%9C%AC%E6%8E%A7%E5%88%B6">版本控制</a><cite>的软件源代码托管服务</p>
    

    说明:该标签表示对某个参考文献的引用,比如书籍杂志的标题。如果引用的文档有参考链接,应该在cite标签内添加a标签。他还有一个隐藏功能,浏览器可以自动摘录产考链接,作为一个单独的文档菜单来显示,任何人都可以这样做。

    <code>标签

    Javascript css

    <code>Javascript</code> <code>css</code>
    

    说明:该标签用于表示计算机源代码,样式上呈现等宽字体,它是行内元素。如果需要定义大量的编程代码,应该使用pre标签,他可以保留空格和换行,他是块级元素。另外如果仅仅只是想象在样式上呈现等宽字体,可用tt标签,当然最好还是用css来设置。

    <col>标签

    <table width="100%" border="1">
      <col span="2" style="background-color: red">
      <col style="background-color: green">
      <tr>
        <th>ISBN</th>
        <th>Title</th>
        <th>Price</th>
      </tr>
      <tr>
        <td>3476896</td>
        <td>My first HTML</td>
        <td>$53</td>
      </tr>
      <tr>
        <td>2489604</td>
        <td>My first CSS</td>
        <td>$47</td>
      </tr>
    </table>
    

    说明:该标签为表格的列应用样式。浏览器支持的属性有align:规定水平对齐方式(chrome测试无效果,用css设置样式),valign:规定垂直对齐方式(chrome无效),span:规定col横跨的列数(值为数字), 规定col的宽度。

    <colgroup>标签

    <table width="100%" border="1">
    <colgroup style="background-color: red">
      <col style="background-color: green">
    </colgroup>
    
      <tr>
        <th>ISBN</th>
        <th>Title</th>
        <th>Price</th>
      </tr>
      <tr>
        <td>3476896</td>
        <td>My first HTML</td>
        <td>$53</td>
      </tr>
      <tr>
        <td>2489604</td>
        <td>My first CSS</td>
        <td>$47</td>
      </tr>
    </table>
    

    说明:该标签和col标签有相同的属性,colgroup可以包括col标签,这两个标签的span默认值都为1。如果为col设置了span这不要再为colgroup设置span,因为会被覆盖掉。

    优秀文章首发于聚享小站,欢迎关注!
  • 相关阅读:
    试玩mpvue,用vue的开发模式开发微信小程序
    laravel 整合 swoole ,并简单 ab 测试对比性能以及在 PHPstorm 中利用debug调试配置swoole服务中的PHP代码
    移动端固定头部和固定左边第一列的实现方案(Vue中实现demo)
    PhpStorm 2017.3 版本在 Mac 系统 macOS High Sierra 版本 10.13.3 中运行很卡顿
    xdebug : Debug session was finished without being paused
    SVN checkout 出的项目在PHPstorm中打开没有subversion(SVN)选项按钮怎么办?
    PHP应用的CI/CD流程实践与学习:一、PHP运行环境的准备
    Mac环境下PHPstorm配置xdebug开发调试web程序
    『备忘录』elasticsearch 去重分页查询
    Mac下docker搭建lnmp环境 + redis + elasticsearch
  • 原文地址:https://www.cnblogs.com/yesyes/p/15356548.html
Copyright © 2011-2022 走看看