Question

我已经尝试了一段时间以使此SVG正常工作，但无济于事。我正在尝试的是使三角形在每次修改窗口大小时都不会移动。

*{
    margin:0;
    padding:0;
}

html,body{
    height: 100%;
    width: 100%;
    overflow: auto;
}

#nose{
    stroke: black;
    stroke-width: 2px;
    fill: #ffd9b3;
    position: fixed;
}
.svg{
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

<body>
    <div class="svg">
    <svg width="400px" height="500px">
        <ellipse id="face" cx="15vw" cy="15vw" rx="10vw" ry="12vw"></ellipse>
        <polygon id="nose" points="170,210 210,210 190,130"></polygon>
    </svg>
</div>
</body>

任何帮助将不胜感激！

固定多边形的位置

0 个答案: