显示高度、宽度、填充的设计工具

Question

有谁知道我可以使用什么工具来绘制这样的图表？我对高度和宽度标记特别感兴趣。

Answer 1

看看 SVG 图形。将以下内容复制并粘贴到 .svg 文件中，然后在浏览器中打开。你会明白的。

    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="408px" height="194px" >

    <rect x="126px" y="52px" stroke="violet" style="stroke-width: 1px" width="157px" height="72px" fill="rgb(244,150,206)"/>
    <rect x="142px" y="52px" rx="4px" ry="4px" stroke="grey" style="stroke-width: 1px" width="122px" height="72px" fill="rgb(247,200,228)"/>
    <rect x="158px" y="53px" stroke="none"  width="90px" height="70px" fill="white"/>
    <text x="160" y="100" font-family="Verdana" font-size="25" fill="blue" > AGREE </text>

    <line x1="142px" y1="39px" x2="264" y2="39px" style="stroke:rgb(239,52,162);stroke-width:2" />
    <line x1="142px" y1="30px" x2="142" y2="48px" style="stroke:rgb(239,52,162);stroke-width:2" />
    <line x1="264px" y1="30px" x2="264" y2="48px" style="stroke:rgb(239,52,162);stroke-width:2" />

    <text x="167" y="30" font-family="Verdana" font-size="10" fill="rgb(243,134,198)" > 64dp min width </text>

    </svg>

显示高度、宽度、填充的设计工具

Design tool to show heights, widths, padding

html

theming

material-design