如何在图像上放置导航菜单 |
您所在的位置:网站首页 › html中导航栏怎么做 › 如何在图像上放置导航菜单 |
.bg-img {
/* 使用的图像 */
background-image: url("img_nature.jpg"); min-height: 380px; /* 居中并很好地缩放图像 */ background-position: center; background-repeat: no-repeat; background-size: cover; /* 需要定位导航栏 */ position: relative;} /* 将导航栏容器定位在图像内 */ .container { position: absolute; margin: 20px; width: auto;} /* 导航栏 */ .topnav { overflow: hidden; background-color: #333;} /* 导航栏链接 */ .topnav a { float: left; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none; font-size: 17px;} .topnav a:hover { background-color: #ddd; color: black;} |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |