css - Ionic css 页脚背景颜色和标题颜色

Question

我正在使用 Ionic 框架，我需要一个背景颜色为红色且文本居中对齐的页脚。页脚需要有类似按钮的行为；页脚应该像一个按钮，中间有文本“REGISTER”:

我试试这段代码:

ionic HTML:

<ion-content>
  Some content!
</ion-content>
<ion-footer-bar  class="myColor">
  <div class="buttons">
    <button class="button">REGISTER</button>
  </div>
 </ion-footer-bar>

CSS:

.myColor{
   color:red
}

.button{
color:white;
text-align:center;
}

但是，它不起作用。我不知道;你们中的一些人有一些好的建议:

谢谢!

Answer 1

您应该像这样将整个页脚设置为可点击的元素:

<ion-footer-bar class="myColor" ng-click="myRegisterFunction()">
  REGISTER
</ion-footer-bar>

然后你可以只使用简单的 css:

.myColor {
  background-color: blue;
  text-align: center;
  justify-content: center;
  align-items: center;
  color: white;
}

在你的 Controller 中你可以调用这个函数:

$scope.myRegisterFunction = function() {
  // do the registration stuff
}