Avatar billede filip_b_l Nybegynder
25. februar 2006 - 12:05 Der er 13 kommentarer og
1 løsning

halvgennemsigtige felter i tabel

Ja hvordan laver man et halv-gennemsigt baggrundsfarve i nogen felter i en tabel?
Jeg har et baggrundsbillede på siden. Ovenpå den er der en lang liste stillet op i en table. Det er så meningen af hver anden række felter skal være an anden nuance så det er nemt at skildne mellem rækkerne. men man skal stadigt kunne se igennem nuancen og se billedet bag ved? Nogen som forstår hvad jeg prøver at sige og som kan lave det?
eller skal jeg prøve at lave et billede som viser det?
Avatar billede roenving Novice
25. februar 2006 - 15:19 #1
Ved at give hele feltet en gennemsigtighed og f.eks. en farvet baggrund !-)

-- de andre kan så bare gøres fuldt gennemsigtige:

Halvgennemsigtige:

<input name=" ... " type="text" style="background:red;filter:alpha(opacity:20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2;">

Og fuldt gennemsigtige:

<input name=" ... " type="text" style="background:transparent;">
Avatar billede apo Praktikant
25. februar 2006 - 16:17 #2
"-khtml-opacity:0.2;"

-khtml?? Hvad er det?
Avatar billede roenving Novice
25. februar 2006 - 16:24 #3
khtml er renderingsmaskinen i en hel del *nix-browsere (og propertyen er jeg stødt ind i i et andet spørgsmål på Eksperten, så jeg ved ikke så meget om den !-)
Avatar billede apo Praktikant
25. februar 2006 - 17:59 #4
Ok. Hvad er *nix-browsere? Unix-browsere? :-)
Avatar billede roenving Novice
25. februar 2006 - 18:13 #5
Browsere lavet til een af de unix-baserede styresystemer, f.eks. UNIX, AIX, Linux etc.
Avatar billede apo Praktikant
25. februar 2006 - 18:55 #6
Okay, takker :-)
Avatar billede filip_b_l Nybegynder
26. februar 2006 - 00:55 #7
når det så er rækker i en tabel hvor kun baggrundsfarven skal være halvgennemsigtig hvordan lader det sig så gøre? Jeg har prøvet med ovennævnte, men så bliver teksten i disse rækker også halvgennemsigtig...
Avatar billede roenving Novice
26. februar 2006 - 01:00 #8
Det kan du kun gøre ved at sætte et ekstra element ind bagved teksten !-)

F.eks.

<td>
  <div style="position:relative">
    <div style="background:red;width:100px;height:100px;filter:alpha(opacity:20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2;">&nbsp;</div>
    <input type="text" style="position:absolute">
  </div>
</td>
Avatar billede filip_b_l Nybegynder
27. februar 2006 - 18:59 #9
ok her er hvad det skal være
<table>
<tr><td>række 1 - helt gennemsigtig til baggrunden</td></TR>
<tr><td>række 2 - halv gennemsigtig til baggrunden</td></TR>
<tr><td>række 3 - helt gennemsigtig til baggrunden</td></TR>
<tr><td>række 4 - halv gennemsigtig til baggrunden</td></TR>
</table>
Avatar billede filip_b_l Nybegynder
02. marts 2006 - 00:36 #10
nogen må da ha en ide?
Avatar billede weis Nybegynder
02. marts 2006 - 14:45 #11
I din css fil kan du have stylen:

.tdbg {
  background-color:#FFFFFF; filter: alpha(opacity=50);
}

Så kommer din kode til at se sådan her ud:

<table>
<tr><td>række 1 - helt gennemsigtig til baggrunden</td></TR>
<tr><td class="tdbg">række 2 - halv gennemsigtig til baggrunden</td></TR>
<tr><td>række 3 - helt gennemsigtig til baggrunden</td></TR>
<tr><td class="tdbg">række 4 - halv gennemsigtig til baggrunden</td></TR>
</table>
Avatar billede roenving Novice
03. marts 2006 - 06:15 #12
Kunne du ikke bare implementere det, jeg viste ?-)

F.eks. sådan:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>

<style type="text/css">
html,body{background:url(../billede.jpg) no-repeat;margin:0;padding:0;}
#minTabel{background:transparent;border-collapse:collapse;}
#minTabel td{background:transparent;width:200px;height:50px;border:1px solid black;}
#minTabel td .rel{position:relative;top:0;left:0;width:100%;height:100%;}
#minTabel td .opac{position:absolute;top:0;left:0;background-color:#f00;filter:alpha(opacity=30);-moz-opacity:0.3;-khtml-opacity:0.3;opacity:0.3;width:100%;height:100%;}
#minTabel td .abs{background:transparent;position:absolute;top:0;left:0;}
</style>
<title>Halvgennemsigtig</title>
</head>
<body>
<table id="minTabel">
  <tr>
    <td>række 1 - helt gennemsigtig til baggrunden</td>
  </tr>
  <tr>
    <td>
      <div class="rel">
        <div class="opac">&nbsp;</div>
          <textarea class="abs">række 2 - halv gennemsigtig til baggrunden</textarea>
      </div></td>
  </tr>
  <tr>
    <td>række 3 - helt gennemsigtig til baggrunden</td>
  </tr>
  <tr>
    <td>
      <div class="rel">
        <div class="opac">&nbsp;</div>
          <textarea class="abs">række 4 - halv gennemsigtig til baggrunden</textarea>
      </div></td>
  </tr>
</table>
</body>
</html>

-- og grunden til at jeg har vist det i et textarea er, at der skal være et element, som kan positioneres absolut, det kunne også være en div, en span, en input eller alle andre elementer, der kan stå rundt om tekst !-)
Avatar billede filip_b_l Nybegynder
17. september 2007 - 14:19 #13
gammel tråd.. lukker den her
Avatar billede roenving Novice
21. september 2007 - 13:10 #14
Kunne du da ikke bruge noget af inputtet ?-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester