设置DIV透明层

最新推荐文章于 2023-05-20 20:12:52 发布
最新推荐文章于 2023-05-20 20:12:52 发布
阅读量622 收藏
点赞数
文章标签： DIV 半透明层 设置

设置DIV样式的样式代码：filter:alpha(Opacity=60);-moz-opacity:0.6;opacity: 0.6; （放置在style=""属性里）

说明：
1、filter：对win IE设置半透明滤镜效果，filter:alpha(Opacity=80)代表该对象80%半透明，火狐浏览器不认
2、-moz-opacity：对mozilla firefox火狐浏览器实现半透明，win IE不认此属性，-moz-opacity:0.5相当于设置半透明为50%
3、opacity：对除IE外所有浏览器支持包括谷歌，放最后主要针对谷歌浏览器，opacity: 0.5;表示设置50%半透明



火星码农
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
div层设置透明
Sbangm的专栏
05-22 1250
<br />今天做一个页面，数据比较多，加载慢，想到了弄一个层显示“loading...”以告知用户，增加用户体验，又想把该层做成透明的，所以找了div中的这个属性“filter:Alpha(opacity=30)”,30是透明系数，值越大透明度越高。。。<br /> <br /><div id="c_d" style="position:absolute; padding-left:300px; padding-top:180px; z-index:1; left: 200px; top: 22px; b
DIV的透明层实现
leadtheway的专栏
04-17 293
DIV的透明层实现(filter:Alpha(opacity=30); 为IE浏览器实现方式 opacity:0.3;为火狐浏览器实现方式) 以下为引用的内容： &lt;body bgcolor="#ff0ddd"&gt; &lt;div id="Layer1" style="position:absolute; width:260px; height:115px; z-index:1;...
透明div层
刘鹏的技术宅
08-25 779
self/index.do" method="post"> 用户名 密码
DIV层的透明度设置
TangKai_java的专栏
09-02 760
<br />FILTER:alpha(opacity=20);
Div的一些设置关于边框和透明度的
09-28
如果只想让边框透明，可以使用伪元素 `::before` 或 `::after` 来创建一个覆盖在边框上的半透明层。 ```css div { position: relative; } div::before { content: ""; position: absolute; top: -5px; right:...
透明 浮层 DIV
01-15
在网页设计和开发中，"透明浮层DIV"是一个常用的技术，它允许创建一个可交互的、具有透明度效果的浮动元素，常用于弹出窗口、对话框或者自定义控件。下面我们将深入探讨这个主题，包括其原理、实现方法以及浏览器...
html div 透明样式示例代码
09-25
这里设置为50，意味着这个`div`的初始透明度为50%，即50%可见，50%透明。 2. `finishopacity`参数：用于设置渐变结束时的透明度。在这个例子中，设置为0，意味着渐变结束时元素将完全透明。不过，由于IE浏览器的...
基于JavaScript实现全屏透明遮罩div层锁屏效果
10-22
主要介绍了基于JavaScript实现全屏透明遮罩div层锁屏效果的相关资料,需要的朋友可以参考下
div背景半透明 覆盖整个可视区域的遮罩层效果
09-25
为了演示这个效果，可以创建一个包含大量内容的`<p>`标签，以及一个具有半透明遮罩层和绝对定位内容的`<div>`。例如： ```html <!DOCTYPE html> <!-- ... --> /* ... */ <p class="ph">place holder ...
CSS和Javascript实现的DIV半透明飘浮层
09-25
用CSS和Javascript实现的DIV遮照飘浮层 通过点击按钮显示半透明遮盖层以及信息层 用CSS实现的固定飘浮,以及用Javascript实现的定位飘浮 用VS2008打开后直接运行UserShowPanelTest.aspx的效果是CSS实现的效果,要实现Javascript飘浮效果需要取消Javascript中的注释并给CSS注释掉就可以了
html把div做成透明背景,DIV半透明层 CSS来实现网页背景半透明
weixin_39800062的博客
06-02 898
DIV半通明完成，运用CSS完成DIV成半透明效果，CSS实现层与后台半通明成果。一、DIV CSS半通明底子介绍设置装备摆设DIV半通明CSS代码：div{filter:alpha(Opacity=80);-moz-opacity:0.5;opacity:0.5;}阐明： 1、filter：对win IE设置半通明滤镜成就，filter:alpha(Opacity=80)代表该对象80%半透明...
Html-Css-div透明层剧中
06-01 90
<!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&g...
【HTML＆CSS】如何设置透明的div盒子？
m0_60364956的博客
05-20 9018
有时候我们想把盒子的背景设置成透明的，或者半透明的，看起来更美观。这就需要我们给颜色加一个透明度。
css:div的不透明度opacity问题（父级的opacity会影响子级）
qq_34169240的博客
02-28 2918
不透明度会作用于整个元素以及它所有的子元素 子元素不透明度=父元素不透明度乘以子元素本身不透明度，而opacity的范围是0~1，所以就算把子级的div的opacity设为1也没有用，子元素是没办法获得大于父元素的不透明度值的。 解决方法： 如果是万不得已视觉排版效果上的需要，可以分别设置两个兄弟元素的不透明度,然后用position的方法将一个放在另一个的上方。...
设置div半透明
sjsm2007的专栏
02-24 1291
DIV半透明实现，使用CSS实现DIV成半透明效果，CSS实现层与背景半透明效果。 一、DIV CSS半透明基础介绍   -   TOP 设置DIV半透明CSS代码： div{filter:alpha(Opacity=80);-moz-opacity:0.5;opacity: 0.5;}  说明： 1、filter：对win IE设置半透明滤镜效果，filter:alpha(
html怎么给div加半透明背景色,CSS_div背景半透明 覆盖整个可视区域的遮罩层效果，html代码很简单 <div class=" - phpStudy...
weixin_39912580的博客
06-19 1639
html代码很简单 1 、半透明效果可以使用 css3 中的 opacity 属性，在低版本的IE浏览器中使用IE的alpha 滤镜。代码:.opacity{ opacity:0.3; filter: alpha(opacity=30); background-color:#000; }2 、要覆盖整个可视区域通常的做法是:html,body{ height:100%}.mask{height:1...
html div背景半透,css半透明背景实现方法
weixin_29343187的博客
06-10 1050
这里博主介绍2种办法。第一种用背景图的方式：代码如下html>半透明实例-琅枫个人博客.div1{width:300px;height:200px;background:url(http://www.phpfeng.cn/statics/assets/i/b1.jpg);}.div2{width:300px;height:50px;background:rgba(0,0,0,0.5)...
设置div背景色为半透明
coffee
11-19 5864
百度首页，点击登录后，弹出一层登录div，同时后面的文字等不能再进行操作。 原因是在点击登录后，首先创建一个层用于覆盖整个页面，这次覆盖层后面的东西就不可以进行操作了，然后再创建一个div用于登录。 当然这个覆盖层和登录div最好是提前创建好的，当点击登录时，直接设置display:block就可以了，取消时，设置为display:none; 设置半透明的css样式：opacity:0.5;
div半透明遮罩效果
最新发布
05-28
要实现 div 半透明遮罩效果，可以通过以下步骤来实现： 1. 创建一个 div 元素，作为遮罩层。 2. 使用 CSS 设置该 div 元素的背景色为半透明的黑色。例如：background-color: rgba(0, 0, 0, 0.5); 其中 0.5 表示透明度为 50%。 3. 设置该 div 元素的宽度和高度，使其覆盖需要遮罩的元素。 4. 将该 div 元素的 z-index 属性设置为比需要遮罩的元素的 z-index 属性更高，以确保遮罩层在需要遮罩的元素之上。 例如，以下是一个示例代码： HTML 代码： ``` <div class="mask"></div> <div class="content"> <!-- 这里是需要遮罩的内容 --> </div> ``` CSS 代码： ``` .mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 999; } .content { /* 这里是需要遮罩的内容的样式 */ } ``` 注意，以上代码中的 z-index 值可以根据具体情况进行调整，以确保遮罩层能够正确覆盖需要遮罩的元素。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值