如果你使用的是Less，你可以使用褪色（颜色，30%）。

问题是，在您的示例中，文本实际上是完全不透明的。它在p标记内具有完全不透明性，但p标记只是半透明的。

您可以添加半透明的PNG背景图像，而不是在CSS中实现，或者将文本和div分离为两个元素，并将文本移动到框上（例如，负边距）。

否则就不可能了。

正如Chris所提到的：如果你使用一个具有透明度的PNG文件，你必须使用JavaScript解决方法来让它在烦人的Internet Explorer中工作。。。

有一个技巧可以最小化标记：使用伪元素作为背景，可以在不影响主元素及其子元素的情况下设置其不透明度：

DEMO

输出：

相关代码：

p型{位置：相对；}p： 之后{内容：“”；位置：绝对；顶部：0；左：0；宽度：100%；高度：100%；背景：#fff；-ms filter：“progid:DXImageTransform.Microsoft.Alpha（不透明度=50）”；不透明度：.6；z指数：-1；}/***以下仅适用于演示样式***/正文{背景：url（'http://i.imgur.com/k8BtMvj.jpg'）不重复；背景尺寸：封面；}p型{宽度：50%；填充：1em；保证金：10%自动；字体系列：arial，serif；颜色：#000；}国际货币基金组织{显示：块；最大宽度：90%；边距：.6em自动；}<p>Lorem ipsum dolor坐amet，consectetur adipiscing elit。不要用舌头骚扰。<img src=“http://i.imgur.com/hPLqUtN.jpg“alt=”“/></p>

浏览器支持Internet Explorer 8和更高版本。

伪元素不透明度

当使用#AARGGBB格式时，它对我有效，因此对我有效的格式是#1C00ff00。试试看，因为我看到它对某些人有效，而对其他人无效。我在CSS中使用它。

可以使用附加到十六进制值的不透明度值：

background-color: #11ffeeaa;

在本例中，aa是不透明度。不透明度为00表示透明，ff表示纯色。

不透明度是可选的，因此可以一如既往地使用十六进制值：

background-color: #11ffee;

您也可以使用rgba（）的旧方法：

background-color: rgba(117, 190, 218, 0.5);

如果您想确保背景没有其他样式，如图像或渐变，请使用背景速记：

background: #11ffeeaa;

根据Mozilla规范(https://developer.mozilla.org/en-US/docs/Web/CSS/background-color):

/* Keyword values */
background-color: red;
background-color: indigo;

/* Hexadecimal value */
background-color: #bbff00;    /* Fully opaque */
background-color: #bf0;       /* Fully opaque shorthand */
background-color: #11ffee00;  /* Fully transparent */
background-color: #1fe0;      /* Fully transparent shorthand  */
background-color: #11ffeeff;  /* Fully opaque */
background-color: #1fef;      /* Fully opaque shorthand  */

/* RGB value */
background-color: rgb(255, 255, 128);        /* Fully opaque */
background-color: rgba(117, 190, 218, 0.5);  /* 50% transparent */

/* HSL value */
background-color: hsl(50, 33%, 25%);         /* Fully opaque */
background-color: hsla(50, 33%, 25%, 0.75);  /* 75% transparent */

/* Special keyword values */
background-color: currentcolor;
background-color: transparent;

/* Global values */
background-color: inherit;
background-color: initial;
background-color: unset;

最简单的方法是使用半透明背景PNG图像。

如果需要，可以使用JavaScript使其在InternetExplorer6中工作。

我使用Internet Explorer 6中透明PNG中概述的方法。

除此之外，您可以使用两个并排的兄弟元素来伪装它-使一个半透明，然后将另一个绝对放置在顶部。