2016-09-17 56 views
1

我试图在我正在建设的joomla网站上对图像进行居中。这是一个放置在标题中的徽标。这是一个链接到网站​​(上面的logo.png是我正在谈论的)。我尝试了一些不同的东西,但是我的尝试要么没有做任何事情,要么与顶层菜单的显示混淆。我在这里阅读了关于将边距设置为自动并将位置设置为相对等的内容,但它不起作用,或者我可能会将它添加到错误的位置。以joomla为中心的图像

以下是与徽标有关的index.php文件部分。我根本不是一个编码器,只是稍微知道我在做什么,所以非常感谢描述性回复。先谢谢您的帮助。

$logopath = $this->baseurl . '/templates/' . $this->template . '/images/logo.png'; 
 
$logo = $this->params->get('logo', $logopath); 
 
$logoimage = $this->params->get('logoimage'); 
 

 
$sitetitle = $this->params->get('sitetitle'); 
 
$sitedescription = $this->params->get('sitedescription'); 
 

 

 

 

 
?> 
 
<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>"> 
 
<head> 
 
\t <jdoc:include type="head" /> 
 
\t <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" /> 
 
\t <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" /> 
 
\t <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type="text/css" /> 
 
\t <link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css' /> 
 
\t <script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/sfhover.js"></script> 
 

 
    
 
    
 

 
</head> 
 
<body> 
 

 
<div id="wrapper"> 
 

 
\t <!-- TopNav --> 
 
\t <?php if($this->countModules('position-13')): ?> 
 
\t <div id="topnav_wrap"> 
 
\t \t <div id="topnav"> 
 
\t \t \t <jdoc:include type="modules" name="position-13" style="xhtml" /> 
 
\t \t </div> 
 
\t </div> 
 
\t <?php endif; ?> 
 
\t 
 

 
\t <div id="header_wrap"> 
 
\t \t <div id="header"> 
 

 
\t \t \t <!-- Logo --> 
 
\t \t \t <div id="logo"> 
 

 
\t \t \t <?php if ($logo && $logoimage == 1): ?> 
 
\t \t \t \t <a href="<?php echo $this->baseurl ?>"><img src="<?php echo htmlspecialchars($logo); ?>" alt="<?php echo $sitename; ?>" /></a> 
 
\t \t \t <?php endif; ?> 
 
\t \t \t <?php if (!$logo || $logoimage == 0): ?> 
 

 
\t \t \t \t <?php if ($sitetitle): ?> 
 
\t \t \t \t \t <a href="<?php echo $this->baseurl ?>"><?php echo htmlspecialchars($sitetitle); ?></a><br/> 
 
\t \t \t \t <?php endif; ?> 
 

 
\t \t \t \t <?php if ($sitedescription): ?> 
 
\t \t \t \t \t <div class="sitedescription"><?php echo htmlspecialchars($sitedescription); ?></div> 
 
\t \t \t \t <?php endif; ?> 
 

 
\t \t \t <?php endif; ?> 
 

 
\t \t \t </div> 
 

 
\t \t \t <!-- Topmenu --> 
 
\t \t \t <div id="topmenu"> 
 
\t \t \t \t <jdoc:include type="modules" name="position-1" /> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div>

这里是CSS http://www.gothamtattoos.com/mmp_upgrade/templates/jaxstorm-black/css/template.css

回答

0

要使图像居中,只需调整一些CSS。

#logo { 
    float:none; 
} 
#logo img { 
    display:block; 
    margin:0 auto; 
} 
+0

谢谢李,我明白这一点。它工作完美。我知道它必须是简单的,但我一直在搞砸它。 – nyartman

0

您设置的标志作为背景,尝试将其设置为IMG

<div id="leftcol"> 
<div class="leftpadding"> 

<div class="logo_container">   
    <h1 class="logo"> <a href="/index.php" title=""> 
     <span> 
     <img src="your_logo_url" alt="logo" /> 
     </span> 
    </a> </h1> 
    </div> 

    <div class="moduletable"> 

    </div> 
</div>