要使用CSS控制页面中的底部导航效果，需要使用以下关键词和属性：
HTML结构：通常使用ul和li标签来创建底部导航栏的基本结构。
CSS选择器：可以使用类选择器、ID选择器或元素选择器来定位底部导航栏的位置。
display属性：使用display属性来定义导航栏的布局方式，例如flex或inline-block。
background属性：使用background属性来定义导航栏的背景颜色或背景图片。
color属性：使用color属性来定义导航栏中链接的文本颜色。
text-decoration属性：使用text-decoration属性来定义链接的下划线或其他修饰效果。
padding和margin属性：使用padding和margin属性来调整导航栏的内边距和外边距。
示例代码如下：
<nav class="footer-nav">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">产品</a></li>
<li><a href="#">服务</a></li>
<li><a href="#">关于我们</a></li>
</ul>
</nav>.footer-nav {
display: flex;
justify-content: space-between;
background: #333;
color: #fff;
padding: 10px;
}
.footer-nav ul {
display: flex;
list-style: none;
margin: 0;
padding: 0;
}
.footer-nav li {
margin-right: 20px;
}
.footer-nav li:last-child {
margin-right: 0;
}
.footer-nav a {
text-decoration: none;
color: #fff;
}
.footer-nav a:hover {
text-decoration: underline;
}上述代码使用flex布局方式创建了一个底部导航栏，背景颜色为#333，链接文本颜色为#fff。链接之间使用margin-right属性添加了20px的右边距，最后一个链接取消了右边距。鼠标悬停链接时，下划线将显示在文本下方。