0

我正在开发 Joomla!模板,我有我的索引和我的 template.css

当我将所有设计留在 css 中时,它似乎只加载有关 css 类的那些部分并且不做任何其他事情,所以最终我必须将其他所有内容写入 de index.php,这很愚蠢,因为我不应该这样做。

例如,这是我想要的 index.php 代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >  
<head>  
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/posgradostemplate/css/template.css" type="text/css" /> 
<jdoc:include type="head" />  
</head>  
<body>  
<div id="wrapper">  
    <div id="content">  
      <div class="mainmenu"> 
          <jdoc:include type="modules" name="mainmenu" />          
      </div>  
  </div>  
</div>  
</body>  
</html>  

但是包装器和内容的行为不符合预期,并且没有显示背景。这是我的 css 文件:

html {

/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #E6E6E6 0%, #858585 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #E6E6E6 0%, #858585 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #E6E6E6 0%, #858585 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #E6E6E6), color-stop(1, #858585));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #E6E6E6 0%, #858585 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #E6E6E6 0%, #858585 100%);
 margin: 0;
  padding: 0;
  border: 0;
}

html, body {
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    margin: 0;
}


.mainmenu ul {
    font-family: Arial, Verdana;
    font-size: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.mainmenu ul li {
    display: block;
    position: relative;
    float: left;
}
.mainmenu li ul {
    display: none;
}
.mainmenu ul li a {
    display: block;
    text-decoration: none;
    color: #ffffff;
    border-top: 1px solid #000000;
    padding: 5px 15px 5px 15px;
    background: #000000;
    margin-left: 1px;
    white-space: nowrap;
}
.mainmenu li:hover li a:hover {
    background: #FFFF00;
    color: #FF0000;
}
.mainmenu ul li a:hover {
    background: #000000;
    color: #FFFF00;
}
.mainmenu li:hover ul {
    display: block;
    position: absolute; 
}
.mainmenu li:hover li {
    background: #FFFF00;
    float: none;
    font-size: 11px;
    color : #000000;
}
.mainmenu li:hover a { 
    background:  #FFFF00;
    color : #000000;
}


#wrapper{
  width: 100%;
  text-align: center;
}

#content{
    display: inline-block;

}

除 mainmenu 之外的所有内容都无法按照 css 的指示工作。我在想它没有被正确加载,我希望它被急切地加载,以便将所有内容都牢记在心。现在它只有在我在索引中添加 css 代码时才有效,而且不应该那样。建议?

4

1 回答 1

0

尝试使用以下内容加载 CSS 文件:

$document = JFactory::getDocument();
$document->addStyleSheet(JURI::root() . "templates/posgradostemplate/css/template.css");
于 2013-01-24T08:14:59.060 回答