Hur gör man en skugga över denna tabell?

7 svar · 364 visningar · startad av Dr-man 18 apr. 2003

Dr-manMedlem sedan juli 2002732 inlägg

Frågan18 apr. 2003 13:59#1

Hur får man skugga på denna tabell?


.adb { border: 3px #006699 solid; 

       background-color: #ffffff; 

       font-family: times-new-roman; 

       font-size: 16px; 

       font-weight: bold; 
       color: #006699; 
       text-decoration: underline; 

       text-align: center; 

       width: 500px; 

       cellspacing: 3px; 

       cellpadding: 3px; 

       margin-top: 1%; 

       margin-bottom: 2%; 
       z-index: 1; 

     } 

.adb2 { border: 3px #000000 solid; 

       background-color: #bbbbbb; 

       font-family: times-new-roman; 

       font-size: 16px; 

       font-weight: bold; 
       color: #000000; 

       text-align: center; 

       width: 500px; 

       cellspacing: 3px; 

       cellpadding: 3px; 

       margin-top: 1%; 

       margin-bottom: 2%; 
       cursor: pointer; 
       z-index: 1; 
     } 

<table class="adb" onmouseover="this.className='adb2'" onmouseout="this.className='adb'"> 
<tr> 
<td onclick="self.location.href='adbinfo/adbkontakt.htm'" onMouseOver="moveover('Adb-enhetens kontaktuppgifterna och arbetsf&ouml;rdelningen');return true;"> 
Adb-enhetens kontaktuppgifter och arbetsf&ouml;rdelning 
</td> 
</tr> 
</table>

Är det nån, som vet?

frankofMedlem sedan jan. 20016 874 inlägg

18 apr. 2003 14:05#2

border-top:solid 5px #C0C0C0;

Dr-manMedlem sedan juli 2002732 inlägg

20 apr. 2003 11:43#3

Detta hjälpte inte mig! Är det ingen, som vet hur man gör detta?

frankofMedlem sedan jan. 20016 874 inlägg

20 apr. 2003 12:00#4

Vad menar du med skugga då?

Dr-manMedlem sedan juli 2002732 inlägg

20 apr. 2003 15:10#5

Som om tabellen skulle "sväva" i luften och då skulle det bli en skugga. Skuggan är där för att det skall se ut som om den skulle sväva!

Kan du hjälpa mig med denna sak?

SebbeMedlem sedan jan. 20032 285 inlägg

20 apr. 2003 16:05#6

Detta borde väl resultera i en "skugga"?

.adb {
border-top-width: 5px;
border-right-width: 5px;
border-left-width: 1px;
border-bottom-width: 1px;
border-style: solid;
border-color: #000000;

background-color: #ffffff; 
font-family: times-new-roman; 
font-size: 16px; 
font-weight: bold; 
color: #006699; 
text-decoration: underline; 
text-align: center; 
width: 500px; 
cellspacing: 3px; 
cellpadding: 3px; 
margin-top: 1%; 
margin-bottom: 2%; 
z-index: 1;
} 

.adb2 { 
border-top-width: 5px;
border-right-width: 5px;
border-left-width: 1px;
border-bottom-width: 1px;
border-style: solid;
border-color: #000000;

background-color: #bbbbbb;
font-family: times-new-roman; 
font-size: 16px; 
font-weight: bold; 
color: #000000; 
text-align: center; 
width: 500px; 
cellspacing: 3px; 
cellpadding: 3px; 
margin-top: 1%; 
margin-bottom: 2%; 
cursor: pointer; 
z-index: 1; 
}

frankofMedlem sedan jan. 20016 874 inlägg

20 apr. 2003 16:10#7

Detta är det närmste jag kommer.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
	"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<style>
table{ padding: 0px; border-bottom:5px solid #cfcfcf; border-right: 5px solid #cfcfcf;}
.adb { border: 3px #006699 solid; 
       background-color: #ffffff; 
       font-family: times-new-roman; 
       font-size: 16px; 
       font-weight: bold; 
       color: #006699; 
       text-decoration: underline; 
       text-align: center; 
       width: 500px; 
       margin-top: 0px; 
       margin-bottom: 0px; 
       z-index: 1;

     } 
.adb2 { border: 3px #000000 solid; 
       background-color: #bbbbbb; 
       font-family: times-new-roman;
       font-size: 16px; 
       font-weight: bold;
       color: #000000; 
       text-align: center;
       width: 500px; 
       margin-top: 0px; 
       margin-bottom: 0px; 
       cursor: pointer; 
       z-index: 1;

     } 
</style>
</head>
<body>
<table cellspacing="0"> 
<tr> 
<td class="adb" onmouseover="this.className='adb2'" 
onmouseout="this.className='adb'" 
onclick="self.location.href='adbinfo/adbkontakt.htm'"
onMouseOver="moveover('Adb-enhetens kontaktuppgifterna och arbetsf&ouml;rdelningen');return true;"> 
Adb-enhetens kontaktuppgifter och arbetsf&ouml;rdelning 

</td> 
</tr>
</table>
</body>
</html>

dectgapMedlem sedan sep. 20021 655 inlägg

20 apr. 2003 17:01#8

Vad sägs om att använda lite korrekt CSS?

       font-family: times-new-roman;
       /* ska vara font-family: "Times New Roman", serif; */
       cellspacing: 0px;
       /* Det finns ingen CSS-egenskap som heter cellspacing */
       cellpadding: 0px;
       /* Det finns ingen CSS-egenskap som hete cellpadding.
          Däremot finns "padding" som du sätter för varje cell,
          och inte för en hel tabell. */