html - 中心导航栏链接
问题描述
我似乎无法将导航栏按钮居中。有没有办法在css文件中做到这一点?我尝试过居中,但没有奏效。
HTML
<div class="navbar">
<a href="#home">Home</a>
<a href="#news">News</a>
<a href="#contact">Contact</a>
</div>
CSS
.navbar {
overflow: hidden;
background-color: #333;
position: fixed; /* Set the navbar to fixed position */
top: 0; /* Position the navbar at the top of the page */
width: 1300px; /* Full width */
z-index: 99999;
text-align: center;
}
/* Links inside the navbar */
.navbar a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change background on mouse-over */
.navbar a:hover {
background: #ddd;
color: black;
}
解决方案
/* Links inside the navbar */
.navbar a {
display:inline-block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
我已经修改了“.navbar a”的样式。希望它对你有用。
推荐阅读
- android - CameraX 中的对齐线
- php - 注册后,我的登录页面没有验证用户名和密码
- oracle - Oracle 错误:值大于该列允许的指定精度
- bpf - BPF crc32 奇怪的错误:最后一个 insn 不是退出或跳转
- node.js - Nodejs API 在 localhost 中回复 JSON,但相同的 API 调用,在部署 heroku 时回复空 JSON
- firebase-dynamic-links - Firebase 动态链接可以用于通用应用邀请和特定页面邀请以跟踪推荐吗?
- c# - 使用范围运算符给出错误预定义类型“System.range”未定义或导入
- ethereum - 使用数组中数百个预填充结构创建 Solidity 合约的 Gas 问题
- python - 如何导出 csv 或文本文件中的所有链接?
- c# - 将项目转换为 NETSDK 格式后表单中的资源异常