首頁 > web前端 > html教學 > CSS 背景透明效果的实现_html/css_WEB-ITnose

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

WBOY
發布: 2016-06-24 11:48:52
原創
1061 人瀏覽過

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


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


回复讨论(解决方案)

input{opacity: 0.8;}

input{opacity: 0.8;}

我给input、textarea加了
opacity:value
登入後複製
属性。但是无法达到那种,表单内容透明,而其他部分不透明。
这里需要考虑三个层:
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>
登入後複製

用PNG图片.

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板