html - 如何让我的菜单栏居中并一直延伸？-6ren

html - 如何让我的菜单栏居中并一直延伸？

转载作者：行者123 更新时间：2023-11-28 08:00:22

25

4

好吧，我在这里尝试了很多不同的方法，但我似乎无法让我的菜单栏一直延伸到整个页面。左边有个小缺口。我只是在这里遗漏了什么吗？

此外，到目前为止，这是我能够使页脚稍微居中于页面底部的唯一方法。每次我将左右边距设置为自动时，它都会使页脚与菜单栏对齐。还有更好的方法吗？

谢谢。

<!DOCTYPE html>

<html>
<head>
    <title>Connor Lepert: Homepage</title>
    <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8">
    <link rel="icon" href="logo.png">
        <style>
            @font-face {
              font-family: Vanadine; 
              src: url(vanadine.ttf);
            }

            body {
              background-image: url(bckgrnd.jpg); 
              background-size: 100%; 
              background-repeat: no-repeat; 
              font-family: sans-serif; 
              color: white;
            }

            a {
              color: white; 
              font-family: Vanadine; 
              text-decoration: none;
            }

            a:hover {
              color: yellow;
            }

            p {
              color: white; 
              font-family: Vanadine;
            }

            footer {
              position: fixed; 
              display: block; 
              margin-left: 45%; 
              margin-right: 45%; 
              text-align: center; 
              margin-top: 320px;
            }

            #siteid {
              margin-left: auto; 
              margin-top: auto
            }

            #menubar {
              background-color: #ABADB0; 
              width: 100%; 
              height: 20px; 
              display: block; 
              margin-left: auto; 
              margin-right: auto; 
              margin-top: auto; 
              text-align: center; 
              word-spacing: 20px; 
              position: fixed; 
            }

            #header {
              display: block; 
              margin-left:auto; 
              margin-right: auto; 
              text-align: center; 
              margin-top: 330px;
            }
        </style>
</head>

<body>
        <div id="siteid"><img src="logowhite.png" width="50px" alt="Personal logo"/></div>
        <div id="header"><img src="header.png" width="400" alt="Lepert"/></div>
        <div id="menubar">
            <a href="index.html">Home</a>
            <a href="aboutme.html">About</a>
            <a href=mailto:clepert13@gmail.com>Contact</a>
            <a href="portfolio.html">Portfolio</a>
            <a href="scrapyard.html">ScrapYard</a>
        </div>

    <footer>©<a href=> 2015 by Connor Lepert </a> <br> <p></p> </footer>  
</body>
</html>

最佳答案

你必须在你的正文中添加一个 margin:0

关于html - 如何让我的菜单栏居中并一直延伸？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29807825/

25

4

0

文章推荐： c++ - 另一个 OpenCV/cvBlob 和架构问题

文章推荐： c++ - 二叉树形成错误

Android:收听语音命令(一直)
我有一个在 Android 市场上相当流行的应用程序，它允许数以万计的用户按下一个按钮并向它发出语音命令。然后我就可以做很多不同的事情，比如给他们提供当前的天气预报等等...... 无论如何，我的应用
html - 页面一直延伸……一直……一直延伸
令人惊讶的是，标题基本上解释了它。我们有一个我们的客户制作的页面，我们正在重新创建该页面。页面高度会一直增加，直到(我假设是这样)浏览器达到它的极限。我已经尝试过 Firebug 和 W3 验证器，
android - 一直 react native 空屏幕
我是 react-native 的新手，试图创建我自己的组件，但它一直显示一个空屏幕。这是我的组件代码 class BoxComponent extends Component { cons
css - 为网站创建一个简单的标题 - 为什么我不能让 img 一直 float ？
我正在为我的 PHP 元素创建一个非常简单的博客，但遇到了一个简单的问题。我无法让我的页眉图像一直 float 。我有一个横幅，左边有一些文字，我有一个 1px 的切片，在可以选择的任何分辨率的宽度上
ruby-on-rails - 为什么所有 Rails 助手都可用于所有 View ，一直？有没有办法禁用它？
为什么我可以在另一个 Controller 的 View 中访问一个 Controller 的辅助方法？有没有办法在不破解/修补 Rails 的情况下禁用它？最佳答案 @George Schreib
android - Eclipse 'Loading data for Android 4.4.2' 一直
我正在使用带有最新 ADT 插件的 Eclipse Kepler SP2。每隔一分钟 Eclipse 就会说“为 Android 4.4.2 加载数据”并阻止我想做的一切。我在不同的文件夹中有几个 E

首页

博学

6Ren·AI

商城

html - 如何让我的菜单栏居中并一直延伸？