Question

我正在从头开始制作wordpress模板。我已经删除了许多文件并保留在header.php，footer.php，index.php和style.css中，以排除我的许多潜在问题。

我玩过代码，查找问题，搜索我的解决方案，但我不确定为什么我的风格在我访问我的网站时没被识别

以下是我的4个文件：

的style.css

/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/* MAIN STYLE */

html {
    font-size: 20px;
}

body {

}

#bodywrapper {
    background:     gray;
    font-family:    arial, sans-serif;
    font-size:      5em;
}

header {
    height:20em;

    background: #000;
    color: #fff;
    margin: 0 auto;
}

#nav {

}
#nav ul {
    list-style-type:    none;
}
#nav ul li {
    display:    inline-block;
    padding:    1em;
}
#nav ul li a{
    padding:    1em;
    text-align: center;
    text-decoration:none;
}
#nav ul li a div{
    height:     5em;
    width:      auto;
    padding:    1em;
    background-color: black;
}

#sandwichwrapper {
    margin: 2em;
    border: 1em solid black;
}

#sidebar {
    float:  right;
    width:  15em;
    margin: 2em;
    border: 1em solid green;
}

#main {
    float:  right;
    width:  15em;
    margin: 2em;
    border: 1em solid blue;
}

#comments{
    clear:  both;
    margin: 2em;
    border: 1em solid yellow;
}

#comment-form{

}

footer {
    clear:      both;
    margin:     0 auto;
    padding:    1em;
    background: #000;
    color:      #fff;
}





/* BUNDLED STYLES */

 header, footer{
    width:100%;
    margin:0 auto;
    padding: 5em;
    overflow:auto;
}

nav #sandwich {
    width:  50em;    
}





/* TEXT RULES */
h1 {
    size:   10em;
    color:  green;
}
h2 {
    size:   8em;
}
h3 {
    size:   6em;
}
h4 {
    size:   4em;
}
h5 {
    size:   2em;
}

的header.php

<!doctype html>
<html>
    <head>

        <title>The Logic Spot</title>
        <link type="text/css" rel="stylesheet" href="style.css" />
        <meta charset="utf-8" />
        <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
        header("Content-type: text/css");

    </head>    
    <body>        

    <div id="bodywrapper">

        <header>
            <h1><a href="<?php echo home_url('/')?>"><?php bloginfo('name')?></a></h1>
        </header>

        <div id="nav">
            <?php wp_nav_menu();?>
        </div>

        <div id="sandwichwrapper">

的index.php

<?php get_header()?>
<!--div#bodywrapper contained in header.php-->
<!--div#sandwich contained in header.php-->

<?php get_sidebar()?>

<div id="main">

    <?php while(have_posts()): the_post()?>

        <h2><a href="<?php the_permalink()?>"><?php the_title()?></a></h2>
        <p>By <?php echo get_the_author_link();?></p>
        <?php the_content(__('Continue Reading'))?>

    <?php endwhile?>

</div>

<!--div#sandwich contained in footer.php-->
<!--div#bodywrapper contained in header.php-->
<?php get_footer()?>

footer.php

        </div> <!-- close div#sandwichwrapper-->

        <footer>
            <?=date('Y')?> Copyright
        </footer>

    </div> <!-- close div#bodywrapper-->
    </body>
</html>

Answer 1

在<head>标记

中添加此行

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />

Answer 2

嘿，您需要指定样式表的绝对路径，例如

<link type="text/css" rel="stylesheet" href="http://www.yourwebsite.com/wp-content/themes/yourtheme/style.css" />

同样如Matt所述，您可以使用get_stylesheet_directory_url()或get_stylesheet_uri()等功能来提升您的路径。

为什么WordPress（.org）不识别我的CSS样式表？

2 个答案: