Question

我在Mac机器上的NetBeans IDE ver 8.0.2中创建了一个HTML文件和一个外部引用的CSS文件。

虽然它在桌面上编码，但在将它们上传到我的托管服务提供商的public_html文件夹时，样式只会部分应用。

例如，名为“logo1”的内部容器没有右对齐。

PS： 我知道我在下面粘贴的代码会导致内部容器中的文本溢出。请不要分心。

我的HTML代码如下：

    <!DOCTYPE html>
    <!-- Home Page for Project 01 -->
    <html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title> Project 01 - Key to your Technological Superiority </title>
        <link rel="stylesheet" type="text/css" href="commonstyles.css" />
    </head>

    <body>
        <div class="container1">
            <div class="logo1">
            <!-- &#0169 is the code for the Copyright symbol -->
                <h1> Project 01 <sup>&#0169</sup></h1>    
            </div>
            <div class="footer1">
                <b> BIGGER BRIGHTER BETTER</b>
            </div>
        </div>
    </body>
    </html>

我的CSS代码如下：

div.container1 {
    position:relative;
    top: 0;
    left: 0;
    width: 600px;
    height: 100px;
    background-color: rgba(255,255,255,0.0);
    border: none;
}

div.logo1 {
    position:absolute;
    top: 10px;
    right: 0;
    width: 300px;
    height: 45px;
    background-color: rgba(57,29,75,1.0);
    color: white;
    text-align: center;
    font-family: Arial;                  
}

div.footer1 {
    position:absolute;
    top: 60px;
    left: 150px;
    font: Times New Roman;
    font-variant: all-small-caps;
}

Answer 1

CSS文件是否正确加载，即您是否检查了路径？在这个小提琴中，代码似乎有效。

div.logo1 {
    position:absolute;
    top: 10px;
    right: 0;
    width: 300px;
    height: 45px;
    background-color: rgba(57,29,75,1.0);
    color: white;
    text-align: center;
    font-family: Arial;                  
}

https://jsfiddle.net/1eyqtm18/

外部CSS无法在Webhost提供程序中运行

1 个答案: