Обычно когда мы загружаем веб-страничку и на ней есть рисунки, то наведя на какой-нибудь рисунок мышку и нажав правую кнопку, мы можем просмотреть свойства рисунка (увидеть его размер, адрес). А тут наткнулся на сайт с таким хитрым рисунком, который своих свойств не показывает... Не могу даже в теле страницы найти ссылку на этот рисунок... Вот по этому адресу http://wmhstudio.ru/about/ вверху слева этот рисунок в виде трех «девайсов». Подскажите, каким кодом вставлен этот рисунок. P.S. Этот рисунок также и «недвигающийся», в отличие от обычного, на который наведя стрелку мышки и нажав левую кнопку, мы можем его как-бы двигать.
Обычное фоновое изображение background-image: url('logo.png'); В FF правой кнопкой -> показать фоновое изображение
Вставка рисунка как фон, это не способ, это наша цель. А вот каким образом мы этой цели достигаем это и есть способ Вот кстати вопрос, яваскрипт умеет вставлять картинку как фон?
Т.е. всего три способа: 1) непосредственно HTML (ну или xhtml); 2) CSS 3) Яваскрипт. Какой из них для вставки фонового рисунка лучше?
Я не знаю. Яваскриптом тоже фон не вставлял. Но подозреваю, что не обязательно в тексте странички хтмл идет код яваскрипта со вставкой фона, т.к. яваскрипт можно подключать отдельным файлом, как выяснилось в теме «включен не включен?».
Способа два: 1. <img src="logo.png"/> 2. <div style="backgorund-image: url('logo.png');"></div> С помощью JavaScript можно либо вставить <img> с нужным src, либо вставить <div> с нужным style или class, либо присовить нужный style или class существующему div. Ну или не div, а кому-нибудь еще. Некоторые товарищи, не желающие отдавать картинки добровольно делают <img src="1x1.gif" width="200" height="80"/> и ставят ему фоном необходимую картинку (1x1.gif - однопиксельный прозрачный гиф). Лучше кому?
Мы немного о другом. Мы о способах которые разделяются в зависимости от «орудий труда», т.е. в чем именно (то ли в HTML, то ли в CSS, то ли в JavaScripte) находится эта ссылка. Т.е., как в примере, загрузили хтмл страничку и увидели на ней фоновый рисунок, но ссылки на фоновый рисунок в этой хтмл страничке нет, потому что ссылка на него пошла из CSS. Вот три способа и нарисовалось. Чё, картинку закрывают пикселом? Что-то новое… А зачем это нужно? Ну не пользователям же Ну их От них только головная боль Нам. Админам сайтов.
Щелкнул правой кнопкой мыши, "сохранить как…", а в итоге получаешь «пустую» картинку. Многих это отпугивает Яндексу, вот, надоело, что его карты по всем сайтам торчат — тоже такую «защиту» сделали. Другой вопрос: а зачем админу сайта вся эта хрень, чем ему обычный img не угодил?
Ааааа, вот оно в чем дело! Значит сама картинка - backgrоund, а сверху пиксель? Странно... А если картинок несколько? Сергей89, чем тебе обычный img не угодил?
Суть вопроса в том, что backgrоund это ведь последний слой. А если он последний, то им рисунок не перекрыть, это ведь его рисунок перекрывает? Потом я вчитался в эту фразу: и подумал, может ты ошибся... Т.е. наоборот, однопиксельный растянутый гиф идет наперед, но выступает в роли обычного рисунка, а нормальный рисунок прячется за этим гифом, но является backgrоund-ым...
Я вроде бы это и написал. src - однопиксельный прозрачный гиф, бэкграунд - картинка, которая показывается
Это я запутался Смотрел карты Яндекса... Однопиксельного .gif не видел, видел трехсотпиксельный .png. Наверно однопиксельный неналазит Т.е. особой разницы не было.