样式表没有显示在div id选项卡中?

时间:2015-09-21 07:33:34

标签: html css stylesheet

这是我网页上的代码,我试图让我的样式表上写着"您好!"在TAB1上显示,但它不显示。在TAB1中从Pastebin显示样式表需要进行哪些更改?我过去能做到这一点,但现在我不确定我在这里做错了什么。

我的WEBPAGE非常有限,所以我必须使用Pastebin将我的所有写作放入我的页面,因为我只剩下另外2000-2200个字符,我可以使用,这绝对只够编码,而不是我也会在每个标签上放置文字墙。

<style>

    body{
    color:#000000;
    font-size:13px;
    font-family:Ebrima;
    background-image: url() !important;
    background-color:#FFFFFF !important;
    background-position:bottom-center !important;
    background-repeat:repeat !important;}

    h1{
    margin:0px 0px 0px;
    font-size: 10px;
    color:#FF0000;
    font-family:Ebrima;
    letter-spacing:0px;
    font-weight:normal;
    text-shadow: 0px 0px 2px #880000;}

    b, strong { font-family: Ebrima; font-size: 12px;line-height: 10px; font-weight: bold;
    color: #FF5555;}

    i, em {color:#FF0000; font-family: Ebrima; font-size:12px;}

    #navi{
    display: inline;
    padding:40px;
    color:#444444;
    text-transform: uppercase;
    margin: 12px 10px;
    font-size: 15px;
    font-family:Garamond;
    background: #;
    transition: all .2s;
    -o-transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;}

    #navi:hover{
    color:#FF0000;
    cursor:hand;
    cursor:pointer;
    opacity: .80;
    font-size:14px;
    font-family:Garamond;
    filter:alpha(opacity=80);
    transition: all .2s;
    -o-transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;}

    #A{
    left:0px;
    width: 100%;
    top:15px;
    padding: 0px;
    text-align: center;
    position: fixed;
    height: 0px;
    background:url('http://i.imgur.com/TebRLUr.png');}

    #B{margin-top:150px;}

    #C{
    position:fixed;
    bottom:0px;
    left:20px;
    width:99%;
    height:70%;
    background-color:#;
    color:#ffffff;
    padding:0px;
    overflow:auto;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px; }

    ::-webkit-scrollbar {width: 6px; height: 4px; background: #; }
    ::-webkit-scrollbar-thumb { background-color: #222222; border: 1px solid #000000;-webkit-border-radius: 1ex; }


    #navi a{
    text-decoration:none;
    color:#666;}

    #navi a:hover{
    text-decoration:none;
    color:#666;}

    </style>



    <div id="A">
    <div id="B">
    <span id="navi" onclick="document.getElementById('start').innerHTML=document.getElementById('a').innerHTML;">TAB1</span>
    </div>
    </div>





    <div id="C">
    <div id="start">

<font color="#FF0000">This is the opening page!</font>

    </div>

    <div id="a" style="display:none;">

<font color="#FF0000">This is TAB1!</font>

<br>

<link rel="stylesheet" type="text/css" href="http://pastebin.com/raw.php?i=faJtrCxF">

<br>

<font color="#FF0000">The stylesheet will not display inside of this tab. Why?</font>


    </div>
</style>

2 个答案:

答案 0 :(得分:0)

#navi:after{
   content:"Hello";
}

正如你所提到的那样会起作用。

答案 1 :(得分:0)

问题与您的其他问题相同question Pastebin不会生成有效的CSS文件,而是生成文本文件。

以这种方式思考它。您的网站会从扩展名为.css的文件中解释您的样式 如果这个文件不是.css而是其他东西,它就不会起作用。

即使内部的内容是有效的CSS代码,Pastebin也不会将您的代码导出为.css。这样做的原因是他们提供的服务不是托管,而是一种共享代码片段的方式,这就是为什么他们只将您在那里创建的内容导出为文本文件。

使用Pastebin无法实现您的目标。

将css托管在其他地方是否有特殊原因?除非您想使用CDN服务,否则通常不是一个好主意。

PD:不要使用<font>标记,这已被弃用。请改为使用<p><span><h#>的组合,并在需要特定样式时为其添加类。