我知道在HTML中有两种不同的设置透明度的方法：
<div opacity="0.5"></div> 和
<div style="opacity: 0.5;"></div>
我也知道如何在JavaScript中设置这两种方法：
div.setAttribute("opacity", 0.5); 和
div.style.opacity = 0.5
这两种方法有什么主要区别吗？我应该更喜欢其中的一种吗？（我想我至少应该保持一致）
HTML不透明度属性与CSS不透明度
4
- Eschon
1
你实际上只知道一种在HTML中设置不透明度的方法 - 你发布的第一种方法在所有主流浏览器中都没有效果。 - Jaromanda X
2个回答
-1
CSS总是比Javascript更快。如果你能用CSS做任何事情，为什么要浪费时间用Javascript呢。
CSS优先规则表明内联和HTML属性比外部或嵌入式CSS具有更高的顺序。然而，内联CSS并不是一个好的实践，除非在你的项目中出于某些原因需要它。
正确的CSS透明度代码：
img {
opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */
}
https://css-tricks.com/almanac/properties/o/opacity/
img {
/* Theoretically for IE 8 & 9 (more valid) */
/* ...but not required as filter works too */
/* should come BEFORE filter */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; // IE8
/* This works in IE 8 & 9 too */
/* ... but also 5, 6, 7 */
filter: alpha(opacity=50); // IE 5-7
/* Modern Browsers */
opacity: 0.5;
}
- Mike Phils
3
是的，但我没有看到你回答这个问题。问题是关于使用（a）div本身的属性vs（b）应用于元素的CSS样式的属性。JavaScript在这里不相关，因为每种方法都可以在不使用它的情况下使用。 - enhzflep
1Mike，所有的回答都是受欢迎的，因为它们意味着有人在免费帮助另一个人。然而，你的特定回答根本没有回答问题。我没有给你投反对票，我觉得没有必要。这是一个简单的问题，关于CSS或HTML属性的不透明度，而不是Javascript、内联样式或其他任何东西。 - chiapa
看起来更好了，但我仍然看不到它解决了手头的问题。这真的很简单。改变元素的不透明度，哪种方法更好？是使用元素的不透明度属性还是使用应用于元素的css规则的不透明度属性。不关心JS，也不关心内部/外部CSS。只是HTML属性VS CSS属性。你将不得不与留下这个评论的人一起讨论这个问题。无论如何，这个问题已经无足轻重了——misterManSam刚刚提醒我们应该记住的事情。除了SVG之外，没有“opacity”属性。 - enhzflep
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接