Søg
Avatar billede lun Nybegynder
31. oktober 2003 - 19:17 Der er 24 kommentarer og
1 løsning

Tabel, css, farveskift i baggrund og knap-effekt

Se dette:

<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {color: black; background: white}
body, td {font: 12px verdana,arial,sans-serif}
a {color: #5A015B; text-decoration: none}
a:hover {color: #FF0000}
.tbl a {color: black; display: block; padding: 3px; background: black}
.tbl a:hover {color: black; display: block; padding: 3px ; background: #808080}
</style>
</head>

<body>

<div align="center">
  <center>

<table cellspacing="3" cellpadding="5" border="0" class="tbl" width="80%" style="border-collapse: collapse" bordercolor="#111111"><tr>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="index.htm"><b><font color="#FFFFFF" size="3">Forside</font></b></a></p>
</td>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="priser.htm"><b><font color="#FFFFFF" size="3">Priser</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="kontakt.htm"><b><font color="#FFFFFF" size="3">Kontakt</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="webportfolio.htm"><b><font color="#FFFFFF" size="3">WebPortfolio</font></b></a></p>
</td>
</tr></table>

  </center>
</div>

</body>



Baggrunden skifter farve når musen går over, og når linket er aktivt. Jeg kunne godt tænke mig at få kanter på, så det ligner en knap man trykker ned. Både når linket ikke er aktivt, ved mouse-over og ved active. Farverne ændrer jeg selv bagefter, men hvem kan skrive det ind for mig?

101 points hvis det virker.
Avatar billede cdc Novice
31. oktober 2003 - 19:18 #1
border: 1px black;
Avatar billede cdc Novice
31. oktober 2003 - 19:19 #2
sorry border: 1 solid black;
Avatar billede cdc Novice
31. oktober 2003 - 19:19 #3
eller border: 1 solid #C00000;
Avatar billede lun Nybegynder
31. oktober 2003 - 19:20 #4
Er du venlig at sætte det ind det rigtige sted? :-)
Avatar billede cdc Novice
31. oktober 2003 - 19:20 #5
et eksempel: http://hjem.get2net.dk/arntsen/eksperten/menu/menu_11.htm
Avatar billede lun Nybegynder
31. oktober 2003 - 19:21 #6
Huske det skal være forskellige farver alt efter om linket er aktivt eller bare mouse-over. Samt forskellige farver, så der kommer skyggevirkning (knapvirkning)
Avatar billede cdc Novice
31. oktober 2003 - 19:23 #7
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {color: black; background: white}
body, td {font: 12px verdana,arial,sans-serif}
a {color: #5A015B; text-decoration: none; border: 1 solid #c00000;}
a:hover {color: #FF0000}
.tbl a {color: black; display: block; padding: 3px; background: black;}
.tbl a:hover {color: black; display: block; padding: 3px ; background: #808080; border: 1 solid #000000;}
</style>
</head>

<body>

<div align="center">
  <center>

<table cellspacing="3" cellpadding="5" border="0" class="tbl" width="80%" style="border-collapse: collapse" bordercolor="#111111"><tr>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="index.htm"><b><font color="#FFFFFF" size="3">Forside</font></b></a></p>
</td>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="priser.htm"><b><font color="#FFFFFF" size="3">Priser</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="kontakt.htm"><b><font color="#FFFFFF" size="3">Kontakt</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="webportfolio.htm"><b><font color="#FFFFFF" size="3">WebPortfolio</font></b></a></p>
</td>
</tr></table>

  </center>
</div>

</body>
Avatar billede lun Nybegynder
31. oktober 2003 - 19:24 #8
nej, det er ikke sådan jeg mener.

http://www.kaninbjerget.dk/lundhus/test.html

det nederste skema, sådan vil jeg have kanter på, der også skifter farve ved mouseover osv
Avatar billede mm12010 Nybegynder
31. oktober 2003 - 19:27 #9
<td width="50%" style="border: 1px solid black;" onMouseOver="this.style.borderColor='red'" onMouseOut="this.style.borderColor='#ffffff'">&nbsp;</td>
Avatar billede lun Nybegynder
31. oktober 2003 - 19:29 #10
og det skal være skemaets baggrund der skifter farve, ikke kun takstbaggrunden
Avatar billede cdc Novice
31. oktober 2003 - 19:29 #11
så skal du definere alle knappes sider border-left:

<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {color: black; background: white}
body, td {font: 12px verdana,arial,sans-serif}
a {
color: #5A015B;
text-decoration: none;
border-top: 10 solid #c00000;
border-left: 10 solid #c00000;
border-right: 10 solid #ebebeb;
border-bottom: 10 solid #ebebeb;
}
a:hover {color: #FF0000}
.tbl a {color: black; display: block; padding: 3px; background: black;}
.tbl a:hover {
color: black;
display: block;
padding: 3px ;
background: #808080;
border-top: 10 solid #ebebeb;
border-left: 10 solid #ebebeb;
border-right: 10 solid #c00000;
border-bottom: 10 solid #c00000;
}
</style>
</head>

<body>

<div align="center">
  <center>

<table cellspacing="3" cellpadding="5" border="0" class="tbl" width="80%" style="border-collapse: collapse" bordercolor="#111111"><tr>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="index.htm"><b><font color="#FFFFFF" size="3">Forside</font></b></a></p>
</td>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="priser.htm"><b><font color="#FFFFFF" size="3">Priser</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="kontakt.htm"><b><font color="#FFFFFF" size="3">Kontakt</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="webportfolio.htm"><b><font color="#FFFFFF" size="3">WebPortfolio</font></b></a></p>
</td>
</tr></table>

  </center>
</div>

</body>
Avatar billede lun Nybegynder
31. oktober 2003 - 19:29 #12
mm12010 : det skal sættes ind i hele koden, please :-)
Avatar billede lun Nybegynder
31. oktober 2003 - 19:31 #13
hey, det ser flot ud /cdc

Er det ikke bare farverne der skal defineres?
Avatar billede mm12010 Nybegynder
31. oktober 2003 - 19:32 #14
...?-)
Avatar billede lun Nybegynder
31. oktober 2003 - 19:32 #15
Fantastisk! 1000 tak!
Avatar billede cdc Novice
31. oktober 2003 - 19:32 #16
jo og størrelsen på border der er sadt til 10
Avatar billede lun Nybegynder
31. oktober 2003 - 19:44 #17
Åh nej, jeg mangler lige en detalje; at mouseover farven på selve teksten også kan ændres. Kan du ikke lige sætte det ind også?
***********


<html>

<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {color: black; background: black}
body, td {font: 12px verdana,arial,sans-serif}
a {
color: #5A015B;
text-decoration: none;
border-top: 5px solid #C0C0C0;
border-left: 5px solid #C0C0C0;
border-right: 5px solid #808080;
border-bottom: 5px solid #808080;
}
a:hover {color: #FF0000}
.tbl a {color: black; display: block; padding: 3px; background: black;}
.tbl a:hover {
color: black;
display: block;
padding: 3px ;
background: #808080;
border-top: 5px solid #ebebeb;
border-left: 5px solid #ebebeb;
border-right: 5px solid #C0C0C0;
border-bottom: 5px solid #C0C0C0;
}
</style>
</head>

<body>

<div align="center">
  <center>

<table cellspacing="3" cellpadding="5" border="0" class="tbl" width="80%" style="border-collapse: collapse" bordercolor="#111111"><tr>
<td align="center" valign="middle" width="96">
  <p align="center"><b><a href="index.htm"><font color="#FFFFFF" size="3">Forside</font></a></b></p>
</td>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="priser.htm"><b><font color="#FFFFFF" size="3">Priser</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="kontakt.htm"><b><font color="#FFFFFF" size="3">Kontakt</font></b></a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="webportfolio.htm"><b><font color="#FFFFFF" size="3">WebPortfolio</font></b></a></p>
</td>
</tr></table>

  </center>
</div>

</body><!--webbot bot="HTMLMarkup" endspan --></p>

</body>

</html>
Avatar billede cdc Novice
31. oktober 2003 - 19:58 #18
det er lidt rod i din css, håber du selv har styr på det:

<html>

<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {color: black; background: black}
body, td {color: black; font: 12px verdana,arial,sans-serif}
a {
color: #ffffff;
font: 12px verdana,arial,sans-serif;
font-weight: bold;
text-decoration: none;
border-top: 5px solid #C0C0C0;
border-left: 5px solid #C0C0C0;
border-right: 5px solid #808080;
border-bottom: 5px solid #808080;
}
a:hover {color: #FF0000}

.tbl a {
color: #ffffff;
font-weight: bold;
display: block;
padding: 3px;
background: black;
}
.tbl a:hover {
color: black;
font: 12px verdana,arial,sans-serif;
font-weight: bold;
display: block;
padding: 3px ;
background: #808080;
border-top: 5px solid #ebebeb;
border-left: 5px solid #ebebeb;
border-right: 5px solid #C0C0C0;
border-bottom: 5px solid #C0C0C0;
}
</style>
</head>

<body>

<div align="center">
  <center>

<table cellspacing="3" cellpadding="5" border="0" class="tbl" width="80%" style="border-collapse: collapse" bordercolor="#111111"><tr>
<td align="center" valign="middle" width="96">
  <p align="center"><b><a href="index.htm">Forside</a></b></p>
</td>
<td align="center" valign="middle" width="96">
  <p align="center"><a href="priser.htm">Priser</a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="kontakt.htm">Kontakt</a></p>
</td>
<td align="center" valign="middle" width="97">
  <p align="center"><a href="webportfolio.htm">WebPortfolio</a></p>
</td>
</tr></table>

  </center>
</div>

</body><!--webbot bot="HTMLMarkup" -->

</html>
Avatar billede lun Nybegynder
31. oktober 2003 - 20:13 #19
overhovedet ikke! Er det noget du kan klare?
vh Sofie
Avatar billede cdc Novice
31. oktober 2003 - 20:33 #20
du bruger to forskellige css for dine links, men det er svært at sige hvad du skal når man ikke kan se hele siden, men kun som denne menu funker det fint, hvis du vil have text med links begynder problemerne at opstå....
man kan gøre det noget mere enkelt, men så må man se hvordan menuen skal vises på siden, om den er på en side eller i en frame....
Bruges den i en frame kan den gøres noget nemmere, men på en side, med text, skal der ryddes op
Avatar billede lun Nybegynder
31. oktober 2003 - 20:38 #21
den er i en frame, og peger ind i framen. Skal jeg formulere et nyt spørgsmål med points?

Den er i brug på www.kaninbjerget.dk/lundhus/

Jeg har ikke sat den ind endnu
Avatar billede cdc Novice
31. oktober 2003 - 20:41 #22
jeg har ikke tid lige nu, men vender tilbage lidt sener.
Avatar billede lun Nybegynder
31. oktober 2003 - 20:43 #23
ok. Men jeg vil gerne have den så jeg kan redigere den og bruge den til andre sider også. Kan jeg redigere den i FP som WYSIWYG, uden at den så roder rundt i koden?
Avatar billede roenving Novice
01. november 2003 - 00:28 #24
Det vil være dumt at redigere i css-styles i wysiwyg !-)
Avatar billede lun Nybegynder
01. november 2003 - 08:17 #25
ja, ok. Men et trim ville være godt, og så må jeg jo lære at redigere de forskellige parametre.
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
I går 18:50 Slet lokal konto Af ErikHg i Windows
I går 16:05 Ændre tal i en celle Af xvid i Excel
I går 13:47 Dette er ikke en kommerciel session i Windows 11 Af eksmojo i Windows
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
White papers
Flere white papers »