很多时候需要给body添加一个背景图片，同时对北京图片稍微做透明处理，保证背景图片不会影响主体的显示。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>背景图片半透明</title>
<style>
.opacity9 { position:absolute;top:0px;left:0px;margin:0px;padding:0px;width:100%; height:100%;
filter:alpha(Opacity=90);-moz-opacity:0.9;opacity: 0.9;z-index:-1; background-color:#ffffff; }
</style>
</head>
<body STYLE="background:url(4312391_110032574158_2.jpg);overflow:hidden;">
<div class="opacity9"></div>
<!--
原理：1 给body添加背景图片，2 添加一个全屏大小或者超大的绝对定位的div(1500 x 1000)并调整大小；3 设置透明度。4 z-index=-1(否则覆盖后边的)<br/>
提示：直接给带有背景图片的DOM添加透明是没用的。
-->
<div style="float:left;margin-left:100px;margin-top:100px;background:url(map1.png) no-repeat;width:300px;height:300px;border:1px solid red;">
<!-- 第二次使用这个样式注意：
1 手动调整宽度和高度，以及left和top
2 设置z-index =0,否则被body的背景覆盖
3 容器内部的div要设置position，同时要设置z-index=1,否则容器内容被当前背景覆盖。
-->
<div class="opacity9" style="left:109px;top:109px;width:300px;height:300px;z-index:0"></div>
<div style="position:relative;z-index:1;margin:0px;padding:0px;">
我的地图：1111111111111
</div>
</div>
<div style="float:left;margin-left:100px;margin-top:100px;background:url(map1.png) no-repeat;width:300px;height:300px;border:1px solid red;">
<!-- 第二次使用这个样式注意：
1 手动调整宽度和高度，以及left和top
2 设置z-index =0,否则被body的背景覆盖
3 容器内部的div要设置position，同时要设置z-index=1,否则容器内容被当前背景覆盖。
-->
<div class="opacity9" style="left:511px;top:109px;width:300px;height:300px;z-index:0"></div>
<div style="position:relative;z-index:1;margin:0px;padding:0px;">
我的地图：12222222222222222222222
</div>
</div>
</body>
</html>
要点是：1 设置position；2调整大小后以及left和top；3给背景图片div和主体div都要设置正确的z-index
重点强调：只有设置了position，z-index才会生效
愤怒的coder - 周六还在干活
- 大小: 292.4 KB
分享到：
相关推荐
总的来说，易语言PNG图片透明背景源码提供了一种在易语言环境下处理PNG透明效果的方法。通过研究源码和相关文档，开发者不仅可以学会如何在易语言中处理图像的透明度，还能加深对易语言图形界面设计的理解，提升自己...
### 制作背景色透明的图片 #### 背景介绍 在图形设计与网页制作领域，图片背景的处理是一项非常重要的技术。特别是在需要将图片嵌入到不同颜色或图案的背景下时，背景透明的图片可以更好地融合整体设计，提高视觉...
### 使用JavaScript将图片背景变为透明的方法 在Web开发过程中，我们常常需要处理各种各样的图片。其中一项常见的需求就是让图片的背景变为透明，这样可以使图片更好地融入网页的整体设计之中。本文将详细介绍如何...
易语言PNG图片透明背景源码,PNG图片透明背景,释放字节流,创建字节流,取字节流指针,取字节流尺寸,取出字节集,置窗口PNG外型,Gdiplus_初始化,GdipCreateFromHDC,GdipLoadImageFromFile,GdipLoadImageFromStream,...
在MATLAB中，修改图片背景颜色或将其转换为透明是一个常见的图像处理任务，这在创建图形用户界面（GUI）或进行图像合成时尤其有用。这个名为"MATLAB.zip_change color_matlab图片背景_matlab改图片为透明_motherib9_...
### WPF中使jpg,bmp图片背景透明的方法 #### 概述 Windows Presentation Foundation (WPF) 是由微软推出的一款强大的图形系统，该系统运行在.NET Framework 3.0架构下，为用户界面、2D/3D图形、文档和多媒体提供了...
"图片背景透明工具加强版"是一款专为用户提供高效抠图服务的软件，它允许用户轻松地将图片的背景去除，使图像呈现出透明效果。下面将详细阐述这款软件的特点、功能以及可能涉及的技术知识点。 首先，抠图是图像编辑...
加载图（Loading）通常用于表示内容正在加载或者等待用户操作，而透明背景的gif图片则能更好地融入各种界面设计，无论背景色如何变化，都能保持良好的融合度。 1. **GIF格式**：GIF是一种常用的图像文件格式，支持...
那么这篇文章将详细介绍了这几种背景图片的处理方法。 正如前面所说，仅仅依靠CSS现有的属性，我们无法实现背景裁切、背景透明度、背景变换和复杂背景定位等效果.为了实现这些效果，我们需要借助CSS的其他方法来实现...
### C# 文字转透明背景图片技术解析 #### 技术背景 在软件开发过程中，尤其是Web应用和移动应用的开发中，经常需要将一些文本信息转换成图片的形式，以便更好地进行展示或存储。而在某些应用场景下，比如制作图标、...
这些控件在默认情况下是不支持透明背景的，这可能导致界面显示不美观，尤其是在需要自定义背景或者与其他透明元素交互时。本篇文章将详细探讨如何在MFC（Microsoft Foundation Classes）环境下实现这些常用控件的...
标题"pb图片透明,文本透明"以及描述中提到的"利用API使用单色文图及文本的透明"，都是关于如何在PowerBuilder中实现图像和文本的透明度控制。 首先，我们来讨论一下“透明文本”。在PowerBuilder中，默认情况下，...
在这个例子中，我们使用了Graphics对象的DrawString方法来绘制文本，使用了透明的画刷（Brushes.Transparent）来绘制文本，使得文本不会覆盖背景图片。 另外，为了显示背景图片，我们需要在窗体的Load事件或其他...
在网页设计中，有时我们需要实现一个效果：让`div`元素的背景图片具有透明度，但其中的文字保持不透明。这个需求可以通过CSS样式来...通过以上方法，你可以灵活地创建出背景图片透明，而文字仍然清晰可见的网页元素。
由于IE7以下不支持图片的背景的透明.根据IE特性,我们可以用IE的滤镜来实现透明处理 你只要包含下面这个pngfix.js文件就行,如下: <!--[if lt IE 7]> <script defer type="text/javascript" src="/Js/pngfix.js"></...
在“MiniGUI按键切换图片，背景图片，控件透明”的主题下，我们将深入探讨MiniGUI中的关键概念和技术。 首先，我们要理解如何在MiniGUI中使用按键切换图片。在嵌入式系统中，通常没有鼠标或触控屏幕，因此按键是...
Java GUI 背景图片添加方法 在 Java 中添加背景图片到 GUI 界面是一项常见的需求。通过使用 Java 的图形用户界面（GUI）组件，例如 JFrame、JPanel、JLabel 等，可以轻松地将背景图片添加到 GUI 界面中。本文将详细...
在IE6浏览器中，PNG图像格式的透明特性一直是一个棘手的问题。由于IE6不完全支持PNG8或PNG24的Alpha透明效果，这导致许多设计师在构建网站时遇到困难，尤其是在需要...通过这些资源，可以实际操作和理解上述透明方法。
易语言PNG图片透明背景源码例程程序结合易语言扩展界面支持库和应用接口支持库，调用API函数实现PNG图片作为窗口的透明背景。点评：本源码是易语言PNG图片的应用实例。 @易语言难学吗。
本文将详细介绍两种在InTouch中实现图片背景透明的方法。 #### 方法一：通过ArchestrA图符编辑器插入PNG格式图片 这种方法适用于InTouch 2014R2及更高版本。 1. **创建新型InTouch应用程序** 在InTouch应用程序...