需要准备的材料分别有：电脑、chrome浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。
2、在index.html中的<img>标签中新增样式代码：style="opacity: 0.2"。
3、浏览器运行index.html页面，此时设置的图片的背景颜色是透明的。
1、首先新建一个记事文本，重新命名背景颜色.html，按回车确认，如下图所示。
2、回到桌面选中新创建的背景颜色.html文件，右键选择记事本打开，然后在记事本中手动输入图中代码，这是一个标准的html头尾格式。
3、在<body>中添加代码：bgcolor="#000000"，保存。
4、这时在桌面打开背景颜色.html，打开页面显示为黑色背景，如下图所示就完成了。
问题分析：HTML的标签可以使用CSS的background-color来设置背景颜色以及透明度。
举例如下：
以下示例将分别演示不透明、50%透明度以及20%透明度的三种不同效果。
HTML代码：
123456789
<div id="test-1"> 我是黑色背景，不透明的。</div><div id="test-2"> 我是黑色背景，50%透明度。</div><div id="test-3"> 我是黑色背景，20%透明度。</div>
CSS代码：
123456789101112131415161718
#test-1, #test-2, #test-3{width: 300px height: 200px line-height: 200px text-align: center display: inline-block margin-left: 50px color: #FFF}#test-1{background-color: rgba(0,0,0,1)}#test-2{background-color: rgba(0,0,0,0.5)}#test-3{background-color: rgba(0,0,0,0.2)}
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）