如何在控件上添加5像素的额外边框？

Question

我想在我的控件上添加一个额外的边框（粗），如：http://tickspot.com/screenshots/

正如我们在此链接中看到的，组合列表和文本框具有蓝色勾号边框。

如果不付出太多努力，我怎样才能实现这一目标？

谢谢。

Answer 1

您可以嵌套元素并为外部元素指定边框和填充。 在这里，您会得到一个印象：http://jsfiddle.net/jy92c/1/

Answer 2

并非所有表单元素都能正确支持CSS样式。您可能会发现一些可以全面运作的样式，但可能需要一些工作。

获得一致性的更简单选项是将控件包装在<span class='control'></span> 中此方法的缺点是您必须添加额外的标记。您可以在页面class='addBorder'或类似内容上提供所有元素，然后使用JavaScript查找并包装它们。那是一种非常不显眼的方法。如果你需要帮助来实现这一点，我将很乐意为你提供帮助。

Answer 3

仅限CSS的解决方案可能是同时使用border和outline样式：http://jsfiddle.net/RyJzC/

（但请记住outline用于表示元素具有焦点，因此如果您设置了样式outline，请确保将此行为考虑在内。