页脚按钮的 CSS 颜色答案

【问题标题】：CSS colors for footer button页脚按钮的 CSS 颜色
【发布时间】：2019-04-10 19:47:08
【问题描述】：

将 FOOTER 中的每个 BUTTON 设置为白色

footer {
  width: calc(100% - 2em);
  z-index: 500;
  position: absolute;
  bottom: 0;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  margin: 0 1em;
}

<footer>
  <button class="mdc-icon-button material-icons" id="btn-address">Address</button>
  <button class="mdc-icon-button material-icons" id="btn-phone">phone</button>
  <button class="mdc-icon-button material-icons" id="btn-birthday">Birthday</button>
</footer>

【问题讨论】：

各位，我的时间有限。帮助我已经包括颜色：白色；到我的css页脚类，仍然提示它不正确。请问我该怎么办？
好像你只想嵌套。 css：footer button { color: white; }你能不能详细说明一下？
请不要乞求。如果我们理解问题，我们会回答
好的，这是完整的代码

标签： html css

【解决方案1】：

footer {
  width: calc(100% - 2em);
  z-index: 500;
  position: absolute;
  bottom: 0;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  margin: 0 1em;
}

footer button{
  color: #fff;
  background: #ff0000;
  border-radius: 5px; 
  border: 1px solid #ff0000;
  padding: 3px 10px;
}

<footer>
  <button class="mdc-icon-button material-icons" id="btn- 
          address">Address</button>
  <button class="mdc-icon-button material-icons" id="btn- 
          phone">phone</button>
  <button class="mdc-icon-button material-icons" id="btn- 
          birthday">Birthday</button>
</footer>

【讨论】：

【解决方案2】：

在你的 style 标签中添加这个属性

footer button{
    color: #fff;
}

【讨论】：

仍然没有工作。 alc-dev-toolkit-d50fe.firebaseapp.com/Um1nGA4YQscSdwYHQjQB/…
您的整个页脚标签没有被浏览器解析。您可以检查检查元素功能。

【解决方案3】：

定义一个 CSS 类

.button {
display: block;
width: 115px;
height: 25px;
background: #4E9CAF;
padding: 10px;
text-align: center;
border-radius: 5px;
color: white;
font-weight: bold;
}

并包含

更多信息尝试阅读 Styling an anchor tag to look like a submit button

【讨论】：

所有这些答案都是正确的。但我不知道 Andela 使用什么插件。按钮都变成了白色，但我无法通过现阶段。

【解决方案4】：

footer button {
    background-color: white
}

color 将定义按钮中文本的颜色，但听起来您希望按钮本身为白色。

【讨论】：