Html &引用；位置：固定"；引起问题_Html_Css

Html &引用；位置：固定"；引起问题

html css

Html &引用；位置：固定"；引起问题,html,css,Html,Css,我的位置有一些问题：已修复。以下是我的HTML代码： <!DOCTYPE html> <html> <head> <title>Horizontal Menus</title> <meta charset="utf-8"> <link type="text/css" rel="stylesheet" href="stylesheet.css"> </h

我的位置有一些问题：已修复。以下是我的HTML代码：

    <!DOCTYPE html>
    <html>
    <head>
    <title>Horizontal Menus</title>
    <meta charset="utf-8">
    <link type="text/css" rel="stylesheet" href="stylesheet.css">
    </head>
    <body>
    <nav role="navigation">
    <ul>
    <li><a class="button" href="">Home</a></li> 
    <li><a class="button" href="">Links</a></li> 
    <li><a class="button" href="">Forums</a></li> 
    <li><a class="button" href="">Contact</a></li> 
    </ul>
    </nav>

    <p>test</p>
    </body> 
    </html>

该站点显示为
有一个固定的位置，它显示为

没有固定的位置。我希望它像一个固定的位置一样工作，但我也希望保持导航蝙蝠以前的方式。任何帮助都将不胜感激：）

请添加

宽度：100%

或

左侧：0；右：0

正文{
保证金：0；
填充：0；
}
.按钮{
背景：#e7e7e7；
边框：1px实心；
边界半径：3px；
字体：700 1.2em Helvetica，Arial，衬线；
线高：28px；
填充：.4em.8em.4em.8em；
文本对齐：居中；
框大小：边框框；
}
保险商实验室{
填充：.5em；
列表样式类型：无；
文本对齐：居中；
背景颜色：绿色；
保证金：0；
位置：固定；
宽度：100%；
}
李{
显示：内联；
}
a{
颜色：红色；
}
a:悬停{
背景色：黑色；
颜色：白色；
}


水平菜单






试验

body {
    margin: 0;
    padding: 0;
    }
    .button {
    background: #e7e7e7;
    border: 1px solid;
    border-radius: 3px;
    font: 700 1.2em Helvetica,Arial,serif;
    line-height: 28px;
    padding: .4em .8em .4em .8em;
    text-align: center;
    box-sizing: border-box;

    }

    ul {
    padding: .5em;
    list-style-type: none;
    text-align: center;
    background-color: green;
    margin: 0;
    position: fixed;
    }

    li {
    display: inline;
    }

    a {
    color: red;
    }

    a:hover {
    background-color: black;
    color: white;
    }