Søg
Avatar billede maxsover Nybegynder
02. december 2003 - 20:51 Der er 16 kommentarer og
1 løsning

Skygge omkring en tabel

Hej.
Er der ikke en der kan lave en tabel med 5 kolonner og 5 rækker, som har en skygge ude på siderne.

Tabellen skal i midten af siden, også skal den kunne passe til en skærmopløsning på 800x600 px.

MaxSover
Avatar billede skovenborg Nybegynder
02. december 2003 - 22:54 #1
Hva' med:
<!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">
<html>
<head>
<title>Side</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body {height:100%;margin:0px;padding:0px}
</style>

</head>
<body>
<table style="height:100%;width:100%;">
<tr>
  <td style="height:100%;width:100%";>
<table style="margin:0px auto;border:1px solid #000;vertical-align:middle">
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
</table>
</td>
</tr>
</table>

</body>
</html>
Avatar billede roenving Novice
03. december 2003 - 00:04 #2
Måske nærmere:

<!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">
<html>
<head>
<title>Side</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body {height:100%;margin:0px;padding:0px;background:#ccc;}
</style>
</head>
<body>
<table style="margin-left:auto;margin-right:auto;border:1px solid #000;background:#fff;width:800px;height:600px;">
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
  <td>5</td>
  </tr>
</table>
</body>
</html>
Avatar billede skovenborg Nybegynder
03. december 2003 - 16:29 #3
jo hvis det var det maxsover mente med at den skulle passe til 800x600 (og så skal der jo alligevel trækkes lidt fra da selve vinduet jo aldrig er 800x600.
Avatar billede maxsover Nybegynder
03. december 2003 - 17:52 #4
Jeg har set på dem begge... og jeg synes ikke at man ser en eneste skygge..

Der skal være skygger helt ude i siderne..
ikke i toppen eller bunden.
Avatar billede skovenborg Nybegynder
04. december 2003 - 00:18 #5
Så skal du vel bare gøre sådan:
<table style="margin:0px auto;border:1px solid #000;border-width:0px 1px;vertical-align:middle">

eller hvis ud bedre kan li' roenvings:
<table style="margin-left:auto;margin-right:auto;border:1px solid #000;border-width:0px 1px;background:#fff;width:800px;height:600px;">
Avatar billede maxsover Nybegynder
04. december 2003 - 00:47 #6
hmmmm??
Ser stadig ingen skygger..

Når jeg siger skygger mener jeg noget i stil med denne side www.planetsnow.dk
Prøv at se den røde skygge ude i siden.. men jeg skal bare bruge en sort skygge.
Avatar billede roenving Novice
04. december 2003 - 02:06 #7
Måske:

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

<META NAME="Keywords" CONTENT="olebole,http://www.eksperten.dk/spm/342379">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.shadeHolder {
    position: relative;
}
.shadeTBL {
    position: relative;
    left: 0px;
    top: 0px;
    z-index: 5;
    background-color: #ffffff;
}
.shader {
    position: absolute;
    background-color: #000080;
}
</style>
<script type="text/JavaScript">
var startOpacity = 25; // Sæt selv start-opaciteten
var d=document;
function gA(o,tN){return o.getElementsByTagName(tN)}
function pI(s){return parseInt(s)}
function doShade(tbl) {
    var w, h, a, offset, opac, cont = (d.all)? tbl.parentElement : tbl.parentNode;
    w=pI(tbl.offsetWidth); h=pI(tbl.offsetHeight);
    a = new Array();
    var steps = (d.all && !window.createPopup)? 1 : 4; // Antal skygge-steps
    for (var i=1; i<steps+1; i++) {
        offset = i + "px";
        opac = startOpacity / i;
        a[a.length] = '<img class="shader" src="spacersort.gif" ';
        a[a.length] = 'style="width:'+w+'px;height:'+h+'px;left:'+offset+';top:'+offset+';z-index:'+i+';';
        if (d.all) a[a.length] = 'filter:alpha(opacity='+opac+')">';
        else a[a.length] = '-moz-opacity:'+(opac/100)+'">';
    }
    cont.innerHTML += a.join("");
}

function initShadeTBLs() {
    if (d.layers) return;
    var aTbl = gA(d,"TABLE");
    for (var i=0; i<aTbl.length; i++) {
        if ( aTbl[i].className=="shadeTBL" ) doShade( aTbl[i] );
    }
}
window.onload = initShadeTBLs;
</script>
</head>
<body>

<div class="shadeHolder">
    <table class="shadeTBL" cellspacing="0" cellpadding="0" border="3">
    <tr>
        <td>Lorem ipsum dolor sit amet, consectetur<br>
            adipisicing elit, sed do eiusmod tempor incididunt<br>
            ut labore et dolore magna aliqua.</td>
    </tr>
    </table>
</div>

<br><br>

<div class="shadeHolder">
    <table class="shadeTBL" cellspacing="0" cellpadding="0" border="3">
    <tr>
        <td>Ut enim ad minim veniam, quis nostrud<br>
            exercitation ullamco laboris nisi ut aliquip ex<br>
            ea commodo consequat. Duis aute irure dolor in<br>
            reprehenderit in voluptate velit esse cillum</td>
    </tr>
    </table>
</div>

</body>
</html>
Avatar billede inglenook Praktikant
04. december 2003 - 02:19 #8
gaa til www.planetsnow.dk, hoejreklik paa et bart stykke paa siden (ikke et image) og vaelg 'View source' Saa kan du se hvordan det er lavet......
Avatar billede maxsover Nybegynder
04. december 2003 - 12:34 #9
hans side er i php, så man ser ikke andet end html hvis jeg vil se kilden
Avatar billede maxsover Nybegynder
04. december 2003 - 12:35 #10
Der er en der virker...
Tak roenving.
Lig lige svar, hvis du vil have point.
Avatar billede maxsover Nybegynder
04. december 2003 - 15:42 #11
Fandt ud af at det ikke var det jeg søgte...
Det skal være mere ligesom www.clan-gtf.dk 's skygger... som er helt ude i siderne...
Avatar billede skovenborg Nybegynder
04. december 2003 - 16:18 #12
det de har gjort er at de har tre celler i en centreret tabel, hvor den midterste er indholdet og de to til højre og venstre indeholder et baggrundbillede af skyggen (ganske lille selvfølgelig). På den måde for du den skygge effekt du åbenbart ledte efter:
<body>
<center>
<table width="700">
  <tr>
  <td style="background-image:url('venstreRamme.png');width:10px;">
    &nbsp;
  </td>
  <td width="680">
    INDHOLD
  </td>
  <td style="background-image:url('hojreRamme.png');width:10px">
  &nbsp;
  </td>
</tr>
</table>
</center>
</body>
Avatar billede roenving Novice
04. december 2003 - 16:25 #13
Kan du bruge det ?-)

-- så velbekomme '-)
Avatar billede maxsover Nybegynder
04. december 2003 - 16:49 #14
hmm.. okay... men det kan bare ikke bruges så meget...
Jeg har da haft en kode engang, hvor jeg brugte html/javascript til at lave skygge med...
Avatar billede skovenborg Nybegynder
04. december 2003 - 17:59 #15
hvorfor vil du bruge javascript??? Du bruger måske ikke tabeller - for så kan det jo ikke løses så enkelt.
Avatar billede maxsover Nybegynder
04. december 2003 - 21:05 #16
jeg arbejder bare med Roenvings forslag fra før
Avatar billede roenving Novice
04. december 2003 - 21:17 #17
-- takker for points ;~}
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
31/0810:26 Synkronisering af kalender mellem computer, android telefon og iPhone Af Strawberry i Andre onlineløsninger
31/0810:24 Kan Excel selv beregne alder? Af leahcim i Excel
30/0815:02 Gemme besked fra Facebook / Messenger Af lurup i Sociale medier
29/0820:17 Kan man kopiere en DVD og afspille den på * Linux Mint - Cinnamon - 22.1 - "Xia" * ? Af Ikke-ekspert i Linux
27/0821:03 Kan man få Word viewer gratis Af Strawberry i Word
White papers
Flere white papers »