Question

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

有标题代码：

/*==================== 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;
}

Answer 1

在CSS 3中，他们引入了不透明度。

opacity: 0.9;

它取值从0.0（不可见）到1.0（不透明）。如果它不适合你，请告诉我。： - ）

P.S。不确定浏览器的兼容性是什么，但到目前为止，它为我工作。

如何制作透明标题？

1 个答案: