基本的CSS不透明

-3

我使用SaaS来建立自己的网上商店。问题是我不知道任何代码。我希望让菜单栏看起来更时尚。 SaaS平台提供CSS编辑，但我无法更改HTML。当前菜单栏有这个CSS;基本的CSS不透明

#menu { 
    padding: 5px 0 5px 0; 
    background: #005775; 
    margin: 0 0 8px 0; 
}

我该如何使这个更好看。我试着改变不透明度，但每次我添加不透明度的话代码就会中断，并且memu消失。

我目前的设计看起来像这样; http://imgur.com/a/ptSuA 我真的想让菜单栏稍微粗糙一点，让它看起来更友好。

对不起我的可怕的语法和缺乏知识。

来源

2017-06-06 StartingNoob

你能证明你试过了吗？ –

“更好看”是什么意思？而且，我们只能看到一些代码，而不是视觉演示，所以我们无法给出任何有关如何使其“更好看”的任何事情。 – Swellar

不知道什么构成“更好看”，我觉得很难提供建议。没有味道的会计！ –

尝试使用 background-color:rgba()而不是不透明这增加了菜单栏的透明度。

例如

background-color:rgba(255,0,0,0.5);

的最后一个值增加透明度。

来源

2017-06-06 10:32:42

当您添加不透明度#menu，它在所有他的儿童影响和菜单disappears.you必须使用background-color:rgba()或background-color:hsla()

#005775 = rgba(0, 87, 117, 1.0) 
#005775 = hsla(195, 100%, 23%, 1.0)

所以：

#menu { 
 
    width: 200px; 
 
    height: 200px; 
 
    padding: 5px 0 5px 0; 
 
    margin: 0 0 8px 0; 
 
    background:rgba(0, 87, 117, 0.3);/*/ I use 0.3 /*/ 
 
}

<div id="menu">I Am Menu</div>

来源

2017-06-06 10:32:56 Ehsan

非常感谢您的评论和时间。代码有效，但它不能提供我想要的效果。对不起，我想我不擅长解释我想要的东西。 “这真是太神奇了，很多人都在努力帮助。” 我上传了一张我的网站的照片，所以你可以看到它，菜单栏看起来非常粗糙和不友好，这就是为什么我想让它更柔和。 http://imgur.com/a/ptSuA“ – StartingNoob

如果对你有帮助请稍微补充一点 – Ehsan

试试这个。正如其他人所说，这也将减少菜单中文字的不透明度。

#menu { 
    padding: 5px 0 5px 0; 
    background: #005775; 
    margin: 0 0 8px 0; 
    opacity: 0.5; // Change this value between 0(transparent) -> 1(100% visible); 
}

来源

2017-06-06 11:35:34

基本的CSS不透明

回答

相关问题