CSS 背景透明效果的实现_html/css_WEB-ITnose

WBOY

Lepaskan： 2016-06-24 11:48:52

asal

1061 orang telah melayarinya

描述不清楚这种效果，直接上图，无图无真相

图中那个表单效果怎么实现呢？

回复讨论(解决方案)

input{opacity: 0.8;}

我给input、textarea加了

opacity:value

Salin selepas log masuk

属性。但是无法达到那种，表单内容透明，而其他部分不透明。
这里需要考虑三个层：
1、那张透明的背景图
2、蓝色的背景
3、表单输入框的透明效果

现在比较混乱的是如何摆放这三层。。。

<div class="d1">  <div class="d2">  <form>  <input/>  </form>  </div></div><style>  .d1{background:url(http://static.csdn.net/public/common/toolbar/images/f_icon.png)}.d2{opacity: 0.8;background:#00f;width:100%;height:200px;text-align:center;opacity:0.7;}  input{background:rgba(255,255,255,200);}</style>

Salin selepas log masuk

用PNG图片.

Label berkaitan：

CSS 背景透明效果的实现

sumber：php.cn

Artikel sebelumnya：css3.0在线制作工具_html/css_WEB-ITnose Artikel seterusnya：说一个Sublime Text 2插件、emmet（原名：zen Coding)_html/css_WEB-ITnose

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang