有没有一种方法可以将页脚按钮设置为白色

时间:2019-04-10 08:47:14

标签: css margin

系统要求我将页脚按钮设置为白色,但是我不确定我在做什么是错误的还是代码有问题。

我尝试单独编码按钮,但似乎不正确

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.mdc-icon-button {
    margin: 0.5em;
    color: white;        
  }

</style>

<div>
  <h2>abdurrahman abdulwahab</h2>
  <div class ="user-photo mdc-elevation--z3">
    <img src="https://via.placeholder.com/150x150">        
  </div>
  <div class="details mdc-elevation--z3">language</div>
  <div class="messages"></div>
</div>

<footer>
  <button class="btn-address mdc-icon-button material-icons">contact_support</button>
  <button class="btn-phone mdc-icon-button material-icons">perm_phone_msg</button>
  <button class="btn-birthdate mdc-icon-button material-icons">calendar_today</button>
</footer>

我希望知道如何设置页脚样式,以便仅将按钮颜色设置为白色,而不在页脚上方包括div。

3 个答案:

答案 0 :(得分:0)

我假设您正在尝试将背景设置为白色,而不是像当前一样设置为文本颜色。

如果您尝试将背景设置为白色,则需要将background: white;设置为color来设置文本颜色。

请记住,您将需要删除color或将值更新为除“ white”之外的其他值。

答案 1 :(得分:0)

根据个人经验,您可以使用style =“ attribute”路线对按钮进行内联样式。但是,最好尝试将样式保留在CSS中。在您的HTML中,添加类“按钮”,并在CSS样式中使用css属性“ background-color:#FFFFFF”。

它应该像这样:

FROM postgres:9.4

RUN sed -i 's|http://httpredir.debian.org/debian|http://ftp.ie.debian.org/debian/|g' /etc/apt/sources.list

ADD /99fixbadproxy ./badproxy 
RUN apt-get install apt && apt-get update && apt-get install -y \
    postgis \
    postgresql-9.4-postgis-scripts \
    postgresql-9.4-postgis-2.2 \
    && apt-get clean && rm -rf /var/lib/apt/lists/*

您可以将我在这里使用的类名更改为与您正在编辑的内容更加特定的名称,这样它就不会与其他CSS融合在一起。

答案 2 :(得分:0)

这是CSS代码,仅影响页脚内部的按钮样式:

<style>    
    footer button {
      background-color: #fff;
      color: #000;
    }
</style>

假设您希望按钮的字体颜色为黑色。