Как сделать изображение полупрозрачным?

@vamfirius · Регистрация: 16.06.2010

Студворк — интернет-сервис помощи студентам

В каком формате надо сохранять изображение, чтобы оно было полупрозрачным? Или может это можно сделать в html или css? Перепробовал кучу форматов, просмотрел все свойства css, ничего не получается. Помогите плиз.

@IamSCORPION · 16.06.2010, 18:53

Сообщение от vamfirius

В каком формате надо сохранять изображение, чтобы оно было полупрозрачным? Или может это можно сделать в html или css? Перепробовал кучу форматов, просмотрел все свойства css, ничего не получается. Помогите плиз.

http://www.tigir.com/opacity.htm

CSS
1
2
3
4
5
6
img {
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/
    -moz-opacity: 0.3; /* Mozilla 1.6 и ниже */
    -khtml-opacity: 0.3; /* Konqueror 3.1, Safari 1.1 */
    opacity: 0.3; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9 */
}

@xxxNEIxxx · 16.06.2010, 21:16

я считаю что проще будет 2 минуты посидеть в фотошопе))))))
а сохранять нужно в "png". во первых качество норм сохраняет, во вторых прозрачность

@vamfirius · 17.06.2010, 08:33 **[ТС]**

Зачем вообще это делать через CSS если надо прописывать для каждого браузера, когда png это проще удобней и стабильней? Спс за помощь, вариант с png по моему лучше, хотя я css занимаюсь без году неделя и может просто не знаю каких-то тонкостей.

@romchiksoad · 17.06.2010, 22:41

Сообщение от xxxNEIxxx

а сохранять нужно в "png". во первых качество норм сохраняет, во вторых прозрачность

Что бы сохранялась прозрачность, то нужно сохранять в png-24 ( полноцветный ), а не png-8( индексированные цвета )

@Paronoik · 17.06.2010, 23:49

фотошоп рулит

@xxxNEIxxx · 18.06.2010, 14:37

Сообщение от Paronoik

фотошоп рулит

полностью с тобой согласен!

@outoftime · 18.06.2010, 21:04

Для старых браузеров нужно знать как изменять прозрачность, как на меня проще написать https://www.cyberforum.ru/post808643.html а не мораться в фотошопе и смотреть с унылым лицом на свои труды с компа заказчика на котором стоит ИЕ 6.

@xxxNEIxxx · 18.06.2010, 21:55

outoftime, согласен, но это же спецыально для ИЕ 5 и 6, а для всех остальных браузеров лучше делать ПНГ чем морочить себе голову и добавлять лишние стили и т д

@outoftime · 18.06.2010, 22:35

Не по теме:

xxxNEIxxx, все упирается в конкретное ТЗ, сказали нужно ИЕ 6 значит нужно, и с этим не поспоришь. А если комуто сделать что-то или для себя прикинуть "как всё будет" то и фотошопа вполне хватает.

@xxxNEIxxx · 18.06.2010, 22:51

я привык делать png, так как получаю вёрстки с прозрачностью, и всего лишь дописываю строку для ИЕ 6 и мне кажется что так проще. Тем более я обожаю фотошоп, так что мне в нём работать одно удовольствие

И у каждого свой "почерк" написания вёрсток и решение проблем, так что как говорится "о вкусах не спорят"

@outoftime · 18.06.2010, 22:55

Не по теме:

о вкусах нет, но и первый и второй способ имеет свои плюсы и минусы, поэтому нужно либо закрывать тему либо четко написать что к чему.

@xxxNEIxxx · 18.06.2010, 23:11

так как у меня опыт в вёрстке явно меньше чем у тебя, то мне скорее нужно прислушатся к тебе, но можешь написать хоть пару причин чем лучше использовать "стили для прозрачности под каждый браузер" чем "пнг + стиль под ИЕ6"? и ещё одно, эти стили делают полупрозрачное изображение из не прозрачного, или же они учат браузеры понимать полупрозрачность?

З.Ы. правда нужно уже закрывать разговор, а то мы завели из-за фигни какой то

Добавлено через 2 минуты
как я понял по коду то "делают полупрозрачное изображение из не прозрачного".

@outoftime · 19.06.2010, 07:39

Сообщение от xxxNEIxxx

как я понял по коду то "делают полупрозрачное изображение из не прозрачного".

Это ты правельно понял. На счет опыта сказать не могу, но явной разницой между *.png + css for IE и *.jpg + нужные филтры под все версии браузеров является вес. *.jpg весит намного меньше *.png если не верешь можешь поексперементировать, а если у тебя на сайте 100+ изображений ты завставляешь юзверя ждать, ждать и еще раз ждать, короче тот сердится, кроме того когда сервак прогружен на 100%, при хорошей посещалке, опять таки юзаем *.jpg экономим серверное время, ну и соответственно деньги за его оренду или на его расширение, если это свой серв.
Кроме того знать как сделать чтоугдно полупрозрачным нужно, не всегда, но может пригодится, к примеру, когда нужно сделать целую часть сайта прозрачным, просто кидаем прозрачность на див в котором нужное нам содержимое.

Не по теме:

Если я в чем ошибся буду рад выслушать замечания.

@xxxNEIxxx · 19.06.2010, 13:49

насчёт того что "*.jpg весит намного меньше *.png" - я вкурсе, но png лучше сохраняет цвета, но всё таки насчёт "загрузки" сайта я полностью с тобой согласен.

Сообщение от outoftime

к примеру, когда нужно сделать целую часть сайта прозрачным

- согласен.

но всё таки мне кажется "научить" ИЕ6 понимать прозрачность .png тоже важный момент. когда мы делаем закругленные края то прийдётся. ну я например это делаю скриптом который работает просто отлично, я просто бросаю файл в папку и в css прописываю одну маленькую строчку и вуаля

кароч мне кажется что можно зделать вывод: Если у вас есть картинки с закруглёнными краями и там будет прозрачность то нужно учить ИЕ6 видеть прозрачность, а если вам просто нужно сделать полупрозрачность то:

CSS
1
2
3
4
5
6
img {
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/
    -moz-opacity: 0.3; /* Mozilla 1.6 и ниже */
    -khtml-opacity: 0.3; /* Konqueror 3.1, Safari 1.1 */
    opacity: 0.3; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9 */
}

@romchiksoad · 19.06.2010, 19:09

Сообщение от xxxNEIxxx

Если у вас есть картинки с закруглёнными краями и там будет прозрачность то нужно учить ИЕ6 видеть прозрачность

или рисовать закругленные углы на таком же фоне, что и страница...тогда ничему и никого учить не прийдется

@xxxNEIxxx · 19.06.2010, 19:13

согласен

но это работает в том случае если бекграунд однотонный или градиент по ОХ.

@romchiksoad · 19.06.2010, 19:24

Сообщение от xxxNEIxxx

но это работает в том случае если бекграунд однотонный или градиент по ОХ.

Я думаю, что чаще всего так и есть

@xxxNEIxxx · 19.06.2010, 19:33

согласен)))

Новые блоги и статьи Все статьи Все блоги /
Программный контроль заполнения реквизита табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать контроль заполнения реквизита табличной части. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/	Программная установка даты и запрет ее изменения Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .	Вывод данных в справочнике через динамический список Maks 01.04.2026 Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .
Функция заполнения текстового поля в реквизите формы документа Maks 01.04.2026 Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .	К слову об оптимизации kumehtar 01.04.2026 Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .	Идея фильтра интернета (сервер = слой+фильтр). Hrethgir 31.03.2026 Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .	Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда anaschu 31.03.2026 В прикрепленном документе раздумья о том, как можно поменять модель в будущем

@vamfirius 1 / 1 / 0 Регистрация: 16.06.2010 Сообщений: 13

	Как сделать изображение полупрозрачным? 16.06.2010, 18:22. Показов 9819. Ответов 18 Метки нет (Все метки) В каком формате надо сохранять изображение, чтобы оно было полупрозрачным? Или может это можно сделать в html или css? Перепробовал кучу форматов, просмотрел все свойства css, ничего не получается. Помогите плиз. 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	16.06.2010, 21:16
	я считаю что проще будет 2 минуты посидеть в фотошопе)))))) а сохранять нужно в "png". во первых качество норм сохраняет, во вторых прозрачность 0

@vamfirius 1 / 1 / 0 Регистрация: 16.06.2010 Сообщений: 13
	17.06.2010, 08:33 [ТС]
	Зачем вообще это делать через CSS если надо прописывать для каждого браузера, когда png это проще удобней и стабильней? Спс за помощь, вариант с png по моему лучше, хотя я css занимаюсь без году неделя и может просто не знаю каких-то тонкостей. 0

@Paronoik 281 / 22 / 3 Регистрация: 15.05.2010 Сообщений: 407
	17.06.2010, 23:49
	фотошоп рулит 0

@outoftime ║XLR8║ 1212 / 909 / 270 Регистрация: 25.07.2009 Сообщений: 4,360 Записей в блоге: 5
	18.06.2010, 21:04
	Для старых браузеров нужно знать как изменять прозрачность, как на меня проще написать https://www.cyberforum.ru/post808643.html а не мораться в фотошопе и смотреть с унылым лицом на свои труды с компа заказчика на котором стоит ИЕ 6. 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	18.06.2010, 21:55
	outoftime, согласен, но это же спецыально для ИЕ 5 и 6, а для всех остальных браузеров лучше делать ПНГ чем морочить себе голову и добавлять лишние стили и т д 0

@outoftime
	18.06.2010, 22:35
	Не по теме: xxxNEIxxx, все упирается в конкретное ТЗ, сказали нужно ИЕ 6 значит нужно, и с этим не поспоришь. А если комуто сделать что-то или для себя прикинуть "как всё будет" то и фотошопа вполне хватает. 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	18.06.2010, 22:51
	я привык делать png, так как получаю вёрстки с прозрачностью, и всего лишь дописываю строку для ИЕ 6 и мне кажется что так проще. Тем более я обожаю фотошоп, так что мне в нём работать одно удовольствие И у каждого свой "почерк" написания вёрсток и решение проблем, так что как говорится "о вкусах не спорят" 0

@outoftime
	18.06.2010, 22:55
	Не по теме: о вкусах нет, но и первый и второй способ имеет свои плюсы и минусы, поэтому нужно либо закрывать тему либо четко написать что к чему. 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	18.06.2010, 23:11
	так как у меня опыт в вёрстке явно меньше чем у тебя, то мне скорее нужно прислушатся к тебе, но можешь написать хоть пару причин чем лучше использовать "стили для прозрачности под каждый браузер" чем "пнг + стиль под ИЕ6"? и ещё одно, эти стили делают полупрозрачное изображение из не прозрачного, или же они учат браузеры понимать полупрозрачность? З.Ы. правда нужно уже закрывать разговор, а то мы завели из-за фигни какой то Добавлено через 2 минуты как я понял по коду то "делают полупрозрачное изображение из не прозрачного". 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	19.06.2010, 19:13
	согласен но это работает в том случае если бекграунд однотонный или градиент по ОХ. 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	19.06.2010, 19:33
	согласен))) 0