|
Внимание! Теперь для входа на форум необходимо вводить единый пароль регистрации сервисов sibnet.ru!
Здравствуйте, гость ( Вход | Регистрация )
Сейчас обсуждают
 
| |
Web-мелочи, Обмен опытом по конкретным проблемам web-дизайна |
|
|
mephisto |
24.3.2009, 14:07
|
ортодоксальный линуксоид
Группа: VIP
Сообщений: 7 724
Регистрация: 17.11.2007
Из: столицы вашей родины
Пользователь №: 10 849
|
Цитата(SlavaJS @ 24.3.2009, 12:51) А вот и конкретный вопрос (и не последний): Как фоновую картинку растянуть на весь экран? Не замостить, а именно растянуть. Так, чтобы она сохраняла пропорции при любом разрешении экрана и размере окна браузера?
JS
|
|
|
|
SlavaJS |
24.3.2009, 14:15
|
Молчун
Группа: Sibnet-club
Сообщений: 65
Регистрация: 23.12.2008
Из: Саяногорск
Пользователь №: 69 431
Репутация: 2
|
Цитата(mephisto @ 24.3.2009, 13:07) JS
А такое вообще возможно? Или тоже JS?
|
|
|
|
mephisto |
24.3.2009, 14:41
|
ортодоксальный линуксоид
Группа: VIP
Сообщений: 7 724
Регистрация: 17.11.2007
Из: столицы вашей родины
Пользователь №: 10 849
|
Цитата(SlavaJS @ 24.3.2009, 13:15) А такое вообще возможно? Или тоже JS?
С помощью JavaScript сделать можно, как с помощь CSS можно сделать не знаю, скорей всего просто нельзя.
|
|
|
|
(-=Dargin=-) |
24.3.2009, 15:52
|
.
Группа: Пользователи
Сообщений: 471
Регистрация: 8.12.2007
Из: Барнаула
Пользователь №: 12 820
Репутация: 43
|
Не ты один сталкиваешься с этой проблемой Вот решение на CSS. Не айс, но вариант. 2mephisto расскажи о чем ты про js?
|
|
|
|
mephisto |
24.3.2009, 17:46
|
ортодоксальный линуксоид
Группа: VIP
Сообщений: 7 724
Регистрация: 17.11.2007
Из: столицы вашей родины
Пользователь №: 10 849
|
Цитата((-=Dargin=-) @ 24.3.2009, 14:52) 2mephisto расскажи о чем ты про js?
Да собственно почти то же самое, что привёл ты, но масштабировать картинку предполагал с помощью JS. Собственно оно и так там с помощью JS масштабируется вроде.
|
|
|
|
dima75 |
29.3.2009, 22:34
|
радость в жизни - это когда есть кто-то рядом.
Группа: Sibnet-club
Сообщений: 958
Регистрация: 11.10.2007
Из: Новосибирск
Пользователь №: 7 686
Репутация: 66
|
Цитата(SlavaJS @ 29.3.2009, 21:41) Еще две проблемы: 1. Как на рисованной кнопке расположить текст? 2. Как сделать так, чтобы при наведении курсора на текст, он (текст) менял цвет на другой, например с черного на красный? Если можно прстыми тегами, напишите, какими.
1) сделать картинку кнопки фоновым изображением через CSS .knopka{background:url(knopka.jpg)} <td class=knopka>Тут текст кнопки</td> 2) <p>бла бла бла</p> p{color:000;} p:hover{color:red}
|
|
|
|
(-=Dargin=-) |
30.3.2009, 15:22
|
.
Группа: Пользователи
Сообщений: 471
Регистрация: 8.12.2007
Из: Барнаула
Пользователь №: 12 820
Репутация: 43
|
Поправлю слегка. Цитата(dima75 @ 29.3.2009, 21:34) 1) сделать картинку кнопки фоновым изображением через CSS .knopka{background:url(knopka.jpg)} <td class=knopka>Тут текст кнопки</td>
Код .knopka{background:url(knopka.jpg) no-repeat; line-height: Высота картинки px; } <a href="/" class=knopka>Тут текст кнопки</a> Цитата(dima75 @ 29.3.2009, 21:34) 2) <p>бла бла бла</p> p{color:000;} p:hover{color:red}
:hover работает только с ссылками. Для обычных элементов использовать лучше js Код <p onmouseover="this.style.color='red';" onmouseout="this.style.color='#000';">текст</p>
|
|
|
|
(-=Dargin=-) |
2.4.2009, 18:54
|
.
Группа: Пользователи
Сообщений: 471
Регистрация: 8.12.2007
Из: Барнаула
Пользователь №: 12 820
Репутация: 43
|
» Спойлер (нажмите, чтобы прочесть) « Цитата Изучаем list-stylelist-style - задает параметры маркера или номера позиции списка. Заменяет атрибуты list-style-image, list-style-position и list-style-type. Значения этих атрибутов могут располагаться в любом порядке. list-style: [{list-style-image}] [{list-style-position}] [{list-style-type}]; Значение по умолчанию disk outside none. Поддерживается IE начиная с 4.0 list-style-image - задает графическое изображение, отображаемое в качестве маркера позиции списка. Имеет приоритет над атрибутом list-style-type. list-style-image: none|url({Интернет-адрес файла изображения}); Если задано предопределенное значение none, то стиль маркера берется из установок атрибута list-style-type, если он задан, или отображается маркер по умолчанию. Если задан интернет-адрес файла изображения, то оно отображается в качестве маркера, перекрывая установки атрибута list-style-type. Значение по умолчанию none. Поддерживается IE начиная с 4.0 list-style-position - задает местонахождение маркера позиции списка: в тексте позиции или вне его. list-style-position: outside|inside; Доступны два значения. Значение outside (по умолчанию) задает отображение маркера позиции списка вне текста позиции. Значение же inside заставляет Web-обозреватель отобразить маркер позиции в ее тексте в качестве первого символа. Поддерживается IE начиная с 4.0 list-style-type - задает тип маркера или номер позиции списка. list-style-type: disc|circle|square|decimal|lower|roman|upper-roman|lower-alpha|upper-alpha|none; list-style-type: disc; - (значение по умолчанию) отображает сплошной кружок; list-style-type: circle; - окружность; list-style-type: square; - сплошной квадрат; list-style-type: decimal; - нумерует позиции арабскими цифрами; list-style-type: lower-roman; - малыми римскими; list-style-type: upper-roman; - большими римскими; list-style-type: lower-alpha; - помечает позиции малыми латинскими буквами; list-style-type: upper-alpha; - большими латинскими; list-style-type: none; - вообще убирает маркер или нумерацию. Поддерживается IE и NN начиная с 4.0 (с) Источник В твоем случае: Код <ul style="list-style: url(foto.jpg);"> ... </ul>
|
|
|
|
Serega_pc |
2.4.2009, 23:29
|
Молчун
Группа: Пользователи
Сообщений: 22
Регистрация: 6.5.2008
Пользователь №: 31 906
Репутация: 0
|
Цитата((-=Dargin=-) @ 1.4.2009, 20:53) ПробуйХотя может в начале показать трудноватым. Спасибо! Но чёт всеравно ни канает. Хотя делю всё по инструкции. Руки откуда надо растут Оставлю я эту затею . Как наберусь опыта побольше, так уже и испытаем. Пока не охота замораживаться.
|
|
|
|
Magic+ |
3.4.2009, 9:39
|
Молчун
Группа: Пользователи
Сообщений: 42
Регистрация: 22.6.2007
Пользователь №: 473
Репутация: 1
|
А, вот такой вопрос! Я думаю, это тоже мелочь, конечно, но все ; таки неприятно. Не отображается фавикон почему-то. В смысле в поиске в Яндексе не отображается. Почему это может происходить? Фавикон делал по всем правилам, размер соответствует(16х16), расширение ICO, 894 байта всего. Лежит в корне сайта, причем уже прошло много времени, сайт не раз уже проиндексирован. Делал его и сам и с помощью онлайн сервиса - все бесполезно! Прописывал в тегах, хотя на другом сайте ничего в тегах не прописывал, а фавикон показывается. Т.е. можно прописать, а можно и нет я так понимаю, все равно должен отображаться. Вот задачка то! Кстати, во всех браузерах, в строке навигации и на вкладках, все кажет норм. Нету только на странице Яндекса.
Сообщение отредактировал Magic+ - 3.4.2009, 9:42
|
|
|
|
Adobe |
3.4.2009, 16:56
|
Поддерживает разговор
Группа: Sibnet-club
Сообщений: 142
Регистрация: 4.3.2009
Из: Колпашево
Пользователь №: 87 864
Репутация: 0
|
Цитата(dima75 @ 3.4.2009, 13:41) каждой страницы с которой хочешь показать значок омфг, а index зачем?))
|
|
|
|
And(R)ey |
6.4.2009, 22:23
|
Группа: Sibnet-club
Сообщений: 3 989
Регистрация: 10.8.2007
Из: Бийск
Пользователь №: 3 633
|
Цитата((-=Dargin=-) @ 30.3.2009, 15:22) Поправлю слегка. Позвольте и мне поправить вас. Цитата((-=Dargin=-) @ 30.3.2009, 15:22) Код .knopka{background:url(knopka.jpg) no-repeat; line-height: Высота картинки px; } <a href="/" class=knopka>Тут текст кнопки</a> Кто научил использовать ссылки вместо кнопок? Был вопрос: Цитата(SlavaJS @ 29.3.2009, 21:41) 1. Как на рисованной кнопке расположить текст? Мы за семантический веб: Код button { background:url(%imageurl%); }
<button>text</button> Если надо, настраивешь отступы, убираешь границы. Цитата((-=Dargin=-) @ 30.3.2009, 15:22) :hover работает только с ссылками. Для обычных элементов использовать лучше js Код <p onmouseover="this.style.color='red';" onmouseout="this.style.color='#000';">текст</p> Смотрим спецификацию: http://www.w3.org/TR/CSS/selector.html#dyn...-pseudo-classesЦитата The :hover pseudo-class applies while the user designates an element (with some pointing device), but does not activate it. For example, a visual user agent could apply this pseudo-class when the cursor (mouse pointer) hovers over a box generated by the element. User agents not supporting interactive media do not have to support this pseudo-class. Some conforming user agents supporting interactive media may not be able to support this pseudo-class (e.g., a pen device). Здесь о ссылках ничего не говорится.. :hover работает со всеми элементами. Нерабочий :hover - бага IE6. Для него есть скрипт который учит его псевдо-классам, альфа-каналу png и еще кое чего исправляет. Сообщение отредактировал And(R)ey - 6.4.2009, 22:30
|
|
|
|
(-=Dargin=-) |
7.4.2009, 14:49
|
.
Группа: Пользователи
Сообщений: 471
Регистрация: 8.12.2007
Из: Барнаула
Пользователь №: 12 820
Репутация: 43
|
Семантика в HTML для сайтов с оформлением аля w3c.org. И лучше ставить упор не на неё, а учиться кроссбраузерности, что бы не использовать никаких хаков и отдельных стилей. ИЕ6 до недавнего времени был основным браузером, и то что он обрабатывает :hover для a и a img это уже спецификация.
|
|
|
|
1 чел. просматривают этот форум (гостей: 1, скрытых пользователей: 0)
Пользователей: 0
|