你如何改变表格边框的不透明度[重复]

Posted

技术标签:

【中文标题】你如何改变表格边框的不透明度[重复]【英文标题】:How do you change a table border opacity [duplicate] 【发布时间】:2014-01-27 10:07:03 【问题描述】:

我有一个带有渐变背景图片的网页。在这个页面上是一个表格。我已将边框设置为 5px 宽度和实心。我想让这些边框不透明度为 0%,以便用户看到渐变背景。这可能吗。这是我目前拥有的表格。

<div style="margin: 0pt auto; width: 980px;background-color:white;">
<div style="500px;overflow:hidden">
    <table style="width: 100%; table-layout: fixed;">
    <tbody>
      <tr>
        <th style="border-bottom:5px solid rgba(255,0,0,.5);"><font color="red">Name</font></th>
        <th style="border-bottom:5px solid rgba(255,0,0,.5);"><font color="green">Event</font>        </th>
        <th style="border-bottom:5px solid rgba(255,0,0,.5);"><font color="blue">Description</font></th>
     </tr>
     <tr>
        <td style="width:150px;border-right:1px solid black;border-bottom:1px solid red;"><?         echo $Row['name']; ?></td>
        <td style="width:150px;border-right:1px solid black;border-bottom:1px solid green;"><? echo $Row['description']; ?></td>
        <td style="width:150px;border-bottom:1px solid blue;"><? echo $Row['detail']; ?></td>
     </tr>
   </tbody>
   </table>
</div>
</div>

我按照之前的建议将颜色更改为 rgba(255,0,0,.05),但它显​​示了为表格外的分区设置的白色背景。我想显示表格边框的真实页面背景,它是一个多色渐变。

这已被标记为重复,但我没有被告知原始问题在哪里。使用 rgb 或 rgba 只会将不透明度更改为表格单元格的背景。我想显示表格后面的页面背景,它是彩色渐变。如果这是一个重复的问题,请告诉我答案在哪里。谢谢。

【问题讨论】:

***.com/questions/4062001/css3-border-opacity ? 您的意思是不透明度为 0%(不可见)而不是不透明度为 100%(可见)? 【参考方案1】:

找到您想要的颜色的 RGB 细分(谷歌搜索)并使用

5px solid rgba(255,0,0,.5)

.5 是透明度,也就是 alpha

【讨论】:

【参考方案2】:

使用 rgba:border-bottom:5px solid rgba(255, 0, 0, .5);

第 4 个 nr 越低,它看起来就越透明。我的示例显示为红色。

【讨论】:

以上是关于你如何改变表格边框的不透明度[重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何改变儿童的不透明度[重复]

用jquery改变rgba alpha透明度[重复]

如何在不改变背景内容的情况下改变背景的不透明度?

jss如何改变颜色的不透明度

CSS 内部边框,带有背景图像的div上的不透明度

[HTML][CSS] 如何改变背景图片的不透明度,而不是上面的文字?