Работает,если шрифт в папке фонтс присутствует,а так не хочет.Остается проблема. Ещё одна проблема возникла - при обновлении странички возвращается шрифт по-умолчанию! Как от этого избавиться ?!
Всем привет кто сможет помочь не опытному в написание или подсказать как написание с-крина суть такова вот к примеру MSI WindBOX III – мини-ПК на Intel GS45 c «сердцем» Core 2 Duo это названия клика ешь переходишь на эту статью и затем ссылка рекламы открывается в другом окне
PHP: <script> function okno() { window.open('test.htm','new','width=300,height=500,toolbar=1'); } </script> <html> <center><img src="ololo.jpg" width=30% height=30% onClick="okno()"></img></center> </html> Ну,это если ты хочешь ссылку-картинку,по клику на которую у тебя открывалось бы окно. Вместо test.htm пропиши урлу твоей рекламы.
свои шрифты подключаются 1) только .eot (Open Type так называемый) 2) этого лучше не делать - причиной является безопасность пользователя - скорее на сайт человек просто не зайдет увидев орущую систему безопасности Вот тут конвертиш шрифты в кроссбраузерный еот. Только смотри, чтобы шрифты были оптимизированы под кириллицу. ЕОТ работает, проверено
Welemir, все вопросы по не стандартным шрифтам сейчас умеет решать скрипт cufon. это максимально кросбраузерно и требует минимум усилий со стороны программиста (+индексируется поисковиками). Code: <script src='java/cufon-yui.js' type='text/javascript'></script> <script src='java/SuperMyFontName.font.js' type='text/javascript'></script> <script type='text/javascript'> Cufon.replace('h1', { fontFamily: 'super my font 2010'}); </script> вот сама библиотека: http://cufon.shoqolate.com/js/cufon-yui.js вот генератор js из шрифтов: http://cufon.shoqolate.com/generate/
Нужно сделать кнопки для сайта.Есть 2 изобжение , 1 как главное и нужно что бы при наводе на эту кнопку 1 картинка менялась на 2.И при нажатии переходила на мою ссылку
Code: <a title="title" href="http://site.com"> <img src="some_image1.png" onmouseover="this.src='some_image2.png';" onmouseout="this.src='some_image1.png';"/> </a>
Есть блог на вордпрессе. На главной выводятся (при помощи доп. поля) превью видюшек. Форма вывода: <object data="http://www.youtube.com/v/<?php echo stripcslashes($fvideo); ?>" type="application/x-shockwave-flash" width="110" height="80" style="border: 2px solid gray;"><param name="movie" value="http://www.youtube.com/v/<?php echo stripcslashes($fvideo); ?>" /><param name="wmode" value="transparent"/></object> Как сделать так, чтобы при клике на видео, оно не воспроизводилось в маленьком окошке, а либо разворачивалось на весь экран, либо пользователь переходил на канал ютуба с этим видеороликом (как вариант, на страницу сайта, где также выложен этот ролик)
Левый сайт бар, с синим бэком. Вот хочу его растянуть, что б он до футера был, пишу height: 100%; но это не помогает, как его растянуть до футера аж вниз?
height:100%; будет отрабатываться нормально во всех браузерах. В другом месте косяк ищи. А именно, ищи, почему у тебя 100% заканчиваются там, а не около футера Какой-то элемент мешает. web developer поставь и отслеживай, кто там засел.
У того блока прописано position: relative; Расположен он, точнее его родительскими дивами есть wrapper и middle, у них обоих прописано height: 100%; но все равно не растягивается до конца. Кста, меняю значение вместо 100% на любое другое, ничего не меняется, значит css не обращает внимание на это почему то.
Edward, может в css где-то ниже прописано width жёстко? попробуй height:100%!important; так, теста ради. А вообще, правильно OSW говорит - исходники показывай.
Доверстал, вот скрин HTML исходник Code: <div id="wrapper"> <div id="header"> <a href="/"><img src="img/header_left.gif" /></a> <img style="float: right; position:relative; top: -150px;" src="img/header_right.jpg" /> </div><!-- #header--> <div id="middle"> <div id="container"> <div id="content"> <div id="sitebar_top"> <ul> <li><a href="/">Главная</a></li>| <li><a href="/">Форум</a></li>| <li><a href="/">Регистрация</a></li>| <li><a href="/">Галерея</a></li>| </ul> </div><!-- #sitebar_top--> <p> <strong>Высшие кулинарные курсы в Москве</strong><br /> Вас приветствует Центр кулинарного мастерства VIP-Masters. Основной задачей центра является качественное обучение и повышение квалификации шеф-поваров, кондитеров, а также всех желающих. Помимо тематических кулинарных курсов, ориентированных на особенности приготовления блюд и традиции той или иной национальной кухни, в нашем центре представлен широкий выбор кондитерских курсов, а также популярные в последние годы курсы карвинга. Также нашими специалистами разработаны специальные кулинарные курсы для любителей, которые только начинают постигать секреты кулинарного мастерства. Вы можете записаться на любой кулинарный курс и пройти обучение в наших профессионально-оборудованных классах в Москве. Центр кулинарного мастерства VIP-Masters сотрудничает с Московским государственным учебным заведением, что позволяет выдавать дипломы государственного образца о повышении квалификации.</p> </div><!-- #content--> </div><!-- #container--> <div class="sidebar" id="sideLeft"> <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> </ul> </div> <!-- .sidebar#sideLeft --> <div class="sidebar" id="sideRight"> <div id="reklam"> <div id="imag" align="center"> <img src="img/img1.gif" /> <img src="img/img2.gif" /> <img src="img/img3.gif" /> </div> </div><!-- reklam --> <div id="stat"> <div class="title"> <p>Ближайшие курсы</p> </div><!-- .Title --> <div class="news"> <ul> <li>23 - 27 июля - <ins>Авторские конфеты ручного приготовления</ins></li> <li>26 - 30 июля - <ins>Средиземноморская кухня</ins></li> <li>10 - 14 августа - <ins>Карвинг. Художественное вырезание овощей и фруктов</ins></li> <li>17 - 21 августа - <ins>Мастерство работы с карамелью</ins></li> </ul> </div><!-- .News --> <div class="title"> <p>Новости Центра</p> <div class="news"> <ul> <li>23 - 27 июля - <ins>Авторские конфеты ручного приготовления</ins></li> <li>26 - 30 июля - <ins>Средиземноморская кухня</ins></li> <li>10 - 14 августа - <ins>Карвинг. Художественное вырезание овощей и фруктов</ins></li> <li>17 - 21 августа - <ins>Мастерство работы с карамелью</ins></li> </ul> </div><!-- .News --> </div><!-- .Title --> </div><!-- .Stat --> </div><!-- .sidebar#sideRight --> </div><!-- #middle--> </div><!-- #wrapper --> <div id="footer"> <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> </ul> <p>Центр кулинарного мастерства "VIP Master" - <ins>Высшие кулинарные курсы</ins></p> </div><!-- #footer --> Code: * { margin: 0; padding: 0; } html { height: 100%; } body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; } a { color: blue; outline: none; text-decoration: underline; } a:hover { text-decoration: none; } p { margin: 0 0 18px } img { border: none; } input { vertical-align: middle; } #wrapper { width: 1000px; margin: 0 auto; min-height: 100%; height: auto !important; height: 100%; } /* Header -----------------------------------------------------------------------------*/ #header { height: 145px; width: 1000px; background: #FFE680; float: left; } /* Middle -----------------------------------------------------------------------------*/ #middle { width: 100%; padding: 0 0 100px; height: 100%; } #middle:after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; } #container { width: 100%; float: left; overflow: hidden; height: 100%; } #content { padding: 0 370px 0 270px; background: #990033; width: 400px; margin-left: -120px; height: 500px; background-image:url(img/content_bg.gif); } #content p { color: #FFFFFF; } #content p { padding-left: 20px; } /* Sidebar Left -----------------------------------------------------------------------------*/ #sideLeft { float: left; width: 150px; height: 250px; padding-top: 250px; margin-left: -100%; position: relative; background: #FCE1CC; border-right: 2px solid #000; border-left: 2px solid #000; } #sideLeft a { list-style-type: none; margin: 10px; height: 100%; color: #964355; margin-left: 10px; } #sideLeft a:hover { list-style-type: none; margin: 10px; height: 100%; color: #FF5149; margin-left: 10px; } /* Sidebar Right -----------------------------------------------------------------------------*/ #sideRight { float: left; margin-right: -3px; width: 350px; margin-left: -350px; position: relative; background: #FFACAA; height: 500px; } #reklam { width: 130px; height: 100%; float: right; background: #FCE1CC; } #imag { margin-top: 20px; margin-bottom: 20px; } #stat { width: 220px; height: 100%; float: left; background: #fff; border: thin solid #333333; position:relative; top: -100%; } .title { width: 200px; height: 20px; background: #5F0119; margin: auto; margin-top: 15px; } .title p { color: #FFFFFF; font-weight:bold; margin: auto; text-align:center; } .news { width: 150px; margin:auto; } .news li { font-size: 10px; color: #905A68; line-height: 10px; margin:5px; } /* Sidebar Top -----------------------------------------------------------------------------*/ #sitebar_top { height: 20px; width: 496px; border: 2px solid #000000; background: #FCE1CC; } #sitebar_top li { display: inline; margin: 0 10px; } #sitebar_top a { color: #130100; text-decoration: none; } /* Footer -----------------------------------------------------------------------------*/ #footer { width: 1000px; margin: -100px auto 0; height: 100px; background: #840022; color:#FFFFFF; } #footer li { display: inline; } #footer a { color:#FFFFFF; font-size:14px; margin:10px; } #footer p { margin: 10px; font-size:10px; } Размеры фиксированные в пикселах, и процентах так и не работает.
Эмм... Не особо понял смысла некоторых строк: При float: left; зачем-то делать: margin-left: -100%; ? Плохая идея с height: 250px; padding-top: 250px; Зачем извращаться с паддингами, если можно блок ссылок спозиционировать самостоятельно? Ну и, конечно, height: 100% у a и a:hover убило нах Ну как бы в твоем сверстанном варианте я лично не вижу проблем. Если у тебя проблема с резиновой версткой, то нужно выкладывать крин и код именно резиновой верстки.
Вот поуказывал в процентах Левый блок растягивается только, покуда содержится в нем что то, правый вообще куда то улетел. А вот что будет, если убрать вот то margin-left: -100%; Исходники резиновой верстки Code: <div id="wrapper"> <div id="header"> <a href="/"><img src="img/header_left.gif"></img></a> <img style="float: right; position:relative; top: -150px;" src="img/header_right.jpg"></img> </div><!-- #header--> <div id="middle"> <div id="container"> <div id="content"> <div id="sitebar_top"> <ul> <li><a href="/">Главная</a></li>| <li><a href="/">Форум</a></li>| <li><a href="/">Регистрация</a></li>| <li><a href="/">Галерея</a></li>| </ul> </div><!-- #sitebar_top--> <p> <strong>Высшие кулинарные курсы в Москве</strong><br /> Вас приветствует Центр кулинарного мастерства VIP-Masters. Основной задачей центра является качественное обучение и повышение квалификации шеф-поваров, кондитеров, а также всех желающих. Помимо тематических кулинарных курсов, ориентированных на особенности приготовления блюд и традиции той или иной национальной кухни, в нашем центре представлен широкий выбор кондитерских курсов, а также популярные в последние годы курсы карвинга. Также нашими специалистами разработаны специальные кулинарные курсы для любителей, которые только начинают постигать секреты кулинарного мастерства. Вы можете записаться на любой кулинарный курс и пройти обучение в наших профессионально-оборудованных классах в Москве. Центр кулинарного мастерства VIP-Masters сотрудничает с Московским государственным учебным заведением, что позволяет выдавать дипломы государственного образца о повышении квалификации.</p> </div><!-- #content--> </div><!-- #container--> <div class="sidebar" id="sideLeft"> <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> </ul> </div> <!-- .sidebar#sideLeft --> <div class="sidebar" id="sideRight"> <div id="reklam"> <div id="imag" align="center"> <img src="img/img1.gif"></img> <img src="img/img2.gif"></img> <img src="img/img3.gif"></img> </div> </div><!-- reklam --> <div id="stat"> <div class="title"> <p>Ближайшие курсы</p> </div><!-- .Title --> <div class="news"> <ul> <li>23 - 27 июля - <ins>Авторские конфеты ручного приготовления</ins></li> <li>26 - 30 июля - <ins>Средиземноморская кухня</ins></li> <li>10 - 14 августа - <ins>Карвинг. Художественное вырезание овощей и фруктов</ins></li> <li>17 - 21 августа - <ins>Мастерство работы с карамелью</ins></li> </ul> </div><!-- .News --> <div class="title"> <p>Новости Центра</p> <div class="news"> <ul> <li>23 - 27 июля - <ins>Авторские конфеты ручного приготовления</ins></li> <li>26 - 30 июля - <ins>Средиземноморская кухня</ins></li> <li>10 - 14 августа - <ins>Карвинг. Художественное вырезание овощей и фруктов</ins></li> <li>17 - 21 августа - <ins>Мастерство работы с карамелью</ins></li> </ul> </div><!-- .News --> </div><!-- .Title --> </div><!-- .Stat --> </div><!-- .sidebar#sideRight --> </div><!-- #middle--> </div><!-- #wrapper --> <div id="footer"> <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> </ul> <p>Центр кулинарного мастерства "VIP Master" - <ins>Высшие кулинарные курсы</ins></p> </div><!-- #footer --> Code: * { margin: 0; padding: 0; } html { height: 100%; } body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; } a { color: blue; outline: none; text-decoration: underline; } a:hover { text-decoration: none; } p { margin: 0 0 18px } img { border: none; } input { vertical-align: middle; } #wrapper { width: 1000px; margin: 0 auto; min-height: 100%; height: auto !important; height: 100%; } /* Header -----------------------------------------------------------------------------*/ #header { height: 145px; width: 1000px; background: #FFE680; float: left; } /* Middle -----------------------------------------------------------------------------*/ #middle { width: 100%; padding: 0 0 100px; height: 100%; } #middle:after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; } #container { width: 100%; float: left; overflow: hidden; height: 100%; } #content { padding: 0 370px 0 270px; background: #990033; width: 400px; margin-left: -120px; height: 500px; background-image:url(img/content_bg.gif); } #content p { color: #FFFFFF; } #content p { padding-left: 20px; } /* Sidebar Left -----------------------------------------------------------------------------*/ #sideLeft { float: left; width: 150px; height: 100%; position: relative; background: #FCE1CC; border-right: 2px solid #000; border-left: 2px solid #000; } #sideLeft a { list-style-type: none; margin: 10px; height: 100%; color: #964355; margin-left: 10px; } #sideLeft a:hover { list-style-type: none; margin: 10px; height: 100%; color: #FF5149; margin-left: 10px; } /* Sidebar Right -----------------------------------------------------------------------------*/ #sideRight { float: left; margin-right: -3px; width: 350px; margin-left: -350px; position: relative; background: #FFACAA; height: 100%; } #reklam { width: 130px; height: 100%; float: right; background: #FCE1CC; } #imag { margin-top: 20px; margin-bottom: 20px; height: 100%; } #stat { width: 220px; height: 100%; float: left; background: #fff; border: thin solid #333333; position:relative; top: -100%; } .title { width: 200px; height: 20px; background: #5F0119; margin: auto; margin-top: 15px; } .title p { color: #FFFFFF; font-weight:bold; margin: auto; text-align:center; } .news { width: 150px; margin:auto; } .news li { font-size: 10px; color: #905A68; line-height: 10px; margin:5px; } /* Sidebar Top -----------------------------------------------------------------------------*/ #sitebar_top { height: 20px; width: 496px; border: 2px solid #000000; background: #FCE1CC; } #sitebar_top li { display: inline; margin: 0 10px; } #sitebar_top a { color: #130100; text-decoration: none; } /* Footer -----------------------------------------------------------------------------*/ #footer { width: 1000px; margin: -100px auto 0; height: 100px; background: #840022; color:#FFFFFF; } #footer li { display: inline; } #footer a { color:#FFFFFF; font-size:14px; margin:10px; } #footer p { margin: 10px; font-size:10px; }
