wordpress全站半透明效果

最新推荐文章于 2024-06-29 00:15:00 发布

杰哥的诱惑

最新推荐文章于 2024-06-29 00:15:00 发布

阅读量4.9k

点赞数 2

分类专栏： wordpress 文章标签： wordpress 半透明 dux

本文链接：https://blog.csdn.net/chn_sdn/article/details/81326724

版权

wordpress 专栏收录该内容

11 篇文章 1 订阅

订阅专栏

实现效果：网站显示除背景图片外，其余半透明效果，后台没有变化。

环境：wordpress4.9.7、centos7、lnmp1.5、主题dux

一、最简单操作：（待验证）

思路：在<body>内嵌套，

<div style="-moz-opacity:0.2;filter:alpha(opacity=20);opacity:0.2"></div>

具体操作：我还没找到方法。

二、实现指定区域的半透明化；

（修改主题文件夹下css文件夹里的main.css，将下列字段内的background-color颜色改成rgba(0,0,0,0.5)）

1、小组件小格子
.widget_ui_tags .items a

2、小组件
.widget

3、小组件标题

.widget h3

4、主页文章块
.excerpt

鼠标放在上面就变色

.excerpt cover

5、文章分类页面标题
.catleader

6、底部首页栏
.branding-black

7、页脚
.footer

页脚上部分割线
border-top:

8、页眉

.header
9、文章页面
.single .content

10、文章页面包屑导航栏
.breadcrumbs

11、页面
.container-page .content

12、首页焦点图

主题目录下 index.php

<section class="container">
        <div class="content-wrap">
        <div class="content">

        <div style="-moz-opacity:0.5;filter:alpha(opacity=50);opacity:0.5">   添加此行
                <?php
                     	if( $paged==1 && _hui('focusslide_s') ){
                                _moloader('mo_slider', false);
                                mo_slider('focusslide');
                        }
                ?>
        </div>  添加此行