Gå til innhold

Webkafeen


Anbefalte innlegg

Videoannonse
Annonse
For å lage enda mer system, hvorfor kan ikke de to trådene om artikler (farge og webdesigner) legges til i den "Oppslagsverk over artikler"..?

Enig, det er vel der de hører hjemme?

Syns at webkafeen bør være sticky.

Edit: Grunngivelse: Det er en tråd der man bl.a. kan stille enkeltspørsmål som er for små til å lage ny tråd om. Den er mer synlig som sticky for nye brukere som ikke vet dette, tror jeg.

Og logo-tråden forsvinner vel snart uansett?

Endret av svamp
Lenke til kommentar

Siden du bruker bilder, må du lage ett bilde av hvordan menyvalget skal se ut uten hover, og et med hover, som du altså legger i samme .jpg-fil. Litt dårlig forklart, men her er et eksempel.

 

Da setter du altså høyden til halvparten av høyden på .jpg-fila du linker til, slik at ikke hele bildet kommer med. :)

Lenke til kommentar
_litt_ vanskelig iom at den er på et ganske tidlig punkt i utviklingen... Koden ser jo ok ut til nå hvertfall

ok, da satser jeg på at den ikke er helt forj*vlig.. :p

 

nå har jeg lagd et bilde som ser sånn ut:

knapp_test1.jpg

 

hva skal stå i koden for at den vil funke?

 

i dag ligger de i html-dokumentet, men de skal kanskje i css-style'n isteden??

kodene mine er som følger:

 

html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="no-bok">
<title>datating.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link href="./style.css" rel="stylesheet" type="text/css">
<style type="text/css">
p {color: #FFF}
p.margin {margin-left: 0.5cm}
p.margin {margin-right: 0.5cm}
</style>

</head>

<body>

<div class="container">

 <div id="header"></div>
 <div id="meny"><img border="0" src="knapp_hjem1.jpg" width="154" height="30"><img border="0" src="knapp_news.jpg" width="154" height="30"><img border="0" src="knapp_test.jpg" width="154" height="30"><img border="0" src="knapp_test.jpg" width="154" height="30"></div>
 <div id="innhold"><p class="margin"></p></div>
 <div id="footer">
<?php
include("count.php");
?></div>

</div>

</body>

</html>

 

css

div.container {
width: 640px;
margin: 0 auto;
}

div#header {
width: 618px;
height: 120px;
background-image: url(header3.jpg);
}

div#meny {
margin-right: 10px;
width: 618px;
height: 30px;
background-image: url(meny2.jpg);
float: left;
display: inline;
}

div#innhold {
width: 618px;
height: 450px;
background-image: url(hoved2.jpg);
float: left;
}

div#footer {
width: 618px;
height: 30px;
overflow: hidden;
background-image: url(meny2.jpg);
clear: both;
}

body
{ 
background: #333
}


a {
text-decoration:none;
color:#CCCCCC;
}

a:hover {
text-decoration:none;
color:#FFF;
}

a:active {
text-decoration:none;
color:#6E82DC;
}

a:visited {
text-decoration:none;
color:#6E82DC;
}

a:visited:hover {
text-decoration:none;
color:#FFF;
}

Lenke til kommentar

ul#menu {
list-style: none;
}

ul#menu li {
display: inline;
float: left;
}

ul#menu li a {
display: block;
overflow: hidden;
padding: 15px 0 0 0;
height: 0 !important;
height /**/ : 15px;
width: 100px;
}

ul#menu li a:hover {
background-position: 0 -15px;
}

.klasse1 {
background-image: url("link1.gif");
}

 

<ul id="menu">
<li><a class="klasse1" href="#">Link1</a></li>
<li><a class="klasse2" href="#">Link2</a></li>
<li><a class="klasse3" href="#">Link3</a></li>
</ul>

 

Omtrent.

 

EDIT: Glemte bredde. :blush:

Endret av PoleCat
Lenke til kommentar

se på vedlegget.. som du ser er den ene knappen 3 ganger i bredden.. hvorfor er den det, og skal den være det??

 

er kodene nå riktig:

<body>

<div class="container">

 <div id="header"></div>
 <div id="meny"><ul id="menu">
<li><a class="klasse1" href="#">Link1</a></li>
<li><a class="klasse2" href="#">Link2</a></li>
<li><a class="klasse3" href="#">Link3</a></li>
</ul></div>
 <div id="innhold"><p class="margin"></p></div>
 <div id="footer">
<?php
include("count.php");
?></div>

</div>

</body>

 

ul#menu {
list-style: none;
}

ul#menu li {
display: inline;
float: left;
}

ul#menu li a {
display: block;
overflow: hidden;
padding: 30px 0 0 0;
height: 0 !important;
height /**/ : 30px;
width: 100px;
}

ul#menu li a:hover {
background-position: 0 -30px;
}

.klasse1 {
background-image: url("knapp_test1.jpg");
}

post-76-1094394100_thumb.jpg

Endret av datating
Lenke til kommentar
...og <img>-tagger skal du ikke lenger bruke.

Hva er det for noe tull? Om bildet har en logisk funksjon, og ikke for designets eller layoutens skyld, kan det fint stå i HTML-koden. :shrug:

Blablablabla.

 

Har disse bildene vi snakker om her en logisk funksjon? :roll:

 

----------------

 

datating: Jeg har ikke skrevet riktig bredde osv, det må du finne ut selv.

EDIT; Vedlegg? :dontgetit:

Endret av PoleCat
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
×
×
  • Opprett ny...