📌  相关文章
📜  离子-页脚

📅  最后修改于: 2020-12-08 04:57:17             🧑  作者: Mango

离子页脚位于应用程序屏幕的底部。使用页脚几乎与使用页眉相同。

添加页脚

离子页脚的主要类是bar (与页眉相同)。如果要在屏幕上添加页脚，则需要在主bar类之后将bar-footer类添加到元素。由于我们想在应用程序的每个屏幕上使用页脚，因此我们将其添加到index.html文件的正文中。我们还将为页脚添加标题。


   
Footer

上面的代码将产生以下屏幕-

离子页脚

页脚颜色

如果要设置页脚样式，只需向其添加适当的颜色类。在为元素设置样式时，需要将主元素类添加为颜色类的前缀。由于我们正在设置页脚栏的样式，因此前缀类将是栏，并且在此示例中要使用的颜色类是断言的(红色)。


   
Footer

上面的代码将产生以下屏幕-

离子页脚颜色

您可以使用以下九个类别中的任何一个为您的应用页脚提供选择的颜色-

Color Class Description Result
bar-light To be used for white color  
bar-stable To be used for light grey color  
bar-positive To be used for blue color  
bar-calm To be used for light blue color  
bar-balanced To be used for green color  
bar-energized To be used for yellow color  
bar-assertive To be used for red color  
bar-royal To be used for violet color  
bar-dark To be used for black color  

页脚元素

页脚中可以包含元素。大多数时候，您需要在页脚内添加带有图标的按钮。

添加的第一个按钮将始终位于左上角。最后一个将放置在右侧。中间的按钮将分组在页脚左侧的第一个按钮旁边。在下面的示例中，您还可以注意到我们使用图标类在按钮顶部添加图标。

上面的代码将产生以下屏幕-

离子页脚图标

如果要向右移动按钮，可以添加向右拉类。

上面的代码将产生以下屏幕-

离子页脚图标