表单在 Firefox 中失去透明度答案

【问题标题】：Form lost opacity in Firefox表单在 Firefox 中失去透明度
【发布时间】：2016-08-02 22:15:29
【问题描述】：

我遇到了在 Mozzilla 中失去我的表单不透明度的问题：

Chrome 中的一切都很棒：

为每个浏览器设置我的 CSS3 代码是否存在一些费用？如果它会用 -o- -moz- ect 添加额外的行，那就太好了。前缀。

我的代码没什么特别的……

.input2
{
  transition: all 300ms ease;
  width: 240px;
  height: 45px;
  margin: 0 auto;
  margin-top: 10px;
  margin-left: 80px;
  border-width: 0;
  background-color: white;
  border-bottom-width: 3px;
  border-color: #CCCA14;
  text-indent: 20px;
  font-family: 'Titillium Web', sans-serif;
  color: #232227;
  font-size: 16px;
}

【问题讨论】：

你的代码是...？
欢迎来到 Stack Overflow。我们试图帮助人们解决代码中的错误，但要做到这一点，您需要提供您的代码！请阅读如何在Help center 中提出好问题
好的，我发布了我的 CSS 代码，谢谢。

标签： css google-chrome firefox

【解决方案1】：

现在试试吧，Border style 没有定义，这就是为什么它不能在 Firefox 中运行。

您可以在一行或多行中定义它，即border 的属性如下，

.input2{
border-bottom : 2px solid #CCCA14;
} 

or 

.input2{
border-bottom-width : 2px;
border-color : #CCCA14;
border-style : solid;
}

.input2
{
  transition: all 300ms ease;
  width: 240px;
  height: 45px;
  margin: 0 auto;
  margin-top: 10px;
  margin-left: 80px;
  border-width: 0;
  background-color: white;
  border-bottom: 3px solid #CCCA14;
  text-indent: 20px;
  font-family: 'Titillium Web', sans-serif;
  color: #232227;
  font-size: 16px;
  outline:none;
}

&lt;input type="text" class="input2"&gt;

【讨论】：

谢谢，它有效！你能告诉我为什么将每个 broder 属性写在一行 "border: (...)" 中更好吗？
@Edenwave 这是我们的选择如何定义它，正如我上面解释的那样，您可以在一行或单独的多行中定义它们，欢迎:-)，在多行中定义让我们更多地了解我们是什么做。