Привет, я пока новичек. Нужен шаблон, в котором можно картинку jpg 1024х768 ( разметить фоном в шаблоне), чтобы при ресайзе сайта - резайзелась картинка - относительно(гармонично со всеми кнопками)
а у кого разрешение экрана больше 1024 будут полосу справа наблюдать? Фоновая картинка ресайзиться не может. Картинка 1024х768 весит больше 100 кб, т.е. страница будет грузиться долго. Пользователю это надо?
я предупреждал, что грузиться будет долго, но человек хочет и всё, какие только доводы не приводил, эх, собствено и хотел узнать как можно картинку сделать фоном oceano-spb.ru - текщий пример
Можно растянуть или в ширину или в высоту... другое измерение растянется пропорционально.. вариант 2 - использовать JavaScript
сильно не ругайте - вот что сделал на CSS http://oceano-spb.ru/index_resize.php все резайзится (при ресайзании браузера), но вот думаю стоит ли так извращаться
1. пушкинские строки и пушкин за листом папируса 2. ресайз на широкоформатных мониторах превращает пушкина в лицо, страдающего ожирением 2 ст. 3. шрифт смазывается
ктстати наоборот, папирус - резайзится и в ширь и в длину, а пушкин остается нормальным, если бы пушкин был бы на месте папируса, то был бы шанс у него ожиреть. х.з. как также побороть папирус
1 цельная картинка на фоне в дизайне .... да еще и в стандартном - не бывает такого... Это противоречит идеям тянущегося дизайна - когда страница тянется вниз, при дополнении в нее информации ... Но, если быть откровенным, в последней работе я использовал этот метод, для главной страницы сайта. Шо делать - заказчик всегда прав, и его ен волнует что у когото дома нету мегабита. Собственно и сайт ориентирован на народ такой ... не бедный... Для этого были отрисованны 3 версии фона - 1024, 1280 и 1600 Потом я определял размер экрана и в зависимости от этого прогружал свою версию css: <Script language="JavaScript" type="text/javascript"> var height=0; var width=0; colorDepth = screen.colorDepth; if (self.screen) { width = screen.width height = screen.height } else if (self.java) { var jToolKit = java.awt.Toolkit.getDefaultToolkit(); var scrsize = jToolKit.getScreenSize(); width = scrsize.width; height = scrsize.height; } if (width < 1024) width = '1024'; if (1024 < width && width < 1280) width = '1024'; if (width > 1280) width = '1600'; document.write ( "<link rel=\"stylesheet\" href=\"<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/template" + width + ".css\" type=\"text/css\" />"); </script> То есть под каждое разрешение- своя версия стилей. Итог лежит тут: http://www.ruslan-i-ludmila.od.ua/
Что мне не нравится - фоны в твоей версии верстки (дизайна) можно сделать достаточно размытыми - (то есть по размеру маленькими) Но что бы хорошо смотрелись Логотипы и другие надписи - я бы использовал png прозрачные файлы тут на форуме посоветовали плагин http://www.joomlaworks.gr/ который сам корректирует для ИЕ 6 (и прочего кто не понимает прозрачности). Вот смотри - как на сайте выводятся 2 логотипа : <div id="main_header"> <h1> </h1> <h2> </h2> </div> А вот соответствующий код css div#main_header { height:420px;} div#main_header h1 {display:block; float:left; overflow:hidden; line-height:9999px; background:url(/bg_logo_main.png) no-repeat;} div#main_header h2 {display:block; float:left; overflow:hidden; line-height:9999px; background:url(/bg_header_adv.png) no-repeat;} Фон размыт - а логотипы - png четкие Теперь панель ввода: <div id="main_content"> <div id="main_content_start"></div> <div id="main_content_body" class="clearfix"> <p>Представляем вашему вниманию ..... </p> </div> <div id="main_content_end"></div> </div> В css: div#main_content { width:380px; float:right; margin-top:80px;} div#main_content_start {width:380px; height:38px; background:url(../images/bg/bg_maincontent_start.png) no-repeat bottom;} div#main_content_end {width:380px;height:38px; background:url(../images/bg/bg_maincontent_end.png) no-repeat top;} div#main_content_body {width:300px;background:url(../images/bg/bg_maincontent.png) repeat-y; color:#138ce4; padding:0 40px;} Есть начало блока -_start конец - _end и тело _body. Все это заключено в контейнер Такое деление позволяет растягивать текст внутри блока.
красиво исполнен сайт!!!! эх мне бы так уметь...... вопрос: можно ли както сделать, чтобы при резайзе сайта в браузере, невозможно было сделать ширину такуюже или меньше чем длина? (хотябы на яве)? если да, то как?
Jedai, Как то вот так: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Окно 300 на 300 и никаких гвоздей!</title> </head> <script language="javascript" type="text/javascript"> function ModifyWindow (){ window.moveTo(0,0); window.resizeTo(300, 300); } </script> <body onload="ModifyWindow ()" onresize="ModifyWindow ()"> </body> </html>
