Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Trójobrazkowe tlo
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
Rabus_1
Mam problem z utworzeniem trzech teł - mianowicie jeśli wstawię w body, to z kolei nie mogę nic wstawić w body o id body_bg. Np. przy wstawieniu samego "center" do body_bg centruje pierwszą część tła. Przy wstawianiu w divy (logo1,2,3) to nie ma kompletnie nic...

Kod
/* CODE IS POETRY

--------------------------------------------------------- */

body{


    font-family: "Lucida Sans", Tahoma, Arial;

    font-size: 12px;

    color: #093f09;


}

#body_bg{


}

body.body_bg #logo1{
background-image: url(../images/top_bg3.png);
      
        background-repeat:repeat-x;

        background-position:0px 281px;


}

body#body_bg #logo2{
background-image: url(../images/top_bg2.png);
      
        background-repeat:repeat-x;

        background-position:0px 240px;
}


body#body_bg #logo3{

background-image: url(../images/logo1.png);
      
        background-repeat:repeat-x;

        background-position:0px 0px;
}


Kod
<?php
// no direct access
defined( '_JEXEC' ) or die( 'Restricted index access' );
define( 'YOURBASEPATH', dirname(__FILE__) );

$live_site                  = $mainframe->getCfg('live_site');
$template_path              = $this->baseurl . '/templates/' .  $this->template;
$show_flashheader           = ($this->params->get("showFlashheader", 1)  == 0)?"false":"true";
$show_logo                  = ($this->params->get("showLogo", 1)  == 0)?"false":"true";
$show_date                  = ($this->params->get("showDate", 1)  == 0)?"false":"true";
?>
<!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">
<head>
<jdoc:include type="head" />
<link rel="shortcut icon" href="<?php echo $this->baseurl; ?>/images/favicon.ico" />
<link href="<?php echo $this->baseurl ?>/templates/system/css/system.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $this->baseurl ?>/templates/system/css/general.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template?>/css/template_css.css" rel="stylesheet" type="text/css" />
</head>
<body id="body_bg">
<table width="998" align="center"  border="0"  cellpadding="0" cellspacing="0" id="maintable">
<div id="logo1">
<div id="logo2">
<div id="logo3">
<tr>
<td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="top_border_left"> </td>
<td class="top_border_bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2">
<div id="tophead">
<!-- BEGIN: LOGO -->
<?php if($show_logo == "true") : ?>
<div id="logo">
<a href="<?php echo $mosConfig_live_site;?>">
<img src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template?>/images/logo.png" alt="" />
</a>
</div>
<?php endif; ?>
<!-- END: LOGO -->
<!-- BEGIN: flashheader -->
<?php if($show_flashheader == "true") : ?>
<div id="ol-flashheader">
<a href="<?php echo $mosConfig_live_site;?>">
<img src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template?>/images/logo1.png" alt="" />
</a>
</div>
<?php endif; ?>
<!-- END: flashheader -->
</div>
</td>
</tr>
</table></td>
<td class="top_border_right"> </td>
</tr>
<tr>
<td class="sub_top_border_left"> </td>
<td class="sub_top_bg">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div id="topmenu">
<jdoc:include type="modules" name="user3" />
</div>
</td>
<td>
<!-- BEGIN: Date -->
<?php if($show_date == "true") : ?>
<div id="date">
<div align="right">
<?php $now = &JFactory::getDate(); echo $now->toFormat("%A, %d %b %Y"); ?>
</div>
</div>
<?php endif; ?>
<!-- END: Date -->
</td>
</tr>
</table>
</td>
<td class="sub_top_border_right"> </td>
</tr>
<tr>
<td class="maincontent_border_left"> </td>
<td class="maincontent">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<?php if( $this->countModules('left') ) {?>
<td valign="top" class="left_table">
<div id="left">
<jdoc:include type="modules" name="left" style="xhtml" />
</div>
</td>
<?php } ?>
<td valign="top" class="mainbody">

<table width="98%" border="0" align="center" cellpadding="4" cellspacing="0">
<tr>
<td>
<jdoc:include type="modules" name="user1" style="xhtml" /></td>
<td>
<jdoc:include type="modules" name="user2" style="xhtml" /></td>
</tr>
</table>
<div id="mainbody">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div><div id="banner">
<jdoc:include type="modules" name="banner" />
</div></td>
<?php if( $this->countModules('right') ) {?>
<td valign="top" class="right_table">
<div id="right">
<jdoc:include type="modules" name="right" style="rounded" />
</div>
</td>
<?php } ?>
</tr>
</table>
</td>
<td class="maincontent_border_right"> </td>
</tr>
<tr>
<td class="footer_border_left"> </td>
<td class="footer_bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td><div id="bottom_links">
<div align="right">
<?php include (dirname(__FILE__).DS.'/footer.php');?>
</div>
</div></td>
</tr>
</table></td>
<td class="footer_border_right"> </td>
</tr>
</table></td>
</tr>
</div>
</div>
</div>
</table>
</body>
</body>
</html>


Na razie prowizorycznie mam wstawione tło rozciągnięte w osi Y i potem rozciągane do X, ale przy dłuższych stronach to się nie sprawdzi..
Damonsson
Chciałem zasugerować multiple-background css3, ale patrząc w kod...po cóż okuwać świni kopyta, złotymi podkowami winksmiley.jpg
Rabus_1
Cały lay to po prostu joomlowy darmowy szablon przeedytowany na moje potrzeby... Na razie nie posiadam takiej wiedzy żeby sobie wszystko od 0 napisać, ale później kto wie smile.gif


Chciałbym żeby było tak:
Obrazek 1 rozciągany w osi X
Obrazek 2 rozciągany w osi X
Obrazek 3 rozciągany w osi X i do końca strony.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.