导航栏样式
Coddy 底部导航栏:HTML/CSS 项目 课程的第 9 课,共 12 课。
我们来设置导航栏的样式吧!
挑战
简单目标类“navigation”:
设置位置:
a. 将 position 设置为
absolute。b. 将 bottom 设置为
32px。c. 将 border-radius 设置为
24px。d. 将 left 位置设置为
50%。添加以下过渡样式:
transform: translate(-50%, 0);- 将 background-color 设置为你喜欢的任意颜色!(建议使用:
purple)
亲手试试
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- 在这里编写 HTML 代码 -->
<script src="script.js"></script>
</body>
</html>底部导航栏:HTML/CSS 项目中的所有课
自己练习: Web 在线编辑器