放在远程服务器上时,CSS文件不起作用

时间:2017-08-30 00:29:53

标签: html css

我将HTML代码链接到服务器上后,无法将我的HTML代码链接到我的CSS代码。 CSS文件和HTML文件都位于服务器上的同一目录中。我想要注意的是,我试图清除浏览器缓存并使用不同的浏览器,似乎没有任何工作。

这是我的HTML代码

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8" />
        <base href="http://people.rit.edu/~username/rop/" target="_blank">
        <title> My ROP Home Page </title>
        <link href= "style.css" type="text/css" rel="stylesheet">
    </head>
    <body>
        <div class = "things">
                <h1> All About Me </h2>
            <div id = "activities">
                <h2> I'm a fan of video games </h2>
                    <p> As the title suggests, I love to play video games.  I have been playing video games since I was 8 years old.  I started with a Nintendo 64 and have since then begged my parents for every new system to date (obviously that wont work anymore).
                        This hobby is part of the reason I wish to become a web developer.  When I was young, I spent time browising websites like IGN, and thought that one day I could make something like that.  Now I set my sights a little higher, seeing as I want to be able to develope professional websites.
                    </p>
                <h2> My Favorite Food is Pizza ( I Can't get enough!) </h2>
                    <p> Seriously, I could have Pizza everyday of the week and not get sick of it.  I like all kinds of toppings except pineapple.  I must have pizza at least once a week no matter how unhealthy that may be.  Of course, local buisnesses make better pizza then large chains.
                    </p>
                <h2> I am a SOIS student focusing on Web Development and other IT centered courses</h2>
                    <p> SOIS is the School of Individualized Study.  Basically I create a major that is more in line with what I want to get out of R.I.T.  Students of SOIS must pick two specializations in order to create a degree.  Other than that, it is just like other degrees at R.I.T with many of the same requirments.
                        For example, I specialize in Web Development (front-end) and some networking.
                    </p>
                <h2> I'm a Big Fan of cheesey monster movies </h2>
                <p> For reasons unknown, I have been drawn to old Godzilla movies that clearly have not aged well.  I think it's neat to see how they made those films without cgi or technology.  Seeing the behind the scenes of the mini cities is always a neat experience for film fans.
                </p>
            </div>
        </div>
        <div id = "brian">
        <img src ="brian.jpg" alt="brian" style="width:304px;height:228px;">
        </div>
    </body>

</html>

CSS代码

h1, h2, p{
    background-color: #100733;
}
title {
    font-family: Helvetica, Arial, sans-serif;
    text-align: center;
    text-transform: uppercase;
}

.things     {
    color: white;
    font-size: 18px;
}
#brian {
    float: right;
}
#activities {
    font-size: 18px;
    text-align: left;
}

p {
    background-color: #100733;
    color: white;
}

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:1)

您是否忘记了第一行(Doctype)中的开头<

设为<!DOCTYPE html>并确保您的style.css文件与索引文件位于同一目录中。

编辑:

  

未找到

     

在此服务器上找不到请求的URL / ~username / rop /。

     

People.rit.edu端口443上的Apache服务器

因为base标记,它无效。您确定提供的位置有效吗?当我打开https://people.rit.edu/~username/rop/时,它会给出443。

编辑2:

变化:

<base href="http://people.rit.edu/~bxa9985/rop/" target="_blank">

要:

<base href="https://people.rit.edu/~bxa9985/rop/" target="_blank">

答案 1 :(得分:1)

首先

确保您可以使用浏览器访问css文件。

如果你的网址是example.com,并且你访问了你的html文件example.com/index.html,那么请确保在输入example.com/style.css时可以看到css

如果您通过ftp上传文件,可能是您没有在服务器中设置权限。

其他注意事项

  

确保您拥有第一个空缺角色<

见这个

   !DOCTYPE HTML>

应该是这样的

<!DOCTYPE HTML>
  

在等号(=)之后和之前取出空格

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

应该是这样的

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