Page 129 - css揭秘
P. 129
是半透明的白色。结构大致是这样的：
HTML
<main>
<blockquote>
"The only way to get rid of a temptation[...]"
<footer>－
<cite>
Oscar Wilde,
The Picture of Dorian Gray
</cite>
</footer>
</blockquote>
</main>
CSS 代码可能是这样的（简短起见，这里只列出了关键样式）：
body {
background: url("tiger.jpg") 0 / cover fixed;
}
main {
background: hsla(0,0%,100%,.3);
}
相信你可以察觉到，文字确实难以看清，因为它后面的图片太过花哨
了，而它的背景色只有 30% 的不透明度。当然，我们可以通过提升背景色
的不透明度来增加文本的可读性，不过这样一来整个效果就没有那么生动了
（参见图 4-15）。
图 4-14
半透明白色背景使文字很难阅读
98 第 4 章 视觉效果
ࠡ JOEC
