|
|
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Подскажите в какой способ возможно реализовать вывод изображения с оформлением декоративных углов, как вот на https://www.free-lance.ru/freelancers/ (первые три картинки-примеры работ с оформлением правого верхнего и нижнего левого углов). Можно, конечно, поизучать исходную разметку, но там так всё закручено, особенно с файлами стилей. Может, кто и подскажет как просто это реализовать с помощью html/css. Спасибо. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 02.11.2012, 23:13:30 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
avolik, Нарисуйте картинку угла Не парьтесь с CSS 3 ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 00:01:43 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Да, это несложно нарисовать картинку угла. Но проблема в том, что эта картинка угла (углов) должна быть поверх исходного изображения, а не рядом, создавая отступ. Отступы не нужны, необходимо именно поверх поместить "уголки". ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 00:32:23 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Думаю в сторону z-index - верно ли?! ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 00:36:33 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
avolik, Тю, так там же и есть обработанные в графическом редакторе картинки. Никаких фокусов, только ловкость рук. ))) Купи фотошоп да и нарисуй! ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 03:26:32 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
avolikДумаю в сторону z-index - верно ли?! вернее некуда z-index, position:relative, position:absolute вот, в чем сила, брат ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 04:33:45 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Развиваем тему. Фотошоп - дело очень даже хорошее, сам балуюсь на неплохом уровне. НО. Сейчас задача стоит програмно накладывать углы на изображение. Идея в использовании CSS и, как подсказал, Ифреймов Вася, всё не так сложно. Выходит, необходимо создать изображение требуемого размера с прозрачным фоном и оформленными по необходимости углами (это предоставляет тип .png) и с помощью CSS просто накладывать поверх требуемой картинки. Так?! ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 17:53:48 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Вот ты надоедливый! Твой вопрос не стоит создания целой темы. 1. Создаешь контейнер, где отображается твоя картинка. Обязательное условие - position:relative (или absolute, fixed, если другое позиционирование). 2. В этот контейнер помещаешь контейнер с background из png-картинки с двумя "уголками", но размер должен совпадать с родительским (или с допусками, если вводные другие). 3. Либо (что более универсально) помещаешь 2 контейнера с position:absolute и размерами по размерам "уголков" с абсолютным позиционированием (left, right, top, bottom в зависимости от "прижимания к краям" родителя). P.S. Еще вопросы в эту сторону без кода автоматически закроют тему. Тут нечего больше спрашивать. Пробуй, экспериментируй. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 18:15:41 |
|
||
|
Наложение графического оформления на изображение
|
|||
|---|---|---|---|
|
#18+
Спасибо, друг! Вот это именно то, что я хотел услышать. Я не верстальщик, а кодер серверного кода. Просто верстать некому, вот и приходится. Конкретно ответ не был дан ранее, вот я и надоедал. Надо стучать и только тогда отворят :) А надоедливый я не потому, что такой, а потому, что требуется точно понять что делать и делать сразу правильно. Как только ответ прозвучал, я иду работать над этим вопросом. Спасибо за более детальное описание, спасибо! Тебе желаю приятных выходных! ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 03.11.2012, 23:12:47 |
|
||
|
|
start [/forum/topic.php?fid=22&msg=38024187&tid=1449161]: |
0ms |
get settings: |
6ms |
get forum list: |
12ms |
check forum access: |
3ms |
check topic access: |
3ms |
track hit: |
62ms |
get topic data: |
10ms |
get forum data: |
8ms |
get page messages: |
36ms |
get tp. blocked users: |
1ms |
| others: | 196ms |
| total: | 337ms |
| 0 / 0 |
