有没有一种方法可以使svg元素在html页面上突出显示? [英] Is there's a way to make svg element be possible to hightlight on html page?

查看:35
本文介绍了有没有一种方法可以使svg元素在html页面上突出显示?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在页面上有一个svg元素,可以对其进行编辑,但是为此,我需要选择它(请参见带有文本的屏幕截图示例),例如页面上的普通文本或图像.不能使用svg元素执行此操作,也找不到任何信息来实现它.

I have an svg element on page, which will be possible to edit, but for this I need to select it (see screenshot example with text), like usual text or image on the page. Can't do it with svg element or find any information how to achieve it.

<!DOCTYPE html>
<html>
<body>
<div style="height:100px;width:100px;">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
 </svg>
</div>

</body>
</html>

推荐答案

添加tabindex属性以使其可以选择(与html相同).

Add a tabindex attribute to make it selectable (same as html).

<!DOCTYPE html>
<html>
<body>
<div style="height:100px;width:100px;">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
<circle tabindex="1" cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
 </svg>
</div>

</body>
</html>

这篇关于有没有一种方法可以使svg元素在html页面上突出显示?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆