SVG绘制圆形简单示例分享
来源:互联网 发布:java写的超级玛丽代码 编辑:程序博客网 时间:2024/05/16 12:36
今天分享“svg绘制圆形”部分
1、简单圆形
效果图如下:
关键代码:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <circle cx="40" cy="40" r="40"></circle></svg>
代码解析:
cx和cy属性定义圆点的x和y坐标。如果省略cx和cy,圆的中心会被设置为(0, 0);
r属性定义圆的半径
2、圆形填充颜色及边框
效果图如下:
关键代码:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <circle cx="45" cy="45" r="40" stroke-width="3" stroke="blue" fill="red"></circle></svg>
代码解析:
fill 属性定义圆形的填充颜色(rgb 值、颜色名或者十六进制值);
stroke-width 属性定义圆形边框的宽度;
stroke 属性定义圆形边框的颜色
好了今天的分享这里结束,我也是一边学习一边分享的,若有错误的地方请大家指正,下次分享“svg绘制椭圆”部分,希望大家届时来浏览,谢谢大家。
0 0
- SVG绘制圆形简单示例分享
- SVG绘制矩形简单示例分享
- SVG绘制圆形
- SVG Dom绘制圆形
- svg绘制简单图形
- svg绘制简单yinz
- svg绘制简单流程图
- svg常用简单示例
- HTML5 绘制简单圆形 loading. . . .
- shape简单绘制圆形背景
- 简单绘制图片为圆形的方法
- android 用canvas 绘制简单圆形时钟
- 绘制圆形
- svg圆形渐变
- SVG画圆形进度条
- svg圆形彩色进度条
- SVG基础五:圆形
- HTML5 SVG简单的动态绘制轮廓线条动画插件
- 详解GIT网络传递数据的加密解密过程
- 滑动删除
- Cimage类的介绍及使用
- PAT——德才论
- office2013的序列号
- SVG绘制圆形简单示例分享
- Unicode令人混淆的概念
- Linux下判断网线是否插入的代码
- C++远航2
- hibernate快速入门案例
- Develop -- Training(九) -- 分享简单数据
- 最大子段和||最大子矩阵和||最大全1子矩阵||最大全1子正方形||
- 我的笔记:精通JAVA集合类
- 如何找出记录表中某列记录数大于N