如何设置HTML图片的背景颜色为透明的？_教程

1、首先新建一个记事文本，重新命名背景颜色.html，按回车确认，如下图所示。

2、回到桌面选中新创建的背景颜色.html文件，右键选择记事本打开，然后在记事本中手动输入图中代码，这是一个标准的html头尾格式。

3、在<body>中添加代码：bgcolor="#000000"，保存。

4、这时在桌面打开背景颜色.html，打开页面显示为黑色背景，如下图所示就完成了。

要使图片在html文件中背景图片透明的字不透明，可以使用背景图片的透明类型或者使用<div>标签来实现。

1、使用背景图片透明类型:

首先，在html文件中添加 <style>标签，然后使用CSS的filter属性,让图片的背景变成半透明或完全透明：

<style>

body {

background-image: url(“image.jpg”) // 设置图片背景

filter: alpha(opacity=50) // 透明度50%

opacity: 0.5 // 设置透明度

}

</style>

2、使用<div>标签来实现:

用<div>标签来将背景图片和文本分开，为<div>设置背景图片，利用CSS的 opacity 属性来控制其透明度：

<p>这里是文本内容</p>

</div>

<style>

.background-image {

background-image: url(“image.jpg”)// 设置背景图片

opacity: 0.5 // 设置透明度

}

</style>

欢迎分享，转载请注明来源：内存溢出

如何设置HTML图片的背景颜色为透明的？