如何在不使用 CSS 大纲属性的情况下设置大纲

How to set outline without using CSS outline property?

本文关键字：属性情况下设置 CSS 更新时间：2023-09-26

我想用Javascript和CSS设置鼠标悬停元素的轮廓。

在chrome中，CSS大纲属性运行良好，但在Internet Explorer中则不行（我使用IE9）。

我测试了CSS边框属性，但它减少了实际内容的宽度。

我的目的是在没有 CSS 大纲属性的情况下设置大纲，并且内容的区域不会更改。

该解决方案应该支持IE 7~9，如果也是IE6，它是最好的。

将元素包装在带有透明边框的<div>中。在鼠标悬停时为边框着色。

如果您不介意内容宽度减少一个恒定量，即内容宽度在鼠标悬停时不会改变，则可以将透明边框添加到元素本身（以及鼠标悬停时的颜色）。

我测试了CSS边框属性，但它减少了实际内容的宽度。

是的，您必须调整布局的其余部分以考虑您引入的 x 像素的边框 - 它会占用某处的空间，由您设置适当的尺寸、边距和填充来补偿。