首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何制作一个透明的头部?

如何制作一个透明的头部?
EN

Stack Overflow用户
提问于 2014-03-28 03:27:01
回答 1查看 881关注 0票数 0

我正在尝试使用rgba代码使我的站点标题透明。但它不起作用。你能帮我解决这个问题吗?提前感谢!

这里有头部代码:

代码语言:javascript
运行
复制
/*==================== 3. Header ====================*/

.site {
    margin: 0 auto;
    width: 100%;
    position: relative;
}
.site.full-banner {
    padding-top: 0;
}
.site-main {
    margin-bottom: 70px;
}
body.page-template-page-landing-php {
    overflow: hidden;
}
.landing.site-main {
    margin: 0;
    padding: 0;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
}
.archive.woocommerce-page .site-main {
    margin-bottom: 80px;
}
.site-header {
    width: 100%;
    z-index: 10000;
}
.full-banner .site-header {
    position: absolute;
    top: 0;
}
.site-header.header-1{
    background: url('../images/header_bg.png') !important;
}
.site-header.header-2 {
    background: rgba(218, 202, 202, .5);

}
.header-relative .site-header {
    position: relative;
}
.header-absolute .site-header {
    position: absolute;
}

/*========== 3.1 Header Top ==========*/
.header-top {
    line-height: 15px;
    min-height: 35px;
}
.header-2 .header-top {
    min-height: 36px;
}
.site-header,
.site-header a,
.toplinks a,
.mini-cart .mobile-hide .subtotal .amount {
    color: #dadada;
}
.header-2 .header-top {
    border-bottom: 1px solid #242424;
    -webkit-box-shadow: 0 1px 0 rgba(128,128,128,.15);
       -moz-box-shadow: 0 1px 0 rgba(128,128,128,.15);
            box-shadow: 0 1px 0 rgba(128,128,128,.15);
}
.header-2 .header-container {
    min-width: 750px;
}
.main-header.fixed {
    position: fixed;
    background: rgba(218, 202, 202, .5);
    width: 100%;
    height: 77px;
    left: 0; top: -7px;
    z-index: 10000;
}
.main-header.fixed .navbar {
    background: none;
}

.main-header.fixed .header-top {
    display: none;
}

#primary {
    width: 75%;
    margin: 0;
    float: left;
}
.full-width #primary {
    width: 100%;
    float: none;
}
#primary {
    width: 100%;
}
.left-sidebar #primary {
    width: 75%;
    float: right;
}
.right-sidebar #primary {
    width: 75%;
    float: left;
}

.entry-header,
.entry-content,
.entry-summary,
.entry-meta {
    margin: 0 auto;
    width: 100%;
}
.entry-header h1 {
    font-size: 15px;
}
EN

回答 1

Stack Overflow用户

发布于 2014-03-28 03:32:05

在CSS3中,他们引入了不透明度。

代码语言:javascript
运行
复制
opacity: 0.9;

它采用0.0(不可见)到1.0(不透明)之间的值。如果对你不起作用,请告诉我。:-)

附注:不确定浏览器的兼容性如何,但到目前为止,它对我来说是有效的。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/22697306

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档