如何创建:底部导航
学习如何使用 CSS 创建底部导航菜单。
创建底部导航菜单
第一步 - 添加 HTML:
第二步 - 添加 CSS:
/* 将导航栏放在页面底部,并使其固定 */ .navbar { background-color: #333; overflow: hidden; position: fixed; bottom: 0; width: 100%; } /* 设置导航栏中链接的样式 */ .navbar a { float: left; display: block; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none; font-size: 17px; } /* Chenge rangiaji ya kikabla kwa wakati wa kuzingatia kikabla */ .navbar a:hover { background-color: #ddd; color: black; } /* Kuongeza rangiaji ya rangi kwa kikabla au kiwango cha kuzingatia kiwango cha rangi */ .navbar a.active { background-color: #04AA6D; color: white; }
相关页面
教程:CSS 导航栏
教程:如何创建响应式底部导航