除了主页以外的每一页的背景都模糊

我正在尝试使用wordpress制作一个网站，并且我为每个页面获得了一个默认背景。除了主页以外的每一页的背景都模糊

主页背景不应该模糊，所有其余的页面应该是，问题是我模糊所有页面，并且不能模糊特定页面。

这是代码：

.container-centered 
{ 
    position: fixed; 
    left:0; 
    top:0; 
    height:100%; 
    width:100%; 
    background-image: url("http://localhost/wordpress/wp-content/uploads/fundo-home-1920px.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center; 
    -webkit-filter: blur(13px); 
    -moz-filter: blur(13px); 
    -o-filter: blur(13px); 
    -ms-filter: blur(13px); 
    filter: blur(13px); 
}

来源

2017-03-22 luis montez

添加特定的类主页，并从模糊效果排除。 – shazyriver

使用此选择器，您将模糊每个页面上的所有.container居中的部分。您可以为非模糊部分添加其他属性，例如：＃page-id .container-centered {...}。这应该在所有其他部分的主要风格之后。 –

你可以添加一个类的网页上（头版）body标签，然后用CSS只有它的目标容器中时，它不具有类。例如...

CSS

.container-centered { 
    position: fixed; 
    left:0; 
    top:0; 
    height:100%; 
    width:100%; 
    background-image: url("http://localhost/wordpress/wp-content/uploads/fundo-home-1920px.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center; 
    -webkit-filter: blur(13px); 
    -moz-filter: blur(13px); 
    -o-filter: blur(13px); 
    -ms-filter: blur(13px); 
    filter: blur(13px); 
} 

.container-centered.home-no_blur { 
    -webkit-filter: blur(0px); 
    -moz-filter: blur(0px); 
    -o-filter: blur(0px); 
    -ms-filter: blur(0px); 
    filter: blur(0px); 
}

PHP

添加到您的header.php文件在身体标签。

<?php if (is_front_page()) : ?> 

    <body class="<?php body_class('home-no_blur'); ?>"> 

<?php else : ?> 

    <body class="<?php body_class(); ?>"> 

<?php endif; ?>

那么这将重置模糊效果为0px在主页上（不模糊）。请参阅setting a static page的更多信息。

如果您的帖子/文章列表（博客）是首页/首页，请改为使用is_home()。但通过它的声音，你正在使用我收集的的静态头版，。

来源

2017-03-22 13:39:01

非常感谢您的帮助!!!!，我做了一些改变，使用了你给我的东西并弄清楚了！ –

不用担心，我可以帮助！如果您想使其更具技术性，那么该法典就非常棒。 –

你有一个特定的类为你的形象在你的主页的祖先？如果是这样你可以做到以下几点：

.container-centered 
{ 
    position: fixed; 
    left:0; 
    top:0; 
    height:100%; 
    width:100%; 
    background-image: url("http://localhost/wordpress/wp-content/uploads/fundo-home-1920px.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center; 
    -webkit-filter: blur(13px); 
    -moz-filter: blur(13px); 
    -o-filter: blur(13px); 
    -ms-filter: blur(13px); 
    filter: blur(13px); 
} 

.homepage-class .container-centered 
{ 
    position: fixed; 
    left:0; 
    top:0; 
    height:100%; 
    width:100%; 
    background-image: url("http://localhost/wordpress/wp-content/uploads/fundo-home-1920px.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center; 
    -webkit-filter: blur(0px); 
    -moz-filter: blur(0px); 
    -o-filter: blur(0px); 
    -ms-filter: blur(0px); 
    filter: blur(0px); 
}

如果不是，我会建议你这样做。使用WordPress，您可以在模板目录中设置一个名为“front-page.php”的新文件，并在此处进行编辑。如果您的WordPress管理页面中设置为“静态”，WordPress会自动将此文件识别为您的主页。

来源：Click here

来源

2017-03-22 13:00:38

感谢您的帮助，您非常乐于助人，并给予了快速回复！ –

非常欢迎;） –

默认情况下，WordPress应该为您的主页提供主页的主体类。

我会亲自使用不过滤，像这样：

.container-centered 
{ 
    position: fixed; 
    left:0; 
    top:0; 
    height:100%; 
    width:100%; 
    background-image: url("http://localhost/wordpress/wp-content/uploads/fundo-home-1920px.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
    background-position: center; 
} 
body:not(.home) .container-centered { 
    -webkit-filter: blur(13px); 
    -moz-filter: blur(13px); 
    -o-filter: blur(13px); 
    -ms-filter: blur(13px); 
    filter: blur(13px); 
}

来源

2017-03-22 14:27:08 mikeg542

感谢您的帮助！ –

除了主页以外的每一页的背景都模糊

回答

相关问题