SVG 绘制微信订阅号icon

效果

代码

cpp 复制代码
<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="600" height="600">
  <rect x="0" y="0" rx="0" ry="0" width="600" height="600" style="fill:#1677D2;stroke:black;stroke-width:0;opacity:1" />
  <rect x="140" y="120" rx="40" ry="40" width="320" height="360" style="fill:#fff;stroke:black;stroke-width:0;opacity:1" />
  <circle cx="200" cy="200" r="28" stroke="#fff" stroke-width="0" fill="#1677D2"/>
  <rect x="180" y="280" width="180" height="16" style="fill:#1677D2;stroke-width:0;stroke:rgb(0,0,0)"/>
  <rect x="180" y="320" width="120" height="16" style="fill:#1677D2;stroke-width:0;stroke:rgb(0,0,0)"/>
  <rect x="180" y="360" width="120" height="16" style="fill:#1677D2;stroke-width:0;stroke:rgb(0,0,0)"/>
</svg>

</body>
</html>
相关推荐
Ares-Wang1 小时前
JavaScript》》JS》 Var、Let、Const 大总结
开发语言·前端·javascript
SY_FC2 小时前
uniapp input 聚焦时键盘弹起滚动到对应的部分
javascript·vue.js·elementui
渣渣盟3 小时前
JavaScript核心概念全解析
开发语言·javascript·es6
Carlos_sam4 小时前
OpenLayers:ol-wind之渲染风场图全解析
前端·javascript
拾光拾趣录4 小时前
闭包:从“变量怎么还没死”到写出真正健壮的模块
前端·javascript
拾光拾趣录5 小时前
for..in 和 Object.keys 的区别:从“遍历对象属性的坑”说起
前端·javascript
遂心_6 小时前
深入解析前后端分离中的 /api 设计:从路由到代理的完整指南
前端·javascript·api
@大迁世界6 小时前
第7章 React性能优化核心
前端·javascript·react.js·性能优化·前端框架
DownToEarth6 小时前
H5实现获取当前定位
javascript
前端Hardy7 小时前
HTML&CSS:惊艳!科技感爆棚的登录页面代码解析
前端·javascript·html