• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Filter nur auf hintergrund und nicht auf schrift

Status
Für weitere Antworten geschlossen.

sfox

Neues Mitglied
Guten Tag,

bin seite einer langen Schaffenspause wieder mit HTML/PHP angefangen und es ist erstaunlich, wie viel geblieben ist, aber wie so manches aus unerfindlichen Gründen verschwunden ist.

Egal!
Ich stieß auf folgendes:
Sie ganz schmuck aus, wenn man ein bg-image hat und die tabellen drüber transparent sind. Dumm ist nur, dass ich per css nicht nur den hintergrund transparent mache, sondern auch die schrift. Ich hab es wie folgt versucht....

.php datei
PHP:
<table width="500px" class="nobordernopadding">
  <tr>
    <td width="100%" height="10px">
      &nbsp;
    </td>
  </tr>
  <tr>
    <td width="100%">
      Recent News
    </td>
  </tr>
  <tr>
    <td width="100%" class="footline1">
      <div id="footlinetext1">
       Hier steht ein Text der nicht transparent werden soll!
      </div>
    </td>
  </tr>
</table>


Das ist die eingefügte .css datei

Code:
#footlinetext1

{
font-size: 13px;
color: #FFFFFF;
filter:100;
opacity:1.00;
-moz-opacity:1.00;
}

#headline1

{
font-size: 15px;
background: black;
filter:70;
opacity:0.70;
-moz-opacity:0.70;
}

td.footline1

{
font-size: 13px;
background: #000000;
filter:50;
opacity:0.50;
-moz-opacity:0.50;
}


Kann mir jemand sagen, wie ich den hintergrund 50% transparent bekomme, der Text aber unangetastet bleibt?????
 
2 divs übereinander, einer nur mit dem Hintergrund und transparenz, der andere mit Text und ohne transparenz ;)
 
Meintest du so, klappt nämlich nicht!
Macht das gleiche, wie zuvor!

PHP:
<table width="500px">
  <tr>
    <td width="100%" height="10px">
      &nbsp;
    </td>
  </tr>
  <tr>
    <td width="100%" id="headline1">
      Recent News
    </td>
  </tr>
  <tr>
    <td width="100%">
      <div id="footlinetext1">
      <div id="footlinetext2">
       Text, der nicht transparent werden soll!
      </div>
      </div>
    </td>
  </tr>
</table>
.css

Code:
*.noborder1
{
border-width: 0px;
border-style: solid;
border-spacing: 0px;

padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right 0px;

background-image:url(img/background_01.jpg);
background-position: center top;
background-attachment:scroll;
background-repeat:no-repeat;

color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}

*.noborder2
{
padding-top: 0px;
padding-bottom: 0px;
padding-left: 2px;
padding-right 2px;

text-align: center;
vertical-align: top;

border-width: 0px;
border-style: solid;
border-spacing: 0px;

color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}

*.nobordernopadding
{
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right 0px;

text-align: left;
vertical-align: top;

border-width: 0px;
border-style: none;
border-spacing: 0px;

color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}



body.bodyindexphp
{
margin-top:0;
margin-bottom:0;
margin-left:0;
margin-right:0;

background: #000000;
color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}

body.bodymenuephp
{
margin-top:0;
margin-bottom:0;
margin-left:0;
margin-right:0;

color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}

a:link
{
color: #B1B1B1; text-decoration:none;
}
a:visited
{
color: #B1B1B1; text-decoration:none;
}
a:focus
{
color:#FF0000; text-decoration:none;
}
a:hover
{
color:#00CCFF; text-decoration:none;
}
a:active
{
color:#FF0000; text-decoration:none;
}

#menuetable
{
padding-top: 0px;
padding-bottom: 0px;
padding-left: 2px;
padding-right 2px;

text-align: center;
vertical-align: top;

border-width: 0px;
border-style: none;
border-spacing: 0px;

background:#000000;
color:#FFFFFF;
font-size: 13px;
font-family:'Arial';
font-weight: bold;
}


#headline1

{
font-size: 15px;
background: black;
filter:70;
opacity:0.70;
-moz-opacity:0.70;
}


#footlinetext1

{
background: #000000;
font-size: 13px;
color: #FFFFFF;
filter:50;
opacity:0.50;
-moz-opacity:0.50;
}

#footlinetext2

{
font-size: 13px;
color: #FFFFFF;
filter:100;
opacity:1.00;
-moz-opacity:1.00;
}
Noch ne Idee???
 
Kommt schon, da muss es doch noch ne möglichkeit geben!
Sagt mir doch einfach, dass ich da nen dicken syntaxfehler habe!
Für den ganzen kram noch transparente pics, über einem hintergrundbild mit farbverläufen, Och nööö!
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben