Question

我正在使用Wordpress创建自己的网站。我有一个像http://www.arpandasphotography.com/about/这样的页面。

但我想让文本框的背景透明。我试过了

div{ opacity:0.3;}

在自定义CSS中。但它使所有页面都透明。我想只让这个盒子透明。有什么建议吗？

Answer 1

您需要为div元素提供一个类，因为您在问题中提到的CSS将应用于应用此CSS的应用程序中的所有div。

e.g。 HTML：

<div class='opacity-class'>

</div>

CSS：

div.opacity-class {
   opacity: 0.3;
}

以上内容不适用于所有div元素，只适用于类为opacity-class的div元素。详细了解CSS selectors

Answer 2

在框类

中使用background-color:rgba(0,0,0,0.3)

＆＃13;

body{
    background: black;
    background-image: url(http://www.arpandasphotography.com/wp-content/uploads/2017/12/Bled_sunrise2-1.jpg);
    background-repeat: no-repeat;
    position: relative;
}
div{
width:300px;
height:300px;
background-color:rgba(0,0,0,0.3);
color:#fff;}

＆＃13;

<div>
Arpan Das is a full time Astrophysics/Cosmology research student by profession. But landscape photography is one of his biggest passions in life. Arpan was born in India where he lived 23 years of his life. Then he moved to Italy for his study and currently living in Canada for the same purpose. Whenever he has free time, he tries to fly far away from the city and loves being outdoor in some mountains where he can connect himself to the beauty of the nature. Even if he is not taking any photographs he just loves to watch a sunrise or sunset over the mountains, big water waves along the sea or millions of stars over the head in a dark sky.
</div>

＆＃13;

如何在Wordpress中的特定页面上创建透明文本框？

2 个答案: