如何使文字不透明？

Question

///我所指的文字是在图片滑块（Jquery cycle2）正下方显示的透明标题框中的文字。 文字似乎坚持了我为盒子指定的不透明度。 我还希望该框能够跨越滑块的宽度，并使其中的文本居中，但是现在我已经超越了我。 我很乐意尝试任何建议给我的解决方案。 我还提供了另一个网站上我试图模仿的示例。

 http://sff-law.ca/.


Instead, I've only been able to create the following:

///

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org    /TR/xhtml1/DTD/xhtml1-transitional.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <title>Untitled Document</title>
   <style type="text/css">
   .cycle-slideshow, .cycle-slideshow * {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
   }


   /* overlay */
   .cycle-overlay {
    font-family: Baskerville, Georgia, "Times New Roman", Times, serif;
    z-index: 800;
    background: black;
    color: #FFF;
    opacity: .1;
    overflow: hidden;
    position: absolute;
    top: 211px;
    font-size: 16px;
    font-weight: bold;
    right: auto;
    left: auto;
    clear: both;
    padding-top: 6px;
    padding-right: 6px;
    padding-bottom: 6px;
    padding-left: 6px;
    margin-left: 1px;
    font-style: italic;
   }
   </style>

   <script src="jquery.cycle2.caption2.min.js" type="text/javascript"></script>

   <script src="jquery.min.js" type="text/javascript"></script>

   <script src="jquery.cycle2.js" type="text/javascript"></script>


   </head>

   <body background="KAWARTHA LAW/Pics/6a00d83452719d69e2017d41a50bc6970c.jpg">
   <div id="back">
   <div class="cycle-slideshow" 

    data-cycle-timeout=2000
    >
    <!-- empty element for overlay -->
    <div class="cycle-overlay"></div>

    <img src="Slidding/buying.gif" 
        data-cycle-title="Contracts" 
        data-cycle-desc="">
    <img src="Slidding/last-will-and-testament-and-glasses.gif" 
        data-cycle-title="Corporate" 
        data-cycle-desc="">
    <img src="Slidding/last-will.gif" 
        data-cycle-title="Wills and more wills" 
        data-cycle-desc="">
    <img src="Slidding/Top-5-Reasons-to-have-a-Will-in-PA-02-08-12.gif" 
        data-cycle-title="Good Wills" 
        data-cycle-desc="">
   </div>
   </div>
   </body>
   </html>

Answer 1

如果您只需要较新的浏览器，则可以将CSS设置为使用RGBA值，那么文本将是不透明的（在IE9 +，Chrome，Firefox，Safari中可以使用）：

.cycle-overlay{
     background-color:(0,0,0,.1);
}

如果需要向后兼容的解决方案，则可以创建具有所需透明度的1x1 PNG图像，并将其设置为背景。

如何使文字不透明？

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-04-07 13:21:37

如何使文字不透明？

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-04-07 13:21:37

解决方案1
0 已采纳 2014-04-07 13:21:37