LiveInternetMail.ru
Форум русской поддержки Joomla!® CMS
26.05.2012, 21:21:40 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 1.7 FAQ Joomla 1.5 FAQ Joomla 1.0 FAQ Правила форума Новости Joomla Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор Тема: Как сделать отдельный фон?  (Прочитано 1209 раз)
0 Пользователей и 1 Гость смотрят эту тему.
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« : 23.12.2010, 03:21:33 »

Как сделать, чтобы фон между хедером и футером был отличный от них же?
Записан
Arkadiy
Moderator
*****

Репутация: +244/-5
Offline Offline

Сообщений: 4895


Былененький он зел.


« Ответ #1 : 23.12.2010, 07:15:10 »

Стилями, открываешь FireBug, ищешь на странице нужный контейнер, смотришь его стиль в template_css.css или другом файле (firebug покажет), изменяешь цвет.
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #2 : 24.12.2010, 15:23:24 »

Я хочу заключить все блоки, контент и колумны в один стиль фона, но у меня main_wrap разворачивается только до первого блока. Не пойму, почему так происходит?
Записан
Arkadiy
Moderator
*****

Репутация: +244/-5
Offline Offline

Сообщений: 4895


Былененький он зел.


« Ответ #3 : 24.12.2010, 15:54:16 »

Может есть более всеобъемлющий блок? например <body> Azn
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #4 : 24.12.2010, 19:45:59 »

Может есть более всеобъемлющий блок? например <body> Azn
Видно не много не так выразился. Я хочу между хедером и футером сделать еще один блок. В этот блок должно входить все, кроме хедера и футера соответственно.
Вот код:
Код:
<?php

defined('_VALID_MOS') or die();
global $task,$my, $mosConfig_mailfrom;
$iso = explode('=',_ISO); echo '<?xml version="1.0" encoding="'.$iso[1].'"?'.'>'."\n";
?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $iso[1];?>" />
<script type="text/javascript">
var _live_site = '<?php echo JPATH_SITE;?>';
var _option = '<?php echo mosGetParam( $_REQUEST, 'option', '' );?>';
var _cur_template = '<?php echo JTEMPLATE;?>';
var _js_defines = [];
</script>
<?php
// загружаем верхнюю часть страницы со всеми js и CSS файлами, и обязательным использованием jquery
mosShowHead(array('js'=>1,'css'=>1,'jquery'=>1));

//Инициализация визуального редактора
if ($my->id && $mainframe->allow_wysiwyg) { initEditor(); }

//Принудительно настраиваем модуль авторизации
$login_params = new stdClass();
$login_params->template = 'popup.php';
$login_params->show_login_text = 3;
$login_params->show_pass_text = 3;

$block1_count = (mosCountModules('user1')>0) + (mosCountModules('user2')>0) + (mosCountModules('user3')>0);
$block2_count = (mosCountModules('user4')>0) + (mosCountModules('user5')>0) + (mosCountModules('user6')>0);
$block3_count = (mosCountModules('user7')>0) + (mosCountModules('user8')>0) + (mosCountModules('user9')>0);

$body_class = 'inside';
if($block1_count){$body_class = 'mainpage';}
?>
<link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/template_css.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 7]><link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/fix/ie7.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 8]><link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/fix/ie8.css" rel="stylesheet" type="text/css"/><![endif]-->
</head>
<body class="<?php echo $body_class;?>">
    <div class="main_wrap">
<div id="back_style_gradient">
        <div class="wrapper">
            <div class="header">
                <a href="<?php echo JPATH_SITE;?>" id="logo">&nbsp;</a>
                <div class="header_center"><?php mosLoadModules('header',-1); ?></div>
                <div class="header_right">
                    <a title="Обратная связь" href="mailto:<?php echo $mosConfig_mailfrom;?>" id="mail" class="navbar">&nbsp;</a>
                    <a title="Карта сайта" href="<?php echo sefRelToAbs('index.php?option=com_xmap&amp;Itemid=27'); ?>" id="map" class="navbar">&nbsp;</a>      
                </div>
               <div class="top_menu_l"><div class="top_menu_r"><div class="top_menu_mid">
                <?php mosLoadModules('top',-1); ?>
                <?php mosLoadModule('mod_ml_login', '', -1, 0, $login_params); ?>
                </div></div>
            </div><!--header:end-->
<div class="back_style"> - пытаюсь добавить этот блок
<?php if($block1_count) { $block1_width = 'w' .$block1_count; ?>
            <div class="block1" id="block_round">
<?php if(mosCountModules('user1')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                    <?php mosLoadModules('user1', -2); ?>
                </div>
<?php } ?>
<?php if(mosCountModules('user2')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                        <?php mosLoadModules('user2', -2); ?>
                   </div>
<?php } ?>
                    <?php if(mosCountModules('user3')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                    <?php mosLoadModules('user3', -2); ?>
                </div>
<?php } ?>
            </div><!--block1:end-->
<?php } ?>
            <div class="content">
                <?php mosMainbody(); ?> <br />
                <?php if($block2_count) { $block2_width = 'w' .$block2_count; ?>
                    <div class="block2">
                        <?php if(mosCountModules('user4')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                            <?php mosLoadModules('user4', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user5')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                            <?php mosLoadModules('user5', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user6')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                              <?php mosLoadModules('user6', -2); ?>
                           </div>
                        <?php } ?>
                    </div><!--block2:end-->
                <?php } ?>                
            </div><!--content:end-->
            <div class="col">
                <?php mosLoadModules('left',-2); ?>
                <?php mosLoadModules('banner',-2); ?>
            </div><!--col:end-->
            <?php if($block3_count) { $block3_width = 'w' .$block3_count;?>
                <div class="block3">
                    <div class="block3_bottom">
                        <?php if(mosCountModules('user7')) { ?>
                            <div class="block_<?php echo $block3_width ?> w25">
                            <?php mosLoadModules('user7', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user8')) { ?>
                            <div class="block_<?php echo $block3_width ?> w35">
                            <?php mosLoadModules('user8', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user9')) { ?>
                            <div class="block_<?php echo $block3_width ?> w35" >
                            <?php mosLoadModules('user9', -2); ?>
                        </div>
                        <?php } ?>
                    </div>
                </div>
                </div><!--block3:end-->
<?php } ?>
        </div><!--wrapper:end-->
    </div> <!--main_wrap:end-->
    <div class="footer">
        <div class="bottom">
            <a title="Работает на системе управления сайтами Joostina CMS" href="http://www.joostina.ru" target="_blank" id="about" class="bottom_bar">Работает на Joostina CMS</a>
            <?php mosLoadModules('bottom',-1); ?>
</div>
        </div>
    </div><!--footer:end-->
<?php

//подключаем js-скрипт
$mainframe->addJS(JPATH_SITE.'/templates/'.JTEMPLATE.'/js/corners.js', 'js');
//подключаем js-файл шаблона
$mainframe->addJS(JPATH_SITE.'/templates/'.JTEMPLATE.'/js/template.js', 'custom');

// выводим js футера (первая ступень - в основном jQuery-плагины и вспомагательные скрипты)
mosShowFooter(array('js'=>1));
// выводим js футера (вторая ступень - js компонентов, инициализации для плагинов и т.п. -
//всё, что должно быть загружено после всех основных скриптов)
mosShowFooter(array('custom'=>1));
?>
</body>
</html>
Записан
colors
Завсегдатай
*****

Репутация: +0/-0
Offline Offline

Сообщений: 415


« Ответ #5 : 24.12.2010, 20:00:54 »

Цитировать
<div class="back_style"> - пытаюсь добавить этот блок
а что в CSS про этот блок написано?

Должно быть примерно так наверное, если Вы оставили блоки content & left без изменений
Код
.back_style {height:auto; overflow: hidden; background:url(../images/cback_style.gif) repeat-y top right;}
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #6 : 24.12.2010, 20:09:04 »

а что в CSS про этот блок написано?

Должно быть примерно так наверное, если Вы оставили блоки content & left без изменений
Код
.back_style {height:auto; overflow: hidden; background:url(../images/cback_style.gif) repeat-y top right;}


При таком раскладе футер подымается к хедеру.
Записан
colors
Завсегдатай
*****

Репутация: +0/-0
Offline Offline

Сообщений: 415


« Ответ #7 : 24.12.2010, 20:18:41 »

При таком раскладе футер подымается к хедеру.
а не должен поидее, если это цсс стандартного шаблона..
а где закрывающий div для back_style?
если я правильно понял, он стоит перед
Код
</div><!--footer:end-->
а должен перед началом footer
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #8 : 24.12.2010, 20:20:36 »

Я его ставил - </div>
                <!--block3:end-->
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #9 : 24.12.2010, 20:23:01 »

код шаблона:
Код:
<?php

defined('_VALID_MOS') or die();
global $task,$my, $mosConfig_mailfrom;
$iso = explode('=',_ISO); echo '<?xml version="1.0" encoding="'.$iso[1].'"?'.'>'."\n";
?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $iso[1];?>" />
<script type="text/javascript">
var _live_site = '<?php echo JPATH_SITE;?>';
var _option = '<?php echo mosGetParam( $_REQUEST, 'option', '' );?>';
var _cur_template = '<?php echo JTEMPLATE;?>';
var _js_defines = [];
</script>
<?php
// загружаем верхнюю часть страницы со всеми js и CSS файлами, и обязательным использованием jquery
mosShowHead(array('js'=>1,'css'=>1,'jquery'=>1));

//Инициализация визуального редактора
if ($my->id && $mainframe->allow_wysiwyg) { initEditor(); }

//Принудительно настраиваем модуль авторизации
$login_params = new stdClass();
$login_params->template = 'popup.php';
$login_params->show_login_text = 3;
$login_params->show_pass_text = 3;

$block1_count = (mosCountModules('user1')>0) + (mosCountModules('user2')>0) + (mosCountModules('user3')>0);
$block2_count = (mosCountModules('user4')>0) + (mosCountModules('user5')>0) + (mosCountModules('user6')>0);
$block3_count = (mosCountModules('user7')>0) + (mosCountModules('user8')>0) + (mosCountModules('user9')>0);

$body_class = 'inside';
if($block1_count){$body_class = 'mainpage';}
?>
<link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/template_css.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 7]><link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/fix/ie7.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 8]><link href="<?php echo JPATH_SITE;?>/templates/<?php echo JTEMPLATE; ?>/css/fix/ie8.css" rel="stylesheet" type="text/css"/><![endif]-->
</head>
<body class="<?php echo $body_class;?>">
    <div class="main_wrap">
<div id="back_style_gradient">
        <div class="wrapper">
            <div class="header">
                <a href="<?php echo JPATH_SITE;?>" id="logo">&nbsp;</a>
                <div class="header_center"><?php mosLoadModules('header',-1); ?></div>
                <div class="header_right">
                    <a title="Обратная связь" href="mailto:<?php echo $mosConfig_mailfrom;?>" id="mail" class="navbar">&nbsp;</a>
                    <a title="Карта сайта" href="<?php echo sefRelToAbs('index.php?option=com_xmap&amp;Itemid=27'); ?>" id="map" class="navbar">&nbsp;</a>     
                </div>
               <div class="top_menu_l"><div class="top_menu_r"><div class="top_menu_mid">
                <?php mosLoadModules('top',-1); ?>
                <?php mosLoadModule('mod_ml_login', '', -1, 0, $login_params); ?>
                </div></div>
            </div><!--header:end-->
<div class="back_style">
<?php if($block1_count) { $block1_width = 'w' .$block1_count; ?>
            <div class="block1" id="block_round">
<?php if(mosCountModules('user1')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                    <?php mosLoadModules('user1', -2); ?>
                </div>
<?php } ?>
<?php if(mosCountModules('user2')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                        <?php mosLoadModules('user2', -2); ?>
                   </div>
<?php } ?>
                    <?php if(mosCountModules('user3')) { ?>
                    <div class="block_<?php echo $block1_width ?>">
                    <?php mosLoadModules('user3', -2); ?>
                </div>
<?php } ?>
            </div><!--block1:end-->
<?php } ?>
            <div class="content">
                <?php mosMainbody(); ?> <br />
                <?php if($block2_count) { $block2_width = 'w' .$block2_count; ?>
                    <div class="block2">
                        <?php if(mosCountModules('user4')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                            <?php mosLoadModules('user4', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user5')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                            <?php mosLoadModules('user5', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user6')) { ?>
                            <div class="block_<?php echo $block2_width ?>">
                              <?php mosLoadModules('user6', -2); ?>
                           </div>
                        <?php } ?>
                    </div><!--block2:end-->
                <?php } ?>               
            </div><!--content:end-->
            <div class="col">
                <?php mosLoadModules('left',-2); ?>
                <?php mosLoadModules('banner',-2); ?>
            </div><!--col:end-->
            <?php if($block3_count) { $block3_width = 'w' .$block3_count;?>
                <div class="block3">
                    <div class="block3_bottom">
                        <?php if(mosCountModules('user7')) { ?>
                            <div class="block_<?php echo $block3_width ?> w25">
                            <?php mosLoadModules('user7', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user8')) { ?>
                            <div class="block_<?php echo $block3_width ?> w35">
                            <?php mosLoadModules('user8', -2); ?>
                        </div>
                        <?php } ?>
                        <?php if(mosCountModules('user9')) { ?>
                            <div class="block_<?php echo $block3_width ?> w35" >
                            <?php mosLoadModules('user9', -2); ?>
                        </div>
                        <?php } ?>
                    </div>
                </div>
                <!--block3:end-->
</div>
<?php } ?>       
        </div><!--wrapper:end-->
    </div> <!--main_wrap:end-->
    <div class="footer">
        <div class="bottom">
            <a title="Работает на системе управления сайтами Joostina CMS" href="http://www.joostina.ru" target="_blank" id="about" class="bottom_bar">Работает на Joostina CMS</a>
            <?php mosLoadModules('bottom',-1); ?>
</div>
        </div>
    <!--footer:end-->
<?php

//подключаем js-скрипт
$mainframe->addJS(JPATH_SITE.'/templates/'.JTEMPLATE.'/js/corners.js', 'js');
//подключаем js-файл шаблона
$mainframe->addJS(JPATH_SITE.'/templates/'.JTEMPLATE.'/js/template.js', 'custom');

// выводим js футера (первая ступень - в основном jQuery-плагины и вспомагательные скрипты)
mosShowFooter(array('js'=>1));
// выводим js футера (вторая ступень - js компонентов, инициализации для плагинов и т.п. -
//всё, что должно быть загружено после всех основных скриптов)
mosShowFooter(array('custom'=>1));
?>
</body>
</html>
код template_css.css:
Код:
/* * template_css.css. Используется для описания * элементов раскладки шаблона, уникальных стилей * * @package     Joostina * @subpackage  templates/NewLine2 * @version     $Id: template_css.css 29-09-2009 12:17 ZaiSL $;
*/
@import "reset.css";
@import "base.css";
@import "modules.css";
@import "menu.css";
@import "components.css";
html {
height: 100%;
width: 100%;
}
body.mainpage, body.inside {
background: url(../images/layout/honda.jpg) no-repeat top center fixed;
height: auto;
position: relative;
text-align: center;
width: 100%;
}
.main_wrap {
background: url(../images/layout/header_left.png) no-repeat top left;
padding: 0 0 40px 0;
position: relative;
height: auto;
min-height: 100%;
}
.wrapper {
margin: 0 auto;
position: relative;
text-align: left;
width: 1004px;
}
.header {
background: url(../images/layout/header.png) no-repeat 75% 0px;
position: relative;
margin: 0 0 20px 0;
height: 201px;
}
.header_center {
height: 130px;
margin: 0 0 0 140px;
padding: 24px 0 0 0;
width: 50%;
}
.header_right {
position: absolute;
right: 15px;
top: 30px;
width: 150px;
}
a#logo {
background: url(../images/logo.png) no-repeat top left;
cursor: pointer;
display: block;
height: 112px;
left: 0px;
position: absolute;
text-decoration: none;
top: 20px;
width: 147px;
}
a.navbar {
display: block;
float: right;
margin: 0 20px  0 0;
height: 12px;
text-decoration: none;
width: 15px;
}
a.navbar#mail {
background: url(../images/layout/mail.png) no-repeat center;
}
a.navbar#map {
background: url(../images/layout/map.png) no-repeat center;
}
.back_style {
width: 1004px;
height: auto;
overflow: hidden;
}
.content {
float: right;
width: 73%;
position: relative;
}
.col {
float: left;
width: 23%;
}
.bottom {
height: 40px;
line-height: 40px;
margin: 0 auto;
padding: 12px 0 12px 0;
width: 1004px;
}
.footer {
bottom: 0px;
clear: both;
position: relative;
}
a#about {
background: url(../images/joostina_mini.png) no-repeat top left;
float: left;
padding: 0 0 0 38px;
line-height: 28px;
margin: 15px 0 0 0;
}
.block_w1, .block_w2, .block_w3 {
float: left;
margin: 0 0 10px 0;
display: inline;
}
.block_w1 {
width: 98%;
}
.block_w2 {
width: 48%;
}
.block_w3 {
width: 32%;
}
.block_w3.w25 {
width: 25%;
}
.block_w3.w35 {
width: 35%;
}
.block_w2.w25 {
width: 25%;
}
.block_w2.w35 {
width: 70%;
}
.block_w1.w25, .block_w1.w35 {
width: 95%;
}
/* -----------------------------------------Первый блок (user1, user2, user3) */
.block1 {
border-bottom: 1px solid #CCC;
padding: 15px;
margin: 0 0 15px 0;
overflow: hidden;
}
.block1 .moduletable {
padding: 5px 10px 5px 2px;
}
.block1 h3 {
font-size: 24px;
}
/* -----------------------------------------Второй блок (user4, user5, user6) */
.block2 .moduletable {
margin: 0 10px 0 0;
padding: 5px 10px 5px 2px;
}
.block2 h3 {
background: url(../images/layout/h3_bg.png) no-repeat left;
color: #777777;
font-size: 20px;
padding: 10px 2px 10px 42px;
border-bottom: 1px solid #CCC;
border-top: 1px solid #CCC;
}
/* ----------------------------------------Третий блок (user7, user8, user9) */
.block3 {
background: url(../images/layout/block3_bg_top.jpg) repeat-x top left;
clear: both;
overflow: hidden;
padding: 3px 10px 15px 0;
}
.block3_bottom {
background: url(../images/layout/block3_bg_bottom.jpg) repeat-x bottom left;
overflow: hidden;
padding: 0 0 0 10px;
}
.block3 .moduletable {
margin: 0 10px 0 0;
padding: 5px 5px 5px 2px;
}
.block3 h3 {
color: #626262;
font-size: 20px;
padding: 0 0 10px 0;
}
/* -----------------------------------------------------Дополнительные стили */
.marker_round, .marker_round li {
margin: 0;
padding: 0;
list-style: none;
}
.marker_round {
margin: 10px 0 20px 0;
}
.marker_round li {
font-size: 11px;
overflow: hidden;
}
.marker_round strong {
background: url(../images/layout/ol_big.png) no-repeat top left;
color: #FFF;
display: block;
float: left;
font-weight: bold;
height: 30px;
line-height: 30px;
margin: 3px 6px 4px 0;
text-align: center;
width: 30px;
}
a.readmore_big {
display: block;
width: 195px;
color: #404040;
font-size: 18px;
}
/* ---------------------------------Маркированный список с большими маркерами */
ul.bigred {
list-style: none;
margin: 0;
padding: 0;
}
ul.bigred li {
background: url(../images/layout/big_marker.png) no-repeat top left;
list-style: none;
margin: 0 0 6px 0;
padding: 0 0 0 40px;
}

.highlight{
color: red;
}
Записан
colors
Завсегдатай
*****

Репутация: +0/-0
Offline Offline

Сообщений: 415


« Ответ #10 : 24.12.2010, 20:32:07 »

а задача этого div держать внизу подвал или только для фона?
если нужен только фон, проще вписать его в
Код
html {
height: 100%;
width: 100%;
background,,,,
}
Записан
vitio
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 86


« Ответ #11 : 24.12.2010, 20:54:22 »

а задача этого div держать внизу подвал или только для фона?
если нужен только фон, проще вписать его в
Код
html {
height: 100%;
width: 100%;
background,,,,
}
только для фона. Фон будет состоять из трех отдельных изобр., поэтому буду еще использовать идентификаторы. а классом хочу выделить область фона.
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Рейтинг@Mail.ru Rambler Top100 Powered by SMF 1.1.16 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet