那些遇到过的问题

小编Vis*_*ara的帖子

如何旋转SVG六边形？

我只是想在六角形状上做一些改变,我需要图像,只有形状必须旋转.或者,告诉我任何其他方法来实现这一目标.

注意:我需要图像,只有形状必须旋转.

从这个形状:

对于这种形状:

谢谢,

这是代码

<html>
  <head>
    <title></title>
  </head>
  <style type="text/css">
svg{
  width:30%;
  margin:0 auto;
}
#hex{
  stroke-width:1;
  stroke: #2f1522;
}

</style>
  <body>
    <svg viewbox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <pattern id="img" patternUnits="userSpaceOnUse" width="100" height="100">
      <image xlink:href="https://farm4.staticflickr.com/3165/5733278274_2626612c70.jpg" x="-40" width="150" height="100" />
    </pattern>
  </defs>
  <polygon id="hex" points="50 1 95 25 95 75 50 99 5 75 5 25" fill="url(#img)"/>
</svg>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

html css svg

Vis*_*ara
2016 06-21
2
推荐指数
1
解决办法
833
查看次数

标签 统计

css ×1

html ×1

svg ×1