我的网站显示不正确，即使源代码是一样的？

提问者：小点点

我的网站显示不正确，即使源代码是一样的？

我用html和css写了一些代码来给我的网站添加导航栏。代码显然可以从我的本地硬盘驱动器运行，如图所示。然而，当我把这段代码上传到我的aws ec2中时，导航栏看起来并不一样。为什么会出现这种情况，我该如何修复它？

我的硬盘上的网站

网站联机

null

@font-face {
    src: url(fonts/CoveredByYourGrace-Regular.ttf);
    font-family: grace;
}
body{
    margin: 0px;
}
header {
    background:   #6666ff;
    padding: 5px 10px 0px 30px; 
}
header h1 {
    display: inline;
    font-size: 35px;
    font-family: grace;
}
nav ul {    
    display: inline;
    margin: 0px;
    padding: 0 0 0 40px;
}
nav ul li{
    display: inline-block;
    background: #ffe6cc;
    list-style-type: none;
    padding: 10px 20px;
    font-weight: bold;
}


body {
    background: #ccccff;
    font-family: arial;
    margin: 0px
}
h1 {
    color: #000033;
}
p {
    color: #000;
}



.Welcome {
    font-family: Stencil, fantasy;
    color: #000;
    font-size: 50px;
    padding-top: 10px;
    padding-left: 512px;


} 
.style2 {
    color: #000;
    font-size:22px;
}
.style1 {
    color: #000;
    font-size: 45px;
    font-family: grace;
}
.style3 {
    padding-left: 200px;
}


colors
    white: ffe6cc
    navy: 000033

<!DOCTYPE html>
<html>
    <head>
        <title>Tom's Book</title>
        <link rel="stylesheet" type="text/css" href="main.css">
    </head>

    <body>
        <header>
            <nav>
            <h1> WWW.TOMOO.COM </h1>
                <ul>
                    <li>Home</li>
                    <li><a href="Page2.html">poetry</a></li>
                    <li><a href="page3.html">TBD</a></li>
                </ul>
            </nav>
        </header>
        
        <h1 class="Welcome"><U> WELCOME</h1></U>
        <p class="style3">
            You are now in MY hood, here you can read the latest thoughts I'm vibing with!  
        </p>
            <h2 class=style1><u> About</u></h2> 
        <p>
            <strong class="style2">Age:</strong> 24
            <br> <strong class="style2">Style:</strong> K-STYLE!
            <br> <strong class="style2">games:</strong> Dota2, Tekken7, Valorant
            <br> <strong class="style2">likes:</strong> KPOP, Poetry, Dave Chappelle, 
            <br> <strong class="style2">zodiac:</strong> WEEEB
            <br> <strong class="style2">Philosophy:</strong> LEWD-WIG. 
            <br> <strong class="style2">Books:</strong> READ! 


        <h2 class=style1><u>
            Links
        </h2></u>
                <ul>
                    <li>Home</li>
                    <li><a href="Page2.html">poetry</a></li>
                    <li><a href="page3.html">TBD</a></li>
                </ul>       
            
        <h2 class=style1><u>
            THE RULES
        </h2></u>
        <ul>
            <li> you DO NOT speak about Tom Club</li>
            <li> you DO NOT speak about Tom Club</li> 
            <li> IF you speak about Tom Club YOU WILL BE NAMED AND SHAMED. </li>
        </ul>
        <p>
            Kawaii :)
        </p>
        
        <pre>
            　　　　　　　__＿__ 
 　　　　　　　　　　　　　　　　　　　´ : : : : : : : : ｀丶、 
 　　　　　 　 　 　 　 　 　 　 ／ : : : : : : : : : : : : : : : :＼ 
 　　　　　　　　　　　　　　／: : : : : : : : : : : : : : : : : : : : :ヽ 
 　　　　　　　　　　　 _｢∨ : : : : : : : : : : /{∠Ζ＼: : : : : : :, 
 　　 　 　 　 　 　 ／: :V.: : : : : : : : : .:∨　　　　＿＼ : : : : :, 
 　　　　 　 　 　 /ノ⌒7: : : : :|.: : : : : .::|　　　´　＿,,ハ: : : :ハ. 
 .　　　　　 　 　 | ＼__ : : : : 八 : : : : l八　　　 ｲf笊＾Yﾚ|: : : :j:＼ 
 　 　 　 　 　 　 | : :〈_|: : : : : ::{＼ : 八　＼　 　 乂_ツ　|/| :/| : : ＼ 
 　　　　 　 　 　 | : : 八|: : : ::八 　>､__＞　　　　　　:::::.: 丿Ⅵ: | : |ハ 
 　　　　　　　 　 | : : : 八: : : : : ∨　イf笊^　　　、　　 　 　 }:|: | : |／￣￣＼ 
 　　　　　　　 　 | : : : : :∧ : : : 人 ﾍ{ 乂_ツ　　　 　 /　　 ∧:.ﾉ:_/::::::::::::::::::::::-_ 
 　　　　　　　 　 | : |: : :　│: : : : : ＞ 　 :.:::::　　 ｰ　　　　/　/]:::::::::::::::::::::::::::::::::-_ 
 　　　　　　　 　 | : | : :| 　|│ : : : : (⌒丶、　　 　 　 　 ｲ／ /|::〈:::::::::::::::::::::::::::::::-_ 
 　　　　　　　 　 | : | : :| 　|人j: : : : :个ー: ｀''￢冖Ｔi:｢＼|＞ ﾞ┴/::::: |::::::::::::::::::::::::::-_ 
 　　　　　　　 　 | : | : :| 　 　 | : : : : : : : : : :＞‐=ﾆ广＞｛] ⌒∨￢:八::::::::::::::::::::::::::::-_ 
 　　　　　　　　　∨|: 八　　　| : : : : : : : : 〃:::::::::::{_/　　j|　　/::::/==:::＼{:::::::::::::::::::::::-_ 
 　　　　　　　　 　 人{　　　　八|: : : : : : : {{:::::::::::: 〈＼　八__/::::/::::::::::::: ∧:::::::::::::::::::::::-_ 
 　　　　　　　　 　 　 　 　 ／ :八: : : : : : : ∨::::＼〈::::::く.│/::::/:::::::::::::::::: ∧::::::::::::::::::::::::-_ 
 　　　　　　　　　　　　　　　　　　＼ : 卜､: :∨:::::::: ＼ ::＼|:::/:::::::::::::::::::::::::∧::::::::::::::::::::::::-_ 
 　　　　　　 　 　 　 　 　 　 　 　 　 ＼|　　ｰﾍ/:::::::|:::::::::::_∨ :::::::::::::::::::::::::: ∧::::::::::::::::::::::::-_ 
 　　　　　　　　　　　　 　 　 　 　 　 　 ＼.　　 ＼:八:::::::::（入 :::::::::::::::::::::::::::: ∧::::::::::::::::::::::::-_ 
 　　　　　　　　　　　　　　　　　　　　　　　　　　　∨:＼::::: ＿＼::::::::::::::::::::::::_ノ⌒^::::::::::::::::::::-_ 
 　　　　　　　　　　　　　　　　　　　__　　__rァ^ア＾''ー--＜＼:::::::￣￣￣￣::::::::::::::::::::::＼:::::::::-_ 
 　　　　　　　　　　　　　　　　　　r｢ {＞┴┴'┴'^ｰ=ﾆ二..,,＼＼:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::丿 
 　　　　　　　　　　　　　　 　 　 ｢|_y'　　　　　　　　　　　　　¨''￢ﾆ()()::::::::::::::::＿＿;;::二ﾆ=-く 
 　　　　　　　　　　　　　　　　 ／ 7　　　　　　　　　　　　　　　　　 ｀`''＜｢＼:::::└───::::::::＼ 
 　　　　　　　　　　　　　　　 　 　 {　　　　　　　 ＼_　　　　　　　　　　　　∨＾￣＼::::::::::::::::::::::::::∧ 
 　　　　　　　　　　　　　　　 {　　　　　　　　　　　　｀丶､　 　 　 　 　 　 　 ∨ﾆﾆ| |＼:::::::::::::::::::::::::廴___ 
 　　　　　　　　　　 　 　 　 八　　　`　、　　　　　　 　 　 　 　 　 　 　 　 　 ∨ﾆ.| |ﾆ. ＼:::::::::::::::::::::::::::::: 
 　　　　　　　　　　　　　　　　　　　　　 ＼　　　　　　　　　　｀ヽ　　　　　　　 ＼ | |ﾆﾆﾆ ＼:::::::::::::::::::::::: 
 　　　　 　 　 　 　 　 　 　 　 　 ＼　　　　＼　　　　　　　　　/∧　　　　　　　　〈〈＼＼ ﾆﾆ>､＿＿,／ 
 　　　　　　　　　　　　　 　 　 　 　 ヽ.　　　　＼　　　　 　 ／//∧　　　 　 　 　 ∨/ ＼＼／／＼/＿_ 
        </pre>


    

        <img src="https://upload.wikimedia.org/wikipedia/commons/c/c4/IU_at_%22Persona%22_press_conference%2C_27_March_2019_02.jpg"><br>
    </body>

</html>

null

共2个答案

匿名用户

尝试指定文件的完整路径ie看起来需要明确指定CSS文件的路径。

匿名用户

我玩了一下您的源代码，我认为问题在于您的src url没有指向web上可以获得的字体版本（当您从硬盘上运行该字体时，网站使用的是您的本地版本）。当你在ec2上有字体的时候，试着上传一个字体的副本到你网站上的一个目录中，并把它的url放到你以前有“fonts/coveredbyyourgrace-regular.ttf”的括号中。

我的网站显示不正确，即使源代码是一样的？

共2个答案

相关问题

热门标签

我的网站显示不正确，即使源代码是一样的？

共2个答案

相关问题

热门标签

微信关注