Красивая окантовка вокруг картинок

Тема в разделе "Внешний вид, шаблоны, графика", создана пользователем MIB, 02.01.2008.

Статус темы:
Закрыта.
  1. MIB
    Offline

    MIB Недавно здесь

    Регистрация:
    02.01.2008
    Сообщения:
    6
    Симпатии:
    0
    Добрый день уважаемое сообщество!

    Уже третий день ищу хоть какую-нибудь подсказку по моему вопросу. Спрашивал Поиск, Гугл, доки и тишина...
    А суть в следующем: На многих сайтах видел эффект, когда картинки, используемые в тексте имеют красивую окантовку. Не просто рамку, а например эффект тени, загнутый край или ещё что-то. Заметил, что при попытке скачать/скопировать картинку, качается только картинка без эффектов. Значит имеет место наложение картинка+эффект. Притом размеры картинок могут быть самые разные. Эффект как-то накладывается динамически. Как это реализуемо? Я не силён в пхп/хтмл.
    Может есть какой модуль для этого? Укажите, пожалуйста, в каком направлении копать?

    Заранее всем большое спасибо!
     
  2.  
  3. Dead Krolik
    Offline

    Dead Krolik специалист

    Регистрация:
    13.04.2007
    Сообщения:
    3 688
    Симпатии:
    101
    Пол:
    Мужской
    Ответ: Красивая окантовка вокруг картинок

    Покажи пример сайта, я уверен что это просто CSS-класс красивый у нее.
     
  4. MIB
    Offline

    MIB Недавно здесь

    Регистрация:
    02.01.2008
    Сообщения:
    6
    Симпатии:
    0
    Ответ: Красивая окантовка вокруг картинок

    Ну например здесь. Очень красиво смотрится. На сегодняшнем этапе меня ещё пугают слова css, php и т.д.
    Но Джумла очень понравилась по функциональности. Помогите плиз. :[
     
  5. Offline

    moxjemi Недавно здесь

    Регистрация:
    03.01.2008
    Сообщения:
    1
    Симпатии:
    0
    Ответ: Красивая окантовка вокруг картинок

    Если посмотреть код страницы по ссылке выше то вылазит описание класса ссылки в CSS .avatar в котором описан background фон ссылки под фотографией. Это и есть т.н. красивая окантовка.
     
  6. MIB
    Offline

    MIB Недавно здесь

    Регистрация:
    02.01.2008
    Сообщения:
    6
    Симпатии:
    0
    Ответ: Красивая окантовка вокруг картинок

    Да, я догадывался, что это описано в стилях, но беда в том, что я не знаю как это реализовать у себя :( Могли бы вы подсказать как примерно должно выглядеть описание css - класса и пример его применения в контенте Джумлы. Например обычная вставка картинки {mosimage}. А как с учётом применения класса из css с обрамлением?

    Добавлено через 1 час 7 минут
    Свершилось чудо! :yahoo:
    Добавил в css дополнительный класс "avatar" с обрамлением. Теперь при вызове html-кода:
    Код (CODE):
    1. <a href="http://mysite.ru" class="avatar"><img src="http://mysite.ru/images/spring.png" width="90" height="90" alt="Image" /></a>

    всё прекрасно отрисовывается. Спасибо огромное!
    Но! а как работать с этим классом в связке с {mosimage}? Ничего в голову не приходит. Если вставлять ссылки в режиме хтмл то редактор вырезает фрагмент с указанием класса и картинка получается обычной, без окантовки. Подскажите плиз, что делать? Заранее спасибо всем!
     
    Последнее редактирование: 03.01.2008
  7. Fanamura
    Offline

    Fanamura Доброта

    Регистрация:
    12.03.2007
    Сообщения:
    5 108
    Симпатии:
    159
    Пол:
    Мужской
    Ответ: Красивая окантовка вокруг картинок

    в css пропиши
    .mosimage {
    }
     
  8. MIB
    Offline

    MIB Недавно здесь

    Регистрация:
    02.01.2008
    Сообщения:
    6
    Симпатии:
    0
    Ответ: Красивая окантовка вокруг картинок

    Хм... логично. Попробую так сделать. А вообще решил этот вопрос не через {mosimage}, а путём стандартной функции вставки изображения в текст. Там оказывается можно указать класс из css для изображения, а я не знал. Спасибо вам за помощь! Всё красиво смотрится.
    [!]
     
Статус темы:
Закрыта.

Поделиться этой страницей

Загрузка...