Jump to content

Newbie

User
 View Profile  See their activity

  • Posts

    50

  • Joined

  • Last visited

 Content Type 

Everything posted by Newbie

  1. Newbie
    такой вариант никатит
  2. Newbie
    Нет А можно как-то попроще,- чтобы без ЖС?
  3. Newbie
    Пожалуйста файл index.htm <!DOCTYPE html> <html> <head> <title>всё ведь везде работает</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <!--[if lte IE 8]><script src="/js/html5shiv.js"></script><![endif]--> <style type="text/css" > @import url(rose.css); </style> </head> <body> <header> <hgroup class="sitetitle"> <h1>Розы</h1> <h2>искусственные</h2> </hgroup> <nav> <ul> <li><a href="">Главная</a></li> <li><a href="">Цветы</a></li> <li><a href="">Контакты</a></li> </ul> </nav> </header> </body> </html> файл стилей rose.css тоже скопировал в папку с indexом и на скрине видно, что вроде бы все файлы имеются
  4. Newbie
    Да вот именно . Я и его скопировал, но все равно для IE стили не применились
  5. Newbie
    Странно Скопировал у Вас "Вашу версию моего сайта" Запускаю... Во всех броузерах загружаются стили а в IE такая картина: хотя по вышеуказанной вами ссылке на Вашем сайте работает в IE
  6. Newbie
    Спасибо Большое. Сейчас буду разбираться P.S. Всё четко, но зачем яваскрипт? Уж очень бы хотелось сделать всё без яваскрипта
  7. Newbie
    Сделал шапку и горизонтальное меню. Во всех броузерах (Ghrome,IE,Ffox) отображается как и задумывалось ровно, а в opere смещается вниз во всех броузерах кроме oпeры: в опере: html-код: <body> <div id="header-null"> <div id="header"> <div id="rosa"> <h1>Розы</h1> <span>искуственные</span> </div> </div> <div id="navigation"> <div id="mymenu"> <a href="#">Главная</a> <a href="#">Цветы</a> <a href="#">Контакты</a> </div> </div> </div> </body> сss-код: a {text-decoration: none} a:link {color: #f83a5a} a:visited {color: #f83a5a} a:active {color: #f83a5a} a:hover {color: #a0182e} body { font: 13px/18px Arial, Helvetica, sans-serif; margin : 0 0 0 0; } /** шапка **/ #header-null { background:url(background.png) 0 0 repeat-x; width: 100%; border: 3px solid blue; padding-right: 20px; } #header { width : 100%; height : 128px; float: right; background : url(img/rose.png) no-repeat right top; border: 2px solid yellow; } #rosa { padding: 10px; height: 110px; font-size: 120%; color: #fff; margin : 37px 0 0 81px; } #rosa h1 { font-size: 165%; border: 0px solid black; margin-bottom: 18px; } /** навигация **/ #navigation { background: #ececec; border: 0px solid black; width: 100%; clear: both; margin-top: -17px; } #mymenu { padding: 5px; border-bottom: 0px solid #b7b7b7; clear : both; margin-left :190px; height: 20px; } #mymenu a { padding-left: 15px; padding-right: 15px; font-weight: bold; padding-top: 5px; padding-bottom: 7px; } #mymenu a:hover { background: #f6f6f6; } /** конец навигации**/ /** и конец шапки **/ Подскажите, пожалуйста, можно ли исправить чтобы не смещалось. Или, возможно, у меня структурно неправильный подход.
  8. Newbie
    точно. Работает. это я забыл опять паддинг вернуть.
  9. Newbie
    попробовал убрать,- тогда картинки пропадают, остаются только надписи(и рамки вокруг текста)
  10. Newbie
    Если padding убрать, то проблема решается(рамка становится нужного размера), но тогда текст над картинками, а не под ними.
  11. Newbie
    Спасибо. Одной проблемой меньше. В Mozille рамочки появились, но все равно они имеют больший размер чем прописано в height на величину paddinga.
  12. Newbie
    В internetExplorere всё четко. А в опере, видимо за счет того, что использовал padding, высота элемента списка увеличилась больше чем надо на величину paddinga. А в Moziile пропали рамочки. Это видно на скринах: подскажите, пожалуйста, как сделать так, чтобы рамки во всех броузерах отображались корректно. Возможно, было ошибкой для смещения текста под картинку использовать padding? Использовал такой код: <div id="content"> <ul id="carlist"> <li id="bugatti"> Bugatti </li> <li id="volvo"> Volvo </li> <li id="lincoln"> Lincoln </li> <li id="jiguli"> Жигули </li> <li id="kamaz"> Камаз </li> <li id="moskvich"> Москвич </li> </ul> </div> #carlist li { float:left; list-style-type: none; border:1 solid black; width : 128px; height: 158px; margin: 2px; text-align: center; padding-top: 120px; } #bugatti { background : url(img/contenimg/bugatti.png) no-repeat; } #volvo { background : url(img/contenimg/volvo.png) no-repeat; } #lincoln { background : url(img/contenimg/lincoln.png) no-repeat; }
  13. Newbie
    я уже об этом после того как отправил сообщение догадался тоже но до конца не уверен, сейчас буду пробовать
  14. Newbie
    хотелось чтобы этот список был лучше применим к резиновому дизайну допустим на сайте по типу как на рисунке: если будет меняться разрешение или размер окна, то если будет фиксированая ширина списка, это будет уже не то - не будет заполняться вся область. А хотелось-бы, чтобы если разрешение у человека большое, то чтобы картинки снизу заполняли пустоту справа
  15. Newbie
    пробую при помощи списков, так: <ul> <li> Bugatti </li> <li> Volvo </li> <li> Lincoln </li> <li> Жигули </li> <li> Камаз </li> <li> Москвич </li> </ul> сss li {display:block; float:left; list-style-type: none; } но все выводится в одну строку , подскажите, пожалуйста, как после третьего элемента перенести список на новую строку. ато получается так:
  16. Newbie
    логично, но как это осуществить?
  17. Newbie
    Есть такая картина: допустим, это список автомобилей в картинках на главной странице самое простое решение - это создать таблицу и поместить автомобили туда в ячейки. Потом приходит на ум следующее решение - оформить это всё дело при помощи <div> </div> Но это же список и поэтому логичнее было бы его оформить как список, а не как таблицу или блоки. Хотелось бы сделать семантически правильно. Но как сделать список в несколько колонок?
  18. Newbie
    Точно. Большое Спасибо!
  19. Newbie
    Как правильно сделать список чтобы у каждого элемента списка была своя картинка-маркер? создал Вот такой список: <div id="menu8"> <ul> <li><a href="#1"><span id="one"> Подсолнух</span></a></li> <li><a href="#2"><span id="two"> Лютик</span></a></li> <li><a href="#3"><span id="three"> Ромашка</span></a></li> </ul> </div> сss-код: #menu { /** background: #333333; **/ float: left; width: 250px; height: 624px; margin-top: 10px; margin-right: 10px; border: 1 solid black; padding-right: 20px; } /* =-=-=-=-=-=-=-[Menu]-=-=-=-=-=-=-=- */ #menu a { clear:both; } #menu li a { text-decoration: none; } #menu li a:link, #menu8 li a:visited { color: #777; display: block; padding: 17px 0 0 20px; margin: 0px 0px 10px 0px; } #menu li a:hover { padding: 17px 0 0 20px; margin: 0px 0px 10px 0px; } #menu li a:active { color: #777; padding: 17px 0 0 20px; margin: 0px 0px 10px 0px; } #menu ul { list-style-type: none; border : 1px solid yellow; } #menu li { border : 0px solid yellow; } /** добавление маленьких иконок возле элементов списка-меню **/ #one { background: url(img/yelowflower.png) no-repeat; border : 1px solid black; padding: 10px 10px 10px 30px; text-align : center; } #two { background: url(img/redflower.png) no-repeat; border : 1px solid black; padding: 10px 10px 10px 30px; } #three { background: url(img/blueflower.png) no-repeat; border : 1px solid black; padding: 10px 10px 10px 30px; } но почему-то при нажатии на эти ссылки-элементы списка они смещаются таким образом: даже добавил #menu a { clear:both; } все равно элементы наезжают друг на друга Подскажите, пожалуйста, может что-нибудь надо подправить, где может быть ошибка. и как её исправить.
  20. Newbie
    файлик behaviors_news.js сам маленький, но в нём ровным счётом ничего непонятно. Кому не сложно объясните, пожалуйста, что (и как) в нём происходит. Вот он: window.onload = setScreenClass; window.onresize = setScreenClass; // Following transition classes will be declared: // // classname screenwidth // —————————————— // pda_v 240px // pda_h 320px // ultralow 320px - 640px // screen_lo 640px - 800px // screen_med 800px - 1024px // screen_hi 1024px - 1280px // screen_wide > 1280px function setScreenClass(){ var fmt = document.documentElement.clientWidth; var cls = (fmt<=240)?'pda_ver':(fmt>240&&fmt<=320)?'pda_hor':(fmt>320&&fmt<=640)?'screen_ultralow':(fmt>640&&fmt<=800)?'screen_low':(fmt>800&&fmt<=1024)?'screen_med':(fmt>1024&&fmt<=1280)?'screen_high':'screen_wide'; document.getElementById('count').innerHTML=fmt+'px -> '+cls; document.body.className=cls; };
  21. Newbie
    Спасибо за предыдущие ответы. Не могли бы Вы объяснить, как Вы представляете себе работу файла behaviors_news.js ? И непонятно вот ещё что: картинка из вышеуказанного примера адаптивной графики будет переподгружаться как только будет перейдеден порог размера окна броузера (240,...,800, 1024,1280,...) или нет (т.е. картинка имеет фиксированный размер при любом разрешении и просто урезается) ?
  22. Newbie
    У меня стандартная ситуация: необходимо определить разрешение экрана. (под каждое разрешение идёт своя css-таблица.) Для этого использую вставку Javascript в код страницы (как везде рекомендуют). <comment> <script language=JavaScript> if (screen.width <= '1024') {document.write ('<LINK href="main.css" rel="stylesheet" type="text/css">'); } else {if (screen.width > '1024') {document.write ('<LINK href="main1280.css" rel="stylesheet" type="text/css">'); } } </script> </comment> Но такая схема "безболезненно" подходит для всех броузеров кроме Internet Explorera. При открытии такой страницы в Internet Explorere появляется сообщение: Чтобы это сообщение не показывалось в IE, заключил участок jscript-кода в теги<comment> </comment>. То есть в IE существует такая проблема, нельзя определить разрешение без появления вышеуказанного сообщения. Подскажите, пожалуйста, как избавиться от этого лишнего сообщения в IE или, может быть, как-то по-другому определить разрешение для этого весьма популярного броузера. p.s. Прошу, пожалуйста, не давть советы использовать резиновый дизайн, т.к. у меня используются изображения, которые занимают всю высоту экрана. И выглядит некрасиво если одну и ту же картинку использовать для любого разрешения.
  23. Newbie
    Частично решил проблему,( с помощью javascript.) добавил div класса main : .main {min-width:1000px} и завернул всё в него. Всё стало работать корректно (пустота справа от шапки при уменьшении размера окна не появляется). Но это исправило дело только для всех обозревателей кроме IE. Тут вышел из ситуации используя експрешн так: <style type="text/css"> .main { width:expression(document.documentElement.clientWidth < 1000 ? "1000px" : "auto"); } </style> <comment> <style type="text/css"> /* Для всех других кроме IE */ .main {min-width:1000px} </style> Но как видите использован javascript. Подскажите пожалуйста, есть ли в данном случае какая-либо альтернатива яваскрипту, уж очень не хочется лишний раз его использовать ещё и по причине того, что в броузере появляется сообщение: " Броузер в целях безопасности заблокировал activex, разрешаете ли вы выполнение..."
  24. Newbie
    Это я ошибся второпях. Прошу прощения. шапка и содержимое позиционировано не absolute, а relative (в своём первом посте уже исправил) /*css*/ .shapka {background-image : url(img/shap5right.gif); width:814;height : 250; background-repeat : no-repeat; float:right;border:0 solid black;margin-top: -30px;} .tabl {float:right; } .bigimage {position:relative;float:right; background-image : url(img2/image.jpg); height : 598; width:1000; background-repeat : no-repeat;margin-bottom:-20px } /*html*/ <body> <div class='shapka'> </div> <table class='tabl' border='1' width='814px' height='15' > <TR border='1' align='center'> <td border='1' width='200px'> Первая ссылка</td> <td border='1' width='390px'> Вторая ссылка</td> <td border='1' width='200px'>Третья</td> </TR> </table> <div class='clear'> </div> <div class='bigimage'> </div> </body>
  25. Newbie
    Подскажите, пожалуйста. Есть страница, которая состоит из : -шапки (имеет параметр float:right и width: 800px} -блока кнопок (горизонтального под шапкой) -содержимого (одно изображение, размером width:1000 height:500, позиционировано как и шапка position: relative float:right) Задумано, чтобы шапка при уменьшении размеров окна оставалась"прилипшей" к правому краю. На всех страницах нет проблем, кроме как с этой из-за большого изображения на ней. При уменьшении размеров окна (меньше 1000px) появляются полосы прокрутки. И при прокручивании назад видно, что шапка сдвинулась влево, как и задумывалось, но справа от шапки появляется пустое место. Как избежать появления пустого места справа от шапки?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept