如何勾勒出长跨度标签？答案

【问题标题】：how to outline a long span tag?如何勾勒出长跨度标签？
【发布时间】：2014-02-05 08:36:35
【问题描述】：

需要一个如下的轮廓框：

HTML代码是：

<p>We <span>prefer questions that can be answered, not</span> just discussed.</p>

轮廓框左上点和右下点的坐标很难得到。

使用：

outline: 2px red solid;

只能在 chrome 中工作，但在 firefox 中失败。并且在<p> 的行高为 300% 时在 chrome 中也失败了。

【问题讨论】：

【解决方案1】：

像这样：

CSS：

p {
    width: 220px;
}

span {
    outline: 2px red solid;
}

所以你有你想要的范围，只需将outline 放在上面就可以了。很简单吧？ :D

注意：正如 cmets 中所指出的，这在 Firefox 中似乎不起作用。现在正在寻找解决方案。

【讨论】：

【解决方案2】：

如果您知道如何使用 CSS3，请使用它。否则，请在您的 html 页面中插入以下内容。

<style type="text/css">
    span {
         border: 5px solid red;
    }
</style>

【讨论】：