Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 20.03.2016, 15:43   #1
Illusiony
Форумчанин
 
Регистрация: 17.02.2014
Сообщений: 881
По умолчанию Рамка внутри изображения

Ситуация:
У меня изначально для рамки внутри изображения использовалось:
Код:
<img style='outline: 2px solid #FF0000; outline-offset: -2px' id='carta33' src='
Но теперь у меня используется большее изображение, из него выводится только внутренняя часть , а не все.

Я подвинул рамку куда мне нужно сделав outline-offset: -37px.
Но свойство outline-offset не имеет отдельных значений для всех четырех сторон, а только общее для всех. То есть у меня теперь рамка только сверху и слева, а снизу и справа нету.

Каким способом мне сделать желаемое теперь? только путем помещение внешнего изображения рамки с 100% прозрачностью внутри и накладывать на изображение в нужную позицию?
Illusiony вне форума Ответить с цитированием
Старый 21.03.2016, 14:51   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

https://jsfiddle.net/1n277v6a/
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 21.03.2016, 19:07   #3
Illusiony
Форумчанин
 
Регистрация: 17.02.2014
Сообщений: 881
По умолчанию

Цитата:
Сообщение от Naive Посмотреть сообщение
Спасибо.

Последний раз редактировалось Illusiony; 21.03.2016 в 19:31.
Illusiony вне форума Ответить с цитированием
Старый 10.04.2016, 19:54   #4
Illusiony
Форумчанин
 
Регистрация: 17.02.2014
Сообщений: 881
По умолчанию

Теперь еще одна задачка:
Было так :
Код:
<style type='text/css'>
.screenshot{
	float:left;
	
	  overflow:hidden;   /* this is important */
	position:relative; /* this is important too */

	display: inline-block;
	line-height: 0;
	width:65px;
	height:45px;

	}
.screenshot img{
	position:absolute;
	
	width:94px; /*новая ширина*/
	height:136px; /*новая длина*/

	top:-15px;/* сдвиг от верха*/
	left:-6px;/* сдвиг слеваleft:-6px;*/
	}

	
.screenshot.img_myclass:after{
	position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  border: 2px solid #f00;
  content: '';
	}
Код элемента:
Код:
$(number_h_p).append(\"<a   class='screenshot img_myclass'  href='' rel='http://**********/\"+mas_b_cod[data[5]]+\"'><img   id='carta11' src='http://********/\"+mas_b_cod[data[5]]+\"'
Таких элементов может быть множество

Таким образом у меня формировалась рамка вокруг вырезанного кусочка из изображения.

Но теперь я передаю не отдельно каждую картинку, а одну длинную картинку. И для вывода рамки одинаковый CSS не подходит, нужно для каждого элемента свои значения top CSS. Не знаю как это реализовать.

Если в
Код:
<img style
запихнуть
Код:
position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border: 2px solid #f00;content: '';
сделать то оно портит координаты вырезки изображения, а в
Код:
<a   class='screenshot img_myclass'
тоже не получается.

Последний раз редактировалось Illusiony; 10.04.2016 в 20:29.
Illusiony вне форума Ответить с цитированием
Старый 11.04.2016, 19:44   #5
Illusiony
Форумчанин
 
Регистрация: 17.02.2014
Сообщений: 881
По умолчанию

Нашел решение.
Оказалась моя невнимательность.
Illusiony вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Рамка Image Pilyla Общие вопросы Delphi 2 15.05.2013 06:15
Обработка одномерных массивов, СИ. задание внутри, и написанный мною текст программы тоже внутри. кое-что нужно исправить.. Амелия Общие вопросы C/C++ 6 02.04.2012 20:03
Рамка shanluu Общие вопросы Delphi 2 30.04.2011 23:35
Нахождение слов-анаграмм, Ошибка выдается. Задание внутри. Код внутри. TYMON Общие вопросы .NET 2 22.11.2010 21:07
Рамка Vladya Помощь студентам 2 12.11.2008 23:54