SVG中嵌入HTML元素

<?xml version="1.0" standalone="yes"?>

<style>

    .clsfont{

    border:1px solid #ccc;background:#fff;line-height:37px;color:#999;font-size:14px;text-align:center;font-family:微软雅黑;font-size:16px

    }

    .clsheader{

    background-color:#f0a3bf;line-height:37px;color:#999;font-size:14px;text-align:center;font-family:微软雅黑;font-size:16px;border-left:1px solid #fff;border-top:1px solid #fff;border-bottom:1px solid #fff

    }

</style>

<svg xmlns="http://www.w3.org/2000/svg" height="100%" width="100%">

  <foreignobject x="0" y="0" width="415" height="203">

    <body xmlns="http://www.w3.org/1999/xhtml">

      <table  border="0" cellpadding="0" cellspacing="0"  width="415">

    <tr>

      <td width="8" style="border-left:1px solid #fff;border-top:1px solid #fff;border-bottom:0"> </td>

      <td width="18%"  scope="col" class="clsfont"> </td>

      <td width="22%"  scope="col" class="clsfont"><strong>数量</strong></td>

      <td width="22%"  scope="col" class="clsfont"><strong>占比</strong></td>

      <td width="36%"  scope="col" class="clsfont"><strong>环比上升（下降）</strong></td>

    </tr>

    <tr>

      <th scope="row" class="clsheader"> </th>

      <td  scope="row" class="clsfont"><strong>分类 </strong></td>

      <td class="clsfont">44</td>

      <td class="clsfont">11%</td>

      <td class="clsfont"><span class="up"></span>11%</td>

    </tr>

    <tr>

      <th  scope="row"  class="clsheader"> </th>

      <td  scope="row" class="clsfont"><strong>论坛 </strong></td>

      <td class="clsfont">44</td>

      <td class="clsfont">11%</td>

      <td class="clsfont"><span class="down"></span>11%</td>

    </tr>

    <tr>

      <th scope="row"class="clsheader"> </th>

      <td  scope="row" class="clsfont"><strong>博客 </strong></td>

      <td class="clsfont">44</td>

      <td class="clsfont">11%</td>

      <td class="clsfont"><span class="down"></span>11%</td>

    </tr>

    <tr>

      <th scope="row"  class="clsheader"> </th>

      <td  scope="row" class="clsfont"><strong>微博 </strong></td>

      <td class="clsfont">44</td>

      <td class="clsfont">11%</td>

      <td class="clsfont"><span class="down"></span>11%</td>

    </tr>

  </table>

    </body>

  </foreignobject>

</svg>

SVG中嵌入HTML元素的更多相关文章

[翻译svg教程]svg中的circle元素
svg中的<circle> 元素,是用来绘制圆形的,例如 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink= ...
[翻译svg教程]svg 中的g元素
svg 中的<g>元素用来组织svg元素.如果一组svg元素被g元素包裹了,你可以通过对g元素进行变换(transform),被g元素包裹的元素也将被变换,就好这些被svg包裹的元素是一个 ...
使用SVG中的Symbol元素制作Icon【摘转】
以下为内容摘抄和转摘记录: 为什么要用svg ? SVG优势随着高清屏幕的普及,相比使用png等位图而言,使用SVG等矢量图形是一种全新的设计方式.更重要的是相比位图而言,SVG有着无可比拟的优势. ...
使用iframe方式获得svg中的DOM元素，和svg 的 contentDocument 返回 null
碰到这个的相关问题,百度找了好久,找到了个解决方法,原址 https://segmentfault.com/q/1010000009001758 var iframe = document.getEl ...
CSS和SVG中的剪切——clip-path属性和<clipPath>元素
剪切是什么剪切是一个图形化操作,你可以部分或者完全隐藏一个元素.被剪切的元素可以是一个容器也可以是一个图像元素.元素的哪些部分显示或隐藏是由剪切的路径来决定的. 剪切路径定义了一个区域,在这个区域内 ...
【转】CSS和SVG中的剪切——clip-path属性和<clipPath>元素
本文由大漠根据SaraSoueidan的<Clipping in CSS and SVG – The clip-path Property and <clipPath> Elemen ...
在WinForm应用程序中嵌入WPF控件
我们知道,在WPF界面上添加WinForm的控件需要使用WindowsFormHost类.而在WinForm界面上添加WPF控件该如何做呢?有没有类似的类呢?明显是有的,ElementHost就是为了 ...
在页面中嵌入svg的几种方法
//在页面中嵌入svg的方法1:使用 <embed> 标签<embed> 标签被所有主流的浏览器支持,并允许使用脚本.注释:当在 HTML 页面中嵌入 SVG 时使用 < ...
HTML页面中嵌入SVG
HTML页面中嵌入SVG的几种方式你有N种理由使用SVG在页面中展示图像,如它的矢量特性.广泛的浏览器支持.比JPEG和PNG更小的体积.可用CSS设置外观.使用DOM API操作以及各种可用的SV ...

随机推荐

为Linux设置IPTables防火墙
我们来讨论一下如何为你的CentOS 服务器来设置简单的防火墙. 这里我们以DigitalOcean的CentOS 6 VPS为基础来讨论的,同样也适用于阿里云上其他类型的LINUX系统. (阿里 ...
css3动画相关笔记
1.$(".aa").delay(2500).animate({width:0}); // 延迟 2.setTimeout(function(){ --> css3 anim ...
Gym 100633G Nano alarm-clocks
题目,给定n个时钟,要求把他们调成一样的时间.求最小的步数思路:肯定是有一个时钟作为标准的啦,要找到这个时钟,怎么找呢?没其他方便的方法,暴力枚举.那么枚举后,怎么能快速地算到其他时钟转到这个时钟的 ...
一般处理程序中,获取session
注意了: 1.要在一般处理程序中获取其他页面的session值,需要引用名空间: using System.Web.SessionState; 2.然后继承一个接口:IRequiresSessionS ...
.net增删该查DBAccess的应用
1.首先引用dll文件 2. //DBAccess.dll引用一個dll文件 private IDBAccess _access; private static readonly stri ...
浅谈Fluent Ribbon 中的SplitButton
Fluent Ribbon Control Suite 就不做介绍了,网上的例子比较多,类似Office2007及以后版本的图形界面(菜单栏).官网地址:https://github.com/flue ...
linux日志log查询常用命令
一般的log文件都是需要过滤 1.grep 过滤查找查询ip 221.2.100.138的log grep '221.2.100.138' web.access.log grep 221.2.10 ...
程序员职业规划（一篇来自"阿里Java工程师"对工作3年左右程序员的职业建议和应该掌握的职业技能）
程序员的三个阶段(转载) 第一阶段:三年我认为三年对于程序员来说是第一个门槛,这个阶段将会淘汰掉一批不适合写代码的人. 这一阶段,我们走出校园,迈入社会,成为一名程序员,正式从书本上的内容迈向真正的 ...
PAT——1060. 爱丁顿数
英国天文学家爱丁顿很喜欢骑车.据说他为了炫耀自己的骑车功力,还定义了一个“爱丁顿数”E,即满足有E天骑车超过E英里的最大整数E.据说爱丁顿自己的E等于87. 现给定某人N天的骑车距离,请你算出对应的爱 ...
PAT——1049. 数列的片段和
给定一个正数数列,我们可以从中截取任意的连续的几个数,称为片段.例如,给定数列{0.1, 0.2, 0.3, 0.4},我们有(0.1) (0.1, 0.2) (0.1, 0.2, 0.3) (0.1 ...

SVG中嵌入HTML元素

SVG中嵌入HTML元素的更多相关文章

随机推荐

热门专题