Jump to content

Sedli

Newbie
  • Posts

    14
  • Joined

  • Last visited

Everything posted by Sedli

  1. Большое спасибо - js то, что нужно
  2. Ну, если так правильнее. Только выбранная ссылка все равно остается активной и никак не меняется.
  3. Спасибо. В хроме тоже работает. Может посоветуете, как лучше?
  4. Ребята, здравствуйте. Помогите, пожалуйста, человеку совершенно не знакомому с js. Ситуация следующая: есть центральное изображение, которое меняется при клике по ссылке. Но сама активная ссылка при этом никак не выделяется. Вот как можно убрать у нее подчеркивание? Спасибо. function change (a) { document.example_img.src=a; } <h2 class="vvc">Text</h2> <p><a href="javascript:change ('vvc_15.jpg')">text_1</a></p> <p><a href="javascript:change ('vvc_30.jpg')">text_2</a></p> <p><a href="javascript:change ('vvc_45.jpg')">text_3</a>/p> <p><a href="javascript:change ('vvc_60.jpg')">text_4</a></p> <div><img class="route" src="vvc_15.jpg" name="example_img" alt="text" width="952" height="391" /></div>
  5. Всем привет. Есть такая проблема - я расположил изображения на странице с помощью списка по горизонтали. При меньшем разрешении то что не влезает переносится на следующую строку. Но, если добавить к изображениям подписи, нижняя строка начинает съезжать вправо. Никак не могу от этого избавиться. Помогите!
  6. Нда, уже успел понять, что выходит полная фигня. Воспользовался float:right и стало как то полегче. Что ж, будем продолжать набивать руку. Спасибо!
  7. Спасибо, Влад. Да, если убрать float содержимое выравнивается по центру всей страницы. Но, у меня справа от content стоит еще один блок (для этого и прописал float). А я хочу добиться, чтобы содержимое выравнивалось по центру 60%-ного content. В голову пока приходит, только если ввести еще один блок внутрь content с width:80% и значением margin:0 auto. О! Кажется работает.
  8. Всем привет. Столкнулся с небольшой проблемой и никак не могу ее разрешить. Помогите, пожалуйста! Допустим, у нас есть контейнер .content внутри которого текст и небольшая галерея. У меня никак не получается выровнять содержимое content по центру. Margin:0 auto для content не помогает. Text-align выравнивает только текст. Пробовал взять img в <p> - результата не принесло. В общем, вопрос пустяковый, но он никак мне не дается. Дайте совет. p's: поиск по форуму почему-то не работает. <head> .content { width:60%; float:left; } .gallery { float:left; margin:4% 7% 4% 0; } .gallery2 { float:left; margin:5% 7% 0 10%; } .gallery P { margin:0 auto 5px; text-align:center; } .gallery2 P { margin:0 auto 5px; text-align:center; } </head> <body> <div class="content"> <div class="gallery"> <img src="" alt="new1" width="150" height="150" /> <p><a href="">Text</a></p> </div> <div class="gallery"> <img src="" alt="new2" width="150" height="150" /></p> <p><a href="">Text</a> </div> div class="gallery"> <img src="" alt="new3" width="150" height="150" /> <p><a href="">Text</a></p> </div> <div class="clear"></div> <div class="gallery2"> <img src="" alt="new4" width="150" height="150" /> <p><a href="">Text</a></p> </div> <div class="gallery2"> <img src="" alt="new5" width="150" height="150" /> <p><a href="">Text</a></p> </div> <div class="clear"></div>
  9. Всем привет. Очень понравилась как сделана галерея тут: http://www.volkswagen.ru/ru/ru/models/new_polo/gallery.html Подскажите, пожалуйста, как лучше и проще можно реализовать что-то подобное? С учетом того, что jQuery знаю на уровне "это сюда, это туда - о, работает". И дальше, чем знание html/css я пока не продвинулся. Спасибо!
  10. Добрый день! Помогите, пожалуйста, решить одну проблему - при увеличении формата страницы через Ctrl+scroll блоки начинают наезжать друг на друга, а горизонтальная полоса прокрутки появляется только на 170%. Как можно их зафиксировать? Сам код: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Слои по горизонтали</title> <style type="text/css"> .body { text-align: center; margin: 0; background-image: url(grad.png); background-repeat: repeat-x; background-color: rgb(200,200,200); font-size: 12pt; font-family: Arial, sans-serif; } A { color: #3366CC; } A:visited { color: #330033; } A:active { color: #333333; text-decoration: none; } A:hover { color: #CC0033; } .logo { width: 15%; height: 90px; float: left; margin-bottom: 20px; } .logo P { margin-left: 20px; } .menu { float: left; height: 90px; text-align: center; width: 60%; } ul { list-style: none; } li { float: left; padding: 10px; background: #FFFFFF; font-size: 105%; } .phone { float: right; width: 25%; height: 90px; font-size: 200%; text-align: left; font-family: Times New Roman, serif; } .phone P { padding-right: 15px; color: #FF3300; } .clear { clear: left; } .x2content { width: 48%; float: left; text-align: left; padding-left: 2%; padding-top: 2%; } .zagolovok { font-family: Times New Roman, serif; font-size: 180%; } .zagolovok A { color: black; } .zagolovok A:hover { text-decoration: none; } .image { float: left; margin-right: 50px; } .characterization { font-size: 75%; color: #333333; } .price { color: white; font-size: 160%; font-weight: 600; } .i2content { width: 50%; float: left; text-align: left; padding-top: 2%; } .content { width: 68%; float: left; text-align: left; font-size: 100%; font-family: Times New Roman, serif; } .content P, H3 { padding-left: 30px; padding-right: 80px; } .news { width: 26%; float: right; border-left: 2px dotted; padding-left: 2%; padding-right: 2%; text-align: left; } .newscont { font-size: 75%; color: #333333; } .newsdate { font-size: 60%; color: #333333; } .newszag { font-weight: bold; font-size: 75%; } </style> </head> <body class="body"> <div class="logo"> <p><img src="" alt=""></p> </div> <div class="menu"> <ul> <li><a href="#">О компании</a></li> <li><a href="#">Модели и цены</a></li> <li><a href="#">Аксессуары</a></li> <li><a href="#">Сервисный центр</a></li> <li><a href="#">Новости</a></li> <li><a href="#">Прокат</a></li> <li><a href="#">Проведение промо-акций</a></li> <li><a href="#">Контакты</a></li> </ul> </div> <div class="phone"> <p>(495) 333-55-66</p> </div> <div class="clear"></div> <div class="x2content"> <p><span class="zagolovok"><a href="#">Текст</a></span></p> <div class="image"><a href="#"><img src="" alt="2"></a></div> <div class="characterization"> <table cellspacing="0" cellpadding="3"> <tr><td colspan="2" align="center" bgcolor="#0099CC"><spanclass="price">цена</span></td></tr> <tr><td></td><td></td></tr> <tr><td>Максимальная скорость..............</td><td></td></tr> <tr><td>Дальность пробега........................</td><td></td></tr> <tr><td>Вес устройства................................</td><td></td></tr> <tr><td>Аккумуляторы..................................</td><td></td></tr> <tr><td>Дорожный просвет........................</td><td></td></tr> <tr><td height="40px"><a href="#">Подробнее</a></td><td></td></tr> </table> </div> </div> <div class="i2content"> <p><span class="zagolovok"><a href="#">Текст</a></span></p> <div class="image"><a href="#"><img src="#" alt="1"></a></div> <div class="characterization"> <table cellspacing="0" cellpadding="3"> <tr><td colspan="2" align="center" bgcolor="#0099CC"><span class="price">цена</span></td></tr> <tr><td></td><td></td></tr> <tr><td>Максимальная скорость..............</td><td></td></tr> <tr><td>Дальность пробега........................</td><td></td></tr> <tr><td>Вес устройства................................</td><td></td></tr> <tr><td>Аккумуляторы..................................</td><td></td></tr> <tr><td>Дорожный просвет........................</td><td></td></tr> <tr><td height="40px"><a href="#">Подробнее</a></td><td></td></tr> </table> </div> </div> <div class="clear"></div> <div class="content"> <h3>Пример заголовка</h3> <p>Пример текста</p> </div> <div class="news"> <p><span class="zagolovok"><a href="#">Новости</a></span></p> <table border="0" cellpadding="0" cellspacing="0"> <tr><td valign="top" rowspan="3" width="110px"><a href="#"><img src="#" alt="news1"></a></td> <td><span class="newszag">Заголовок</span></td></tr> <tr><td><span class="newsdate">Дата</span></td></tr> <tr><td span class="newscont"><a href="#">Новость</a></td></tr> </table> <p></p> <table border="0" cellpadding="0" cellspacing="0"> <tr><td valign="top" rowspan="3" width="110px"><a href="#"><img src="#" alt="news2"></a></td> <td><span class="newszag">Заголовок</span></td></tr> <tr><td><span class="newsdate">Дата</span></td></tr> <tr><td span class="newscont"><a href="#">Новость</a></td></tr> </table> <p></p> <table border="0" cellpadding="0" cellspacing="0"> <tr><td valign="top" rowspan="3" width="110px"><a href="#"><img src="#" alt="news3"></a></td> <td><span class="newszag">Заголовок</span></td></tr> <tr><td><span class="newsdate">Дата</span></td></tr> <tr><td span class="newscont"><a href="#">Новость</a></td></tr> </table> </div> <div class="clear"></div> </body> </html>
  11. Sedli

    Верстка div

    Спасибо, Влад! В следующий раз обязательно буду использовать [ code ] и [ /code ]. А этот пример выводится на первом месте в гугле по запросу "кодировка div". Если это такой ужас, буду смотреть другие источники.
  12. Здравствуйте! Только начал осваивать CSS, и никак не могу понять одну вещь в дивовой верстке. На одном сайте увидел пример: <div style="background:#A485B8;">1<br>text</div> <div style="position:relative;" id="dopoln_block"> <div style="background:#66AAD7; width:200px; position: absolute; top:10px; left:10px;">2<br>текст</div> </div> <div style="background:#C6C600;">3<br>содержимое</div> Здесь вводится дополнительный блок <div style="position:relative;" id="dopoln_block">. Собственно вопрос - зачем? На форуме данного сайта ответа не было. Если убрать этот блок "2 Текст" съезжает наверх. Можно привести более расширенный пример: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Шаблон верстки страницы из 3 колонок</title> <style type="text/css"> * { margin:0px; padding:0px; } html { height:100%; } body { min-height:100%; position:relative; min-width:800px; } * html body { height:100%; } #header { background:#9393FF; height:70px; width:100%; } #content { width:100%; padding-bottom:60px; width:expression(document.body.clientWidth > 800 ? "100%" : "800px"); overflow:hidden; } #container1 { width:100%; float:left; margin-right:-180px; } #container2 { background:#000000; margin-right:180px; } #container3 { width:100%; float:right; margin-left:-200px; } #left { background:#AEAE00; width:200px; float:left; } #center { background:#D86927; margin-left:200px; } #right { background:#C0C0C0; float:right; width:180px; } #min_width { width:800px; } #footer { position:absolute; bottom:0px; background:#8F9EB1; width:100%; height:60px; } </style> </head> <body> <div id="header">Заголовок страницы</div> <div id="content"> <div id="container1"> <div id="container2"> <div id="container3"> <div id="center">Центральная колонка</div> </div> <div id="left">Левая колонка</div> </div> </div> <div id="right">Правая колонка</div> </div> <div id="footer">Копирайт</div> </body> </html> Опять же не понятно, зачем нужны container1, container2,conteiner3. Буду очень благодарен за ответ! С Уважением, Вячеслав
×
×
  • 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