Question

我正在使用MVC，ASP.NET和Twitter Bootstrap设计网页。我想创建一个按钮，从周围div的背景颜色继承其文本字体颜色。当我设置像color: transparent这样的CSS样式按钮时，文本是不可读的，因为它与按钮颜色相同。

有没有办法在CSS中执行此操作，还是必须使用JS或jQuery来实现此目的？

以下是一个例子：

.red {
  position: relative;
  width: 200px;
  height: 200px;
  border: 1px solid black;
  background: -webkit-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Firefox 3.6 to 15 */
  background: linear-gradient(left, red 33%, #FFFFFF 66%); /* Standard syntax (must be last) */
}

.custom {
  position: absolute;
  border: 1px solid black;
  top: 70px;
  left: 70px;
  background-color: orange;
}

<div class="red">
<button class="btn custom" type="input">
Button
</button>
</div>

Answer 1

使用此jQuery代码：

var divColor = $(".red").css("backgroundColor");

$(".custom").css("color", divColor);

使用渐变颜色

1 个答案: