如何使用SVG技术rect元素绘制矩形框并展示效果

SVG

XML

截图工具

浏览器

第一步，打开HBuilder编辑工具，新建xml文件polygon.xml，并插入标签，有svg定义和声明，高度和宽度，如下图所示：

第二步，在插入元素，并设置rect元素的宽度和高度以及填充的颜色，如下图所示：

第三步，在元素下方插入元素，设置stroke属性值、point值，如下图所示：

第四步，利用xlink在svg元素内插入，设置href、x和fill-rule，如下图所示：

第五步，保存代码并展示页面，结果可以看到一个矩形，但是出现了语法错误，如下图所示：

第六步，修改use标签元素的内容，使用，如下图所示：

注意rect标签元素的用法

注意绘制矩形的方法