如何将博客的页面背景转换为半透明

lzusa 发布于 2019-03-17 2283 次阅读


为了展示我骚气的背景,于是我决定将页面颜色改为半透明

准备

对于wordpress中的css是存在\wordpress\wp-content\themes中对应主题下的style.css我们对其进行更改就可以更改页面样式了。

.site-header {
    background-color: #FFF;
    border-bottom: 1px solid rgba(51, 51, 51, 0.1);
    padding: 7.6923%;
}

我们右键页面的背景查看审查元素,找到背景色,像上面的就是background-color: #FFF; 默认的背景色是白色,在chrome下我们尝试对这个颜色进行更改(chrome中拖动透明度条),就会发现背景色变透明了,此时显示的颜色为#ffffffbd。

好的,大功告成,我们将全部想要更改的地方的background-color:都改为这个值,然后control+f5刷新就可以在chrome中看到想要的效果了。


但是,在用edge打开时,背景显示为完全透明。

查看后发现显示没有找到#ffffffbd这个值,想了想还是用rgba(245, 244, 244, 0.85)来表示颜色吧。

进行更改后果然就没有报错了,如果想要调整透明度的话对rgba中的最后一个值进行更改即可。