有一个直接的CSS方法，使一个元素的边界半透明的东西像这样?
border-opacity: 0.7;
如果没有，有没有人知道我如何在不使用图像的情况下做到这一点?
当前回答
由于这个答案是谷歌结果的顶部，所以决定为像我这样的新手发布一个更新(2021年)的答案。
你可以使用rgba颜色设置边框不透明度。
border:2px solid rgba(232, 69, 69,.5); /* notice the .5 */
参见示例提琴在这里- http://jsfiddle.net/joshdane/74pybasm/33/
你可以使用它，享受它。
有一些讨论说旧的浏览器不支持rgba，但大多数人不再使用旧的浏览器了。如果您只是在学习，不要担心支持旧的浏览器。
其他回答
在某些情况下，另一种可行的解决方案是:将边框样式改为虚线样式。
在前景色和背景色之间有交替的像素组与连续的部分透明像素线是不同的。另一方面，这大大减少了对CSS的要求，而且在不需要任何特定于浏览器的指令的情况下，它在每个浏览器之间都更加兼容。
正如其他人所提到的，CSS3支持rgba(…)语法来指定带有不透明度(alpha)值的边框颜色。
这里有一个快速的JSFiddle演示，如果你想检查它。
它适用于Safari和Chrome(可能适用于所有webkit浏览器)。 它可以在Firefox中运行 我怀疑它在IE中是否能正常工作，但我怀疑有一些过滤器或行为可以使它工作。
还有CSS RGBA边框/背景alpha double，这表明了一些其他问题——即，边框呈现在您指定的任何背景颜色(或背景图像)之上;因此在许多情况下限制了边界alpha的有用性。
在这里稍微跳出框框思考一下:如果您正在使用SVG基本形状，您可以使用笔画、笔画宽度(浏览器支持> 97%)和笔画不透明度(浏览器支持> 99%)的组合来完成基本上与OP要求的相同的事情。
例如，这样的声明:
circle {
stroke: blue;
stroke-width: 5px;
stroke-opacity: 0.4
}
将在<circle>的周长添加一个半透明的蓝色晕，填充#000。
这个JSFiddle提供了几个SVG基本形状的演示。小提琴使用红色填充和蓝色描边来突出描边和边框之间的主要区别-一半的描边宽度在基本形状的周长内。
这就给出了一个“双边框”外观(从外部到每个基本形状的中心:蓝色->(蓝色+红色=紫色)->红色)，这是不可能仅用CSS边框实现的(但边框+轮廓可以-参见上面的JSFiddle，使用<div>的例子)，并且很难实现(在径向基本形状的情况下)用径向梯度()。
由于这个答案是谷歌结果的顶部，所以决定为像我这样的新手发布一个更新(2021年)的答案。
你可以使用rgba颜色设置边框不透明度。
border:2px solid rgba(232, 69, 69,.5); /* notice the .5 */
参见示例提琴在这里- http://jsfiddle.net/joshdane/74pybasm/33/
你可以使用它，享受它。
有一些讨论说旧的浏览器不支持rgba，但大多数人不再使用旧的浏览器了。如果您只是在学习，不要担心支持旧的浏览器。
这很简单，使用一个0偏移量的实体阴影:
#foo {
border-radius: 1px;
box-shadow: 0px 0px 0px 8px rgba(0,0,0,0.3);
}
此外，如果您为元素设置一个边界半径，它会为您提供非常圆润的边界
jsFiddle演示
