我在这边看到了那个按钮（http://letsgo.gorizia.it/），想知道如何实现这种风格？
有没有有用的教程，或者你能给我一个提示，我应该使用哪个 css？
问问题
7346 次
4 回答
3
我想你可以看看StackOverflow 上的这篇文章：
你应该像帖子中所说的那样使用 rgba
.alpha60 {
/* Fallback for web browsers that don't support RGBa */
background-color: rgb(0, 0, 0);
/* RGBa with 0.6 opacity */
background-color: rgba(0, 0, 0, 0.6);
/* For IE 5.5 - 7*/
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
/* For IE 8*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}
还有这个网站：
这应该会给你你想要的效果。
您可能仍然需要寻找圆角，但现在使用 css3 不应该那样找到。
W3schools 也有一个关于它的页面。我知道它不是最可靠的网站，但对于一些您无法轻易找到的小提示或技巧来说，它可以派上用场。
于 2012-07-06T13:16:54.250 回答
0
使用 RGBA 作为背景颜色应该可以解决问题：
.ui-btn { background-color: rgba(0,0,0,.25); }
类似的东西应该可以，但你会想要使用颜色（前三个值）和不透明度本身（最后一个值）
于 2012-07-06T13:18:15.753 回答
0
当我将 alpha60 类作为一个类添加到分配了 data-role = button 的按钮或锚标记时，我无法获得任何效果。我猜 JQM 框架覆盖了那个 css（但我不知道……如果有人这样做，学习起来会很有趣）。
对我有用的是这样的 ui-btn-up-a （或 b 或 c 或任何你的 css 主题）（对于带有 data-theme='b' 的蓝色按钮）
.ui-btn-up-b {
background: rgba(0, 0, 255, 0.2); /* set the alpha to taste...*/
}
我认为特别好的是按钮在悬停时变得不透明并保持其单击（按钮向下）属性，因此用户确实知道他们正在与按钮交互，否则他们可以阅读按钮后面的任何内容.
当然，关于不支持 rgba 的浏览器的所有注意事项仍然适用，因此如果您的用户群包括较旧的浏览器，您应该使用后备 css 使其健壮。
于 2013-01-29T03:10:24.813 回答
-1
在您的代码中添加一个锚标记并将其 HREF 设置为您想要的任何内容。然后转到 Photoshop 并为该按钮生成图像。
如果您尝试在 CSS 中执行此操作，并设置包含锚点的容器的不透明度，则不透明度也会过滤到锚点的文本。不好所以...
您的最终锚标记应如下所示：
<a href="whereever.com"><img src="myButton.png" /></a>
（确保您的图像是 .PNG，因为 .JPEG 不支持透明度）
于 2012-07-06T13:18:40.243 回答