Как сделать изображение в html прозрачным? - PullRequest
6 голосов
/ 16 ноября 2011

У меня есть HTML-файл, и я хочу вставить изображение. Изображение должно быть прозрачным.То, что я делаю сейчас - сначала идет изображение, а после его завершения идет текст и другие изображения.Как добавить прозрачное изображение в HTML?Это мой код сейчас:

<img src="result_files\image003.png" alt="some_text"/>

Ответы [ 4 ]

17 голосов
/ 16 ноября 2011

Попробуйте использовать непрозрачность (и фильтр для IE)

<img src="result_files\image003.png" alt="some_text" style="opacity:0.4;filter:alpha(opacity=40);"/>

Теперь я понимаю ваш вопрос, ответ примерно такой:

 <div style="background:url(image.jpg)"> the content here </div>
0 голосов
/ 13 марта 2017

Вот как сделать его прозрачным, вставьте его в свой javascript и отредактируйте по своему усмотрению.

	<a href="http://www.hlgjyl888.com/data/wallpapers/30/WDF_780770.png"><img onmouseover="bigImg(this)" onmouseout="normalImg(this)" src="http://www.hlgjyl888.com/data/wallpapers/30/WDF_780770.png" style="position:fixed; right:10px; bottom:20px; width:80px; height:80px; border:none; cursor:pointer; background:none;"></a>

	<script>
		function bigImg(x) {
		x.style.height = "120px";
		x.style.width = "120px";
		x.style.opacity = "0.2";
	}

		function normalImg(x) {
		x.style.height = "80px";
		x.style.width = "80px";
		x.style.opacity = "100";
		}
	</script>

x.style.opacity говорит браузеру установить непрозрачность, если при копировании этого в ваш документ есть еще несколько вещей, которые вы должны знать ...

style="position:fixed; right:10px; bottom:20px; Позиционирует его в правом нижнем углу страницы.

cursor:pointer; Делает указатель курсора неизменным во всех или почти во всех браузерах.

Надеюсь, это поможет вам!

0 голосов
/ 16 ноября 2011

, если вы хотите, чтобы изображение было фоном, должно быть

HTML

<div class="content">
...content...
</div>

CSS

.content {
background-image:url('imageurl.jpg');
}
0 голосов
/ 16 ноября 2011

Используйте прозрачность свойства CSS или просто сделайте png прозрачным в редакторе изображений.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...