如何将内容部分变灰或将图像放在顶部"隐藏

时间:2017-01-11 22:30:43

标签: jquery html css wordpress

我正在使用WordPress插件,我只需输入要生成的页面的短代码。我想要显示出一小部分内容。我可以添加一些HTML代码到WordPress页面来执行此操作吗?理想情况下,我会添加类似&#34的内容;此部分仅适用于专业会员"。或者,是否有一种方法可以添加固定图像,使其位于顶部"页面的那一部分,所以下面的内容是不可见的?

1 个答案:

答案 0 :(得分:0)

啊......我最喜欢的问题!!!

通常我为hiddenouttent创建一个类,仅用于灰色目的。 因此,您可以为任何div或容器标记应用该隐藏类,它将使内容和背景变灰。

但请记住,这只适用于新浏览器。您可以在以下网站上找到这些详细信息。 Can I use?
Mozilla Developer


下面的Codepen示例

http://codepen.io/anon/pen/rjewpd

HTML
<div class="mainContainer hiddenContent">
  hi i am content.
</div>

CSS
.mainContainer
{
  background:aqua;
}
.hiddenContent
{
   -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
  opacity:0.2;
  background:#bbb;
}