html background-color设置为透明的方法如下:
<html>
<head>
<title>透明表格</title>
</head>
<body background="图片">
<table border="0">
<tr>
<td style="background-color:#336699filter:Alpha(opacity=50)">表格内容</td>
</tr>
</table>
</body>
</html>
background是用于在一个声明中设置所有背景属性的一个简写属性。
背景 (background) 属性定义元素的背景效果
元素的背景区包括前景之下直到边框边界的所有空间。因此,内容框与内边距都是元素背景的一部分,且边框画在背景上。
CSS 允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果;CSS 在这方面的能力远远在 HTML 之上。
background 是用于在一个声明中设置所有背景属性的一个简写属性。
格式: background: {属性值}
继承性: NO
可能的值:
background-color
background-image
background-repeat
background-attachment
background-position
1、首先新建一个记事文本,重新命名背景颜色.html,按回车确认,如下图所示。
2、回到桌面选中新创建的背景颜色.html文件,右键选择记事本打开,然后在记事本中手动输入图中代码,这是一个标准的html头尾格式。
3、在<body>中添加代码:bgcolor="#000000",保存。
4、这时在桌面打开背景颜色.html,打开页面显示为黑色背景,如下图所示就完成了。
html给背景图片设置透明度的方法有2种
1、使用opacity属性,给设置背景图片的元素添加“opacity:透明度值”样式即可;
属性值从 0.0 到 1.0。值越小,越透明
示例:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div {
width: 300px
height: 300px
background-image: url(img/3.jpg)
}
.box{
opacity: 0.5
}
</style>
</head>
<body>
<div>背景图片</div>
<div class="box">背景图片</div>
</body>
</html>
2、使用filter属性,给设置背景图片的元素添加“filter: opacity(透明度值)”样式即可
filter属性定义了元素(通常是)的可视效果(例如:模糊与饱和度);
2.1 语法
filter: none | blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia() | url()
属性值代表的意义:
grayscale灰度
sepia褐色(有种复古的旧照片感觉)
saturate饱和度
hue-rotate色相旋转
invert反色
opacity透明度
brightness亮度
contrast对比度
blur模糊
drop-shadow阴影
示例:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div {
width: 300px
height: 300px
background-image: url(img/3.jpg)
}
.box{
filter: opacity(0.6)
}
</style>
</head>
<body>
<div>背景图片</div>
<div class="box">背景图片</div>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)