Zeeeya

Я хочу, чтоб не все, а ссылки только в этом диве (nav), были черного (допустим) цвета. Ин=справила на ul.nav a{ text-decoration: underline; color:#000000; } ul.nav a:visited, a.visited{ text-decoration: underline; color:#000000; } /*ссылка при наведении*/ ul.nav a:hover, a.hover{ text-decoration: underline; color: #000000; } - не работает((

У меня снова проблемы с форматированием текста Прописала: #nav{ padding: 75px 40px 10px 40px; } ul.nav a:link { text-decoration: underline; color:#000000; } ul.nav a:visited, a.visited{ text-decoration: underline; color:#ffffff; } /*ссылка при наведении*/ ul.nav a:hover, a.hover{ text-decoration: underline; color: #8ac1f7; } а ссылки все равно такие, как задано для всех ссылко на сайте... Что не так делаю?

amelice, спасибо большое!

amelice, как цвет прописать в #bottom ? Задаю color - ничего не меняется, работает общее правило...

Whatsup, благодарю! а как задать другой цвет текста для нижнего блока bottom, подскажите, плииз!

Здравствуйте! Подскажите, пожалуйста, как задать для блока меню цвет текста, отличный от цвета ссылок? СЕйчас пункты меню оформляются, как все ссылки на сайте... вот CSS: * { margin:0; padding:0; } /*стандартные оформление ссылок и заголовков*/ h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited { font-weight: normal; font-style: normal; text-decoration: none; } /*оформление всех ссылок на сайте*/ a{ text-decoration: none; color:#2a76bd; } /*непосещенная ссылка*/ a:link{ text-decoration: none; color: #2a76bd; } /*посещенная ссылка*/ a:visited, a.visited{ text-decoration: none; color:#2a76bd; } /*ссылка при наведении*/ a:hover, a.hover{ text-decoration: none; color: #dde383; } /*заголовки 1 уровня*/ h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover{ font:bold 18px Arial, Helvetica, sans-serif ; font-style:italic; color: #ffffff; text-align:left; } /*заголовки 2 уровня*/ h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover{ font-size:bold 14px; color: #c0ddf8; font-style:italic; text-align:left; font-family:Georgia; } /*заголовки 3 уровня*/ h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover{ font-size: 18px; color: #ffffff; text-align:center; font-style:italic; font-family:Georgia; } /*заголовки 4-6 уровня*/ h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover,h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover,h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover{ font-size: 125%; color: #17455d; } /*оформление абзацев текста*/ p {text-decoration: none; color: #08253f; margin: 5px 10px 0 0; font-family:Arial, Helvetica, sans-serif ; text-indent: 25px; /* Отступ первой строки в пикселах */ } li { list-style-type: none; /* Убираем маркеры */ } /*оформление заднего плана и форматирование текста сайта и межстрочного расстояния*/ body { background-color:#08253f; margin:0 auto; padding:0; font-family:Arial, Helvetica, sans-serif ; line-height:1.3; height: 100%; } #wrap{ width: 1006px; width:1460px; height: 100%; margin:auto; background: url(../images/fon.jpg) no-repeat; overflow: visible; } #header{ width:960px; height: 341px; margin:0 auto 0; } #pole{ overflow: hidden; background-color:#08253f; width:960px; margin:0 auto; } #user2{ text-align:center; margin:0 25px 0 25px; height: 40px; font-size:16px; font-style: bold; } #menu{ margin-top: 30px; float: left; background: url(../images/menu.gif) no-repeat; width: 225px; height: 400px; padding-top: 69px; padding-left: 25px; } .moduletable_menu{ font: bold 20px TimesNR, serif; text-align:left; line-height: 1.73; } #content_ramka{ position:relative; margin-top: 30px; float:right; width: 700px; align:center; } #ramka_top{ position: absolute; /* Абсолютное позиционирование */ top: 0px; /* Положение от верхнего края */ right: 0px; /* Положение от правого края */ background: url(../images/ramka_top.png) no-repeat; width:690px; height: 171px; } #content{ background: url(../images/grad.png) repeat-y; margin: 10px 10px 8px 10px; width:680px; height: 100%; } .item-page{ padding: 40px 40px 40px 40px; font-family: "Arial", "Helvetica", sans-serif; } #ramka_bottom{ position: absolute; /* Абсолютное позиционирование */ bottom: 0px; /* Положение от нижнего края */ left: 0px; /* Положение от Левого края */ background: url(../images/ramka_bottom.png) no-repeat; width:690px; height: 169px; } #bottom { background: url(../images/bottom.jpg) no-repeat; width:960px; height: 267px; margin:0 auto 30px; padding-top: 170px; text-align: center; font-size: 12px; color: #c0ddf8; } a.visited { color: #ffffff; } сайт

т.е низ и верх - абсолютом, а середину как, чтоб растягивалась? Это я про нижний слой. Середину просто после верха? Все в одном ДИВе?

А какже рисунок рамки? wildhind, спасибо!

Justnewone, спасибо за идею! Сейчас попробую

Здравствуйте! Подскажите, как реализовать дизайн: блок контента должен растягиваться вниз. я разбила окантовку на 3 части (красным выделено), чтоб средняя растягивалась в зависимости от объема контента, верх и низ, естественно не растягиваются. Но как наложить сверху фон для контента (желтым), он будет повторяться вниз. Если ДИВ с фоном вставить в средний main2, то получатся пустые области без текста сверху и снизу. Как сделать, подскажите пожалуйста. Или, может, есть другое решение? Макет-то не сложный... Заранее благодарна.

Catherine, конечно, в этом! Спасибище!!!

Здравствуйте! пытаюсь с помощью z-index вывести слой с блоком наверх (собаку под блок), ничего не выходит... что не так с кодом: .main_fon { background: url(../images/main_fon.png) repeat; position:reletive: z-index: 2; } ........... #dog{ background: url(../images/dog.png) no-repeat; width:170px; height: 156px; position: absolute; z-index: 1; right:66px; bottom:60px; }

ПОчему лучше убрать? А moduletable у меня почему-то в футере... Не работает... Оставила пока как есть, присвоила слою с собакой z-index: 1, а слою блока z-index:2, но слои остались на месте. Почему? вот код: .main_fon { background: url(../images/main_fon.png) repeat; position:reletive: z-index: 2; } .......... #dog{ background: url(../images/dog.png) no-repeat; width:170px; height: 156px; position: absolute; z-index: 1; right:66px; bottom:60px; }

flintovich, спасибо! Сделала! А как бы еще сделать так, чтоб этот слой был под блоками, т.е. под другими слоями? (собака чтоб просвечивала под блоком новостей)

Здравствуйте! Как на сайте, вот сайт, сделать дополнительный слой, чтоб, независимо от высоты страницы, был графический элемент, который бы всегда был внизу страницы, но перед футером? Вставлять все в новый див и в нем располагать этот элемент с позиционированием?

Modestes, я именно дизайн растягивающегося блока со скругленными углами не могу реализовать... crashtua, спасибище, пошла разбираться! .... Одолела я его!!! crashtua, ВЫ меня спасли!!! вот мой код: Сss <!--вывод содержимого контента--> <div><div class="main_header"> <div class="main_top"></div> <div class="main_fon"><jdoc:include type="component" style="xhtml" /></div> <div class="main_bottom"></div> </div> .main_header{ margin-left: 35px; margin-right: 35px; margin-top: 10px; overflow:hidden; background: url(../images/mh1.png) no-repeat left top, url(../images/mh2.png) no-repeat right top, url(../images/mb1.png) no-repeat left bottom, url(../images/mb2.png) no-repeat right bottom; } .main_top { height: 41px; margin-left: 25px;/*На размер картинки угла*/ margin-right: 19px;/*На размер картинки угла*/ background: url(../images/main_header.png) repeat-x; } .main_fon { background: url(../images/main_fon.png) repeat; } .main_bottom { height: 23px; margin-left: 16px;/*На размер картинки угла*/ margin-right: 19px;/*На размер картинки угла*/ background: url(../images/main_bottom.png) repeat-x; } сайт: здесь

ShumNo,Modestes, спасибо, абсолют убираю... У меня все проблемы с этим блоком правым, без абсолюта ДИВы выстраиваются один под другим, не могу их на одну линию поставить, и вообще "слепить" этот блок из графических элементов (уголки и растягивающиеся, в зависимости от наполнения середины).

Здравствуйте! Верстаю шаблон для Джумла-2.5, нужен шаблон на ДИВах Вот сайт: Сайт Левая колонка присутствует только на главной странице, на остальных поле контента должно растягиваться на всю ширину. Совершенно запуталась с версткой! Применила для элемента 1 абсолютное позиционирование, растягивается как нужно, но на главной почему-то элемент 2 и поле 4 продолжаются за левое поле... И как указать расположение аналогичных нижних элементов, если поле вниз будет растягиваться в зависимости от контента? ПОмогите, плиз!

А на локалке не работает... Дело в хосте чтоль? почему 100%? стоит width 767px из 1000 px общей ширины. Попробовала в процентах прописать - ничего не изменилось...

Сайт на локалке еще, тока начинается... вот исходный код страницы: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru" dir="ltr" > <head> <base href="http://localhost/baykara/index.php/sample-sites" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="robots" content="index, follow" /> <meta name="author" content="Super User" /> <meta name="generator" content="Joomla! 1.7 - Open Source Content Management" /> <title>Сайты-примеры</title> <link href="/baykara/templates/baykara/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon" /> <script src="/baykara/media/system/js/core.js" type="text/javascript"></script> <script src="/baykara/media/system/js/mootools-core.js" type="text/javascript"></script> <script src="/baykara/media/system/js/caption.js" type="text/javascript"></script> <title>Welcome to the Frontpage</title> <meta name="description" content="Joomla! - the dynamic portal engine and content management system" /> <meta name="generator" content="Joomla! 1.5 - Open Source Content Management" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="robots" content="index, follow" /> <meta name="keywords" content="joomla, Joomla" /> <link href="/baykara/index.php/component/content/?view=frontpage&format=feed&Itemid=1&type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0" /> <link href="/baykara/index.php/component/content/?view=frontpage&format=feed&Itemid=1&type=atom" rel="alternate" type="application/atom+xml" title="Atom 1.0" /> <script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/mootools.js"></script> <script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/caption.js"></script> <link rel="icon" href="/templates/persik/favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="/templates/persik/favicon.ico" type="image/x-icon"> <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" href="/baykara/templates/baykara/css/template.css" type="text/css" /> </head> <body> <!--оформление страницы сайта--> <div id="wrap"> <!--блок шапки сайта header --> <div id="header"> шапка </div> <!--вывод модуля горизонтального меню в позиции user2--> <div id="topmenu" align="center" > </div> <!--вывод всего содержимого--> <div id="body"> <!--вывод содержимого контента--> <div id="content"> <div class="item-page"> <h2> <a href="/baykara/index.php/sample-sites"> Сайты-примеры</a> </h2> <ul class="actions"> <li class="print-icon"> <a href="/baykara/index.php/sample-sites?tmpl=component&print=1&layout=default&page=" title="Печать" onclick="window.open(this.href,'win2','status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no'); return false;" rel="nofollow"><img src="/baykara/media/system/images/printButton.png" alt="Печать" /></a> </li> <li class="email-icon"> <a href="/baykara/index.php/component/mailto/?tmpl=component&template=baykara&link=888a678677b99c7257fd360aa0e4a9a171b531eb" title="E-mail" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/baykara/media/system/images/emailButton.png" alt="E-mail" /></a> </li> </ul> <p>В установленной у вас системе имеются примеры контента различного рода для демонстрации основных возможностей системы. Помимо этого, для более наглядной демонстрации возможностей, в систему включено два "сайта в сайте".</p> <p>Первый сайт - "<a href="http://poligon.ru/index.php?Itemid=243">Парки Австралии</a>". Он демонстрирует насколько легко создать на Joomla! персональный сайт. Для реализации такого проекта вполне достаточно даже штатного функционала Joomla!. Этот сайт содержит персональный блог, веб-ссылки и простую галерею изображений.</p> <p>Второй сайт - сложнее, он представляет собой сайт для малого бизнеса, в данном случае <a href="http://poligon.ru/index.php?Itemid=429">Магазина фруктов</a>.</p> <p>Для создания индивидуального стиля и дизайна сайта вам, возможно, понадобится установить <a href="http://extensions.joomla.org/">сторонние расширения</a> и создать или приобрести собственный "шаблон" оформления. Многие пользователи Joomla! для начала изменяют стандартный <a href="http://docs.joomla.org/How_do_you_modify_a_template%3F">шаблон</a>, который имеется в системе изначально. Они добавляют необходимые изображения и прочие элементы дизайна в соответствии с назначением сайта.</p> </div> контент </div> <!--вывод правой колонки--> <div id="right"> правое ололололллллллллллллллллллллллллллллллллллл </div> </div> <!--вывод сведений модуля с информацией об авторских правах в позиции footer --> <div id="bottom"> <a href="malito: Ramus20@yandex.ru"> Ramus20@yandex.ru </a> </div> </div> </body> </html>

hedgehog, я лошара... Не совсем понимаю, как там работать, в ндексе подключены два js-файла (mootools.js и caption.js), я нашла caption.js, вставила код, (второй файл не нашла, зато есть :mootools-core.js, mootools-core-uncompressed.js, mootools-more-uncompressed.js) Вот ссыль: http://jsfiddle.net/Zeya/WU2G9/

Так и есть - два этих ДИВАа в одном. После хэдера идет меню (просто пока только графическое поле), а навигация - это что? Не меню? фон левого блока 767, фон правого - 232, отступы вообще еще не указаны... Когда задаю обтекание, указав меньшую ширину - правый клок прижимается к правому краю, а между блоками промежуток... Так что дело не в ширине... Olekh, пробовала... вот index: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <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> <jdoc:include type="head" /> <title>Welcome to the Frontpage</title> <meta name="description" content="Joomla! - the dynamic portal engine and content management system" /> <meta name="generator" content="Joomla! 1.5 - Open Source Content Management" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="robots" content="index, follow" /> <meta name="keywords" content="joomla, Joomla" /> <link href="index.php?option=com_content&view=frontpage&format=feed&Itemid=1&type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0" /> <link href="index.php?option=com_content&view=frontpage&format=feed&Itemid=1&type=atom" rel="alternate" type="application/atom+xml" title="Atom 1.0" /> <script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/mootools.js"></script> <script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/caption.js"></script> <link rel="icon" href="/templates/persik/favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="/templates/persik/favicon.ico" type="image/x-icon"> <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/template.css" type="text/css" /> <?php if($this->countModules('right') == 0) $contentwidth = "100"; if($this->countModules('right') == 1) $contentwidth = "80"; ?> </head> <body> <!--оформление страницы сайта--> <div id="wrap"> <!--блок шапки сайта header --> <div id="header"> <jdoc:include type="modules" name="top" style="xhtml" />шапка </div> <!--вывод модуля горизонтального меню в позиции user2--> <div id="topmenu" align="center" > <jdoc:include type="modules" name="user2" style="xhtml" /> </div> <!--вывод всего содержимого--> <div id="body"> <!--вывод содержимого контента--> <div id="content"> <jdoc:include type="component" style="xhtml" />контент </div> <!--вывод правой колонки--> <div id="right"> <jdoc:include type="modules" name="right" style="xhtml" />правое ололололллллллллллллллллллллллллллллллллллл </div> </div> <!--вывод сведений модуля с информацией об авторских правах в позиции footer --> <div id="bottom"> <jdoc:include type="modules" name="bottom" style="xhtml" /> <a href="malito: Ramus20@yandex.ru"> Ramus20@yandex.ru </a> </div> </div> </body> </html> Css; body, html { background-color: #38616b; margin:0px; padding:0px; } #wrap{ width: 1024px; margin:0 auto; } #header { background: url(../images/header.jpg) no-repeat; width:1001px; height: 222px; margin:0 auto; } #topmenu{ background: url(../images/menu_fon.jpg) no-repeat; width:1001px; height: 55px; } #body{ width:100%; } #content { background: url(../images/fon_left.jpg) repeat-y; width: 767px; } #right { background: url(../images/fon_right.jpg) repeat-y; width: 232px; } #bottom { background: url(../images/bottom.jpg) no-repeat; width:999px; height: 120px; margin:0 auto; padding-bottom: 35px; padding-top: 116px; text-indent: 16em; /* Отступ первой строки */ color: #3d6a55; }

вот еще не верстаный макет, как все должно быть: фрагмент 06 слева, справа фрагмент 07, оба повторяются по оси у. а вот что получается: фрагмент 07 отображается снизу 06, даже если поставить обоим обтекание с сответственной стороны, он все равно отображается ниже 06, только справа.

Лююди, помогите разобраться, плиз! Почему не получается вставить элемент справа?

Может, всеж обтекание необходимо, но все равное не работеат(((