css实现div块半透明


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
div
{
width:100px; height:100px;position:absolute; top:10px;
filter: Alpha(Opacity=50); /* 针对IE*/
background-color: rgba(0, 0, 0, 0.5); /*针对其他浏览器*/
}
</style>
</head>

<body>
<h1>hello</h1>
<div></div>
</body>
</html>

div块覆盖在hello上,依然是透明的

时间: 2024-08-08 05:19:11

css实现div块半透明的相关文章

让上下两个DIV块之间有一定距离或没有距离

1.若想上下DIV块之间距离,只需设定:在CSS里设置DIV标签各属性参数为0div{margin:0;border:0;padding:0;}这里就设置了DIV标签CSS属性相当于初始化了DIV标签CSS属性,这里设置margin外边距为0:边框border属性为0和内补白也为0:这样相当于就初始化了DIV之间距各属性距离为0,这样就不会造成DIV直接有一定的距离. 2.如果想上下两个DIV间有距离的话,只需设定div中的margin属性即可,本例中div属性对全局DIV块都适用,代码如下:

通过定位实现的div块网页中固定效果

通过定位实现的div块网页中固定效果:本章节介绍一下如何让通过定位方式让一个div定位于网页的一个位置,无论是否拖动滚动条.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂

CSS中的块级元素与行级元素

最近初学CSS时对块级元素与行级元素有时会产生混淆,写篇博客记录一下自己对其的理解. 先从概念上来看: 块级元素 特点:1.每个块级元素都是独自占一行,其后的元素也只能另起一行,并不能两个元素共用一行. 2.元素的高度.宽度.行高和顶底边距都是可以设置的. 3.元素的宽度如果不设置的话,默认为父元素的宽度. 常见的块级元素:<div>.<p>.<h1>...<h6>.<ol>.<ul>.<dl>.<table>

DIV背景半透明文字不半透明的样式

IV背景半透明,DIV中的字不半透明 代码如下: <body bgcolor="#336699"> <div style="filter:alpha(opacity=50);background:#ffffff;width:600;"><span style="color:yellow"> 图层背景半透明,字体颜色也半透明 代码如下: </span></div> <div styl

子div块中设置margin-top时影响父div块位置的解决办法

在css中设置样式时,通常会遇到用子div块margin中设置margin-top时,父div块中就会随着子div的margin-top,也会和子div执行相同的margin-top的位置样式 解决办法1: 若子div块中使用margin-top,则在父div块中添加:overflow:hidden; 解决办法2: 若由于特殊情况不能在父div块中添加:overflow:hidden,那么在子div块中用padding-top代替margin-top;

css使div垂直居中

<h3>css+div使div块元素垂直居中</h3>

一款CSS+JS+DIV制作的蓝色风格tab滑动门

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>一款CSS+JS+DIV制作的蓝色风格ta

CSS实现背景透明/半透明效果的方法

全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !important;width:100%} 其他的还有不少文章,有个不错,如何用CSS实现背景半透明效果? 内容详细如下:http://llf535.cn 龙行天下 精彩内容等着你 引用 如何用CSS实现背景半透明效果?做过活动页面的同学可能会遇到要做背景半透明的效果,我们一般的做法是用两个层,一个用于放文字,另一

div块上下左右居中

实现div块的上下左右居中: <!DOCTYPE html> <html> <head>     <meta charset="utf-8" />     <title>div块上下左右居中</title> </head> <body>     <div id="div2">     </div>     <style>     *{p