Question

所以我的所有代码都是我对网页设计的新手，所以我可能犯了一些错误。问题是，当我加载about me页面时，导航的字体大小更小。我试过寻找一些但对我来说没有意义的东西。你能帮我吗？我之前从未在这里发帖子，所以如果代码看起来很乱，请原谅。

Page 1

    <head>
        <link rel="stylesheet" style="text/css" href="main.css" />
    </head>

    <body>
        <header>
            <nav>
                <ul>
                    <li> <a href="index.html">Gallery</a> </li><!-- commenting out white space caused by display: inline-block 
                    --><li> <a href="about_me.html">About Me</a> </li><!--
                    --><li> <a href="#">Contact</a> </li>
                </ul>
            </nav>
        </header>
    </body>

第2页

    <head>
        <link rel="stylesheet" style="text/css" href="main.css" />
    </head>

    <body>
        <header>
            <nav>
                <ul>
                    <li> <a href="index.html">Gallery</a> </li><!-- commenting out white space caused by display: inline-block 
                    --><li> <a href="about_me.html">About Me</a> </li><!--
                    --><li> <a href="#">Contact</a> </li>
                </ul>
            </nav>
        </header>
    </body>

CSS

*{
    margin: 0px;
    padding: 0px;
}

html{
    height: 100%;
    width: 100%;
}

body{
    background-color: #fff;
    height: 100%;
    width: 100%;
}

hr{
    width: 90%;
    margin: 2% auto; 
}

header{
    margin: 0 auto;
    width: 90%;
    height: 14%;
    background-color: #ddd;
    position: relative;
}

nav{
    float: left;
    width: 40%;
    /*background-color: green;*/
    position: absolute;
    left: 30%;
    bottom: 0px;
}

nav ul{
    text-align: center;
    width: 100%;
}

nav ul li{
    list-style-type: none;
    display: inline-block;
    width: 28%;
    margin: 0 1%;
}

nav ul li a{
    text-decoration: none;
    /*background-color: #aaa;*/
    display: block;
    width: 100%;
    font-size: 1.4em;
    color: #000;
}

nav ul li a:link{
    background-color: #aaa;
}

nav ul li a:hover{
    background-color: #ff5588;
}

nav ul li a:active{
    background-color: red;
}

具有相同css文件呈现的新页面，具有不同的字体大小

0 个答案: