Gå til innhold

Hjelp med layout/bilder. Problem!


Anbefalte innlegg

Holder på å lage en hjemmeside om "internettspråk" (vet det høres tragisk ut, men det var en oppgave man kunne velge å ha om det på skolen). Men så begynnte jeg å få en de problem med bildene på siden. Når jeg forhåndsviser siden i Mozilla Firefox ser alt helt fint ut, men etter at jeg har lagt den ut, får jeg problemer med bildene/layouten. Kan det være feil koding eller noe?

 

Her er bilde av forhåndvisninga i MF: Bilde 1

 

Sånn ser den ut etter at jeg har lagt den ut: Bilde 2

 

 

<html>
<head>
<title>slices</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body bgcolor="#272727" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<center>
<table id="Table_01" width="800" height="672" border="0" cellpadding="0" cellspacing="0">
<tr>
	<td rowspan="11"> </td>
	<td rowspan="11" background="images/index_02.jpg"> </td>
 <td colspan="9">
		<img src="images/index_03.jpg" width="610" height="62" alt=""></td>
	<td rowspan="11" background="images/index_04.jpg"> </td>
 <td rowspan="11"> </td>
</tr>
<tr>
	<td colspan="3">
		<img src="images/index_06.jpg" width="94" height="19" alt=""></td>
	<td colspan="3" align="center" background="images/index_07.jpg">Menu </td>
<td colspan="3">
		<img src="images/index_08.jpg" width="95" height="19" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_09.jpg" width="610" height="98" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_10.jpg" width="610" height="27" alt=""></td>
</tr>
<tr>
	<td colspan="2" background="images/index_11.jpg"> </td>
	<td colspan="2" align="center" valign="top" bgcolor="181818">
	<p align="left"><span lang="no-nyn">På denne heimesida skal det etter 
	kvart komme diverse fakta og informasjon om dei forskjellige 
	skrivemåtane som bli tatt i bruk med datamaskinen. Det er spesielt nokre 
	skrivemåtar som skilder seg ut. Blant desse har eg vald internettspråk, 
	chatspråk og leetspeak som hovedtema for sida. </span></td>
 <td background="images/index_13.jpg"> </td>
	<td colspan="2" valign="top" bgcolor="#181818"><iframe width="284" height="92" border="0" frameborder="0" src="news.html"></iframe></td>
<td colspan="2" background="images/index_15.jpg"> </td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_16.jpg" width="610" height="11" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_17.jpg" width="610" height="30" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_18.jpg" width="610" height="26" alt=""></td>
</tr>
<tr>
	<td>
		<img src="images/index_19.jpg" width="6" height="259" alt=""></td>
	<td colspan="7" valign="top" bgcolor="#181818"><iframe width="599" height="259" border="0" frameborder="0" src="content.html"></iframe></td>
<td>
		<img src="images/index_21.jpg" width="5" height="259" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_22.jpg" width="610" height="9" alt=""></td>
</tr>
<tr>
	<td colspan="9">
		<img src="images/index_23.jpg" width="610" height="38" alt=""></td>
</tr>
<tr>
	<td>
		<img src="images/spacer.gif" width="64" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="31" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="6" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="4" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="84" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="202" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="20" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="199" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="85" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="5" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="5" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="31" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="64" height="1" alt=""></td>
</tr>
</table>
</center>

<div style="font-size: 0.8em; text-align: center; margin-top: 1.0em; margin-bottom: 1.0em;">
 </div>
</body>
</html>

 

 

 

Håper noen ser hva som er galt. Trenger virkelig hjelp ettersom oppgaven skal leveres in snart.

Endret av ZeroZ
Lenke til kommentar
Videoannonse
Annonse
Ser ikke noen bilder jeg. Hva er problemet da? Har du "lansert" siden gjennom FTP og ikke sendt med mappen med bildene eller...?

RandiA

 

Jo, har brukt et program kalt "SmartFTP", og jeg lastet opp bildene.

Ser her. Bildene er der de..

Det enesste jeg kan tenke meg da, (lett å gjøre den feilen) er at du ikke har krysset av for, eller oppgitt URL adresse, ser du bildene (på web) bare som et lite merke kanskje? Da har du sendt dem av gårde med "adresse inna bords på egen maskin"...hvis du forstår hva jeg mener.

RandiA

Lenke til kommentar

Bildene må ligge i en mappe som heter "images" under på server. alternativt kan du skrive om koden slik og da må du ha html dokumentene dine og bildene i samme mappe.

 

 

<html>

<head>

<title>slices</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link href="style.css" type="text/css" rel="stylesheet">

</head>

<body bgcolor="#272727" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<center>

<table id="Table_01" width="800" height="672" border="0" cellpadding="0" cellspacing="0">

<tr>

<td rowspan="11"> </td>

<td rowspan="11" background="index_02.jpg"> </td>

<td colspan="9">

<img src="index_03.jpg" width="610" height="62" alt=""></td>

<td rowspan="11" background="index_04.jpg"> </td>

<td rowspan="11"> </td>

</tr>

<tr>

<td colspan="3">

<img src="index_06.jpg" width="94" height="19" alt=""></td>

<td colspan="3" align="center" background="index_07.jpg">Menu </td>

<td colspan="3">

<img src="index_08.jpg" width="95" height="19" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_09.jpg" width="610" height="98" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_10.jpg" width="610" height="27" alt=""></td>

</tr>

<tr>

<td colspan="2" background="index_11.jpg"> </td>

<td colspan="2" align="center" valign="top" bgcolor="181818">

<p align="left"><span lang="no-nyn">På denne heimesida skal det etter

kvart komme diverse fakta og informasjon om dei forskjellige

skrivemåtane som bli tatt i bruk med datamaskinen. Det er spesielt nokre

skrivemåtar som skilder seg ut. Blant desse har eg vald internettspråk,

chatspråk og leetspeak som hovedtema for sida. </span></td>

<td background="index_13.jpg"> </td>

<td colspan="2" valign="top" bgcolor="#181818"><iframe width="284" height="92" border="0" frameborder="0" src="news.html"></iframe></td>

<td colspan="2" background="index_15.jpg"> </td>

</tr>

<tr>

<td colspan="9">

<img src="index_16.jpg" width="610" height="11" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_17.jpg" width="610" height="30" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_18.jpg" width="610" height="26" alt=""></td>

</tr>

<tr>

<td>

<img src="index_19.jpg" width="6" height="259" alt=""></td>

<td colspan="7" valign="top" bgcolor="#181818"><iframe width="599" height="259" border="0" frameborder="0" src="content.html"></iframe></td>

<td>

<img src="index_21.jpg" width="5" height="259" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_22.jpg" width="610" height="9" alt=""></td>

</tr>

<tr>

<td colspan="9">

<img src="index_23.jpg" width="610" height="38" alt=""></td>

</tr>

<tr>

<td>

<img src="spacer.gif" width="64" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="31" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="6" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="4" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="84" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="202" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="20" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="199" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="85" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="5" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="5" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="31" height="1" alt=""></td>

<td>

<img src="spacer.gif" width="64" height="1" alt=""></td>

</tr>

</table>

</center>

 

<div style="font-size: 0.8em; text-align: center; margin-top: 1.0em; margin-bottom: 1.0em;">

 </div>

</body>

</html>

 

 

forresten, hvorfor har du ikke lagt inn <!DOCTYPE> tag.

Lenke til kommentar

Ja, sorry...så ikke det jeg. Bildene må ligge i mappe. Html sidene ligger fritt.Jeg bruker gjerne en bildemappe for hvert emne i web-siten. Men du har sikkert ikke så mye og kan ha en mappe for alle bilder. I min editor lager forresten mappene seg selv, alt etter det navnet jeg gir html siden, f.eks slik: diverse_files

RandiA

Lenke til kommentar
Bildene må ligge i en mappe som heter "images" under på server. alternativt kan du skrive om koden slik og da må du ha html dokumentene dine og bildene i samme mappe.

 

forresten, hvorfor har du ikke lagt inn <!DOCTYPE> tag.

 

 

1000 x takk for hjelpen! Etter at jeg flyttet bildene inn i en "Images" mappe, så funket de på side også. Men skriften er ikke helt som den skal være. Kommer dette av at jeg ikke har valgt <!DOCTYPE> enda`? Noen som har forslag til hvilken jeg kan/burde bruke?

 

Edit: Sånn ser teksten ut på hjemmesiden akkurat nå: http://home.no/kjetilfoldoey/

Edit2: Fikk til det greiene med bokstavene æ,ø,å. Hadde kodet feil..

Endret av ZeroZ
Lenke til kommentar
Bildene må ligge i en mappe som heter "images" under på server. alternativt kan du skrive om koden slik og da må du ha html dokumentene dine og bildene i samme mappe.

 

forresten, hvorfor har du ikke lagt inn <!DOCTYPE> tag.

 

 

1000 x takk for hjelpen! Etter at jeg flyttet bildene inn i en "Images" mappe, så funket de på side også. Men skriften er ikke helt som den skal være. Kommer dette av at jeg ikke har valgt <!DOCTYPE> enda`? Noen som har forslag til hvilken jeg kan/burde bruke?

 

Edit: Sånn ser teksten ut på hjemmesiden akkurat nå: http://home.no/kjetilfoldoey/

Edit2: Fikk til det greiene med bokstavene æ,ø,å. Hadde kodet feil..

 

 

Overskriv index.html filen din med dette innholdet

 

 

<!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">

<head>

<title>slices</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link href="style.css" type="text/css" rel="stylesheet" />

</head>

<body bgcolor="#272727">

<center>

<table width="800" border="0" cellpadding="0" cellspacing="0">

<tr>

<td rowspan="11"> </td>

<td class="artleft" valign="top" rowspan="11"> </td>

<td colspan="9">

<img src="images/index_03.jpg" width="610" height="62" alt="" /></td>

<td class="artright" valign="top" rowspan="11"> </td>

<td rowspan="11"> </td>

</tr>

<tr>

<td colspan="3">

<img src="images/index_06.jpg" width="94" height="19" alt="" /></td>

<td class="meny" colspan="3" align="center"><a class="menytekst" target="_top" href="index.html">Home</a>

<a class="menytekst" target="_top" href="historie_index.html">Historie</a>

<a class="menytekst" target="_top" href="linkar_index.html">Linkar</a></td>

<td colspan="3">

<img src="images/index_08.jpg" width="95" height="19" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_09.jpg" width="610" height="98" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_10.jpg" width="610" height="27" alt="" /></td>

</tr>

<tr>

<td class="divideleft" valign="top" colspan="2"> </td>

<td class="standardtekst" valign="top" colspan="2">

På denne heimesida skal det etter

kvart komme diverse fakta og informasjon om dei forskjellige

skrivemåtane som bli tatt i bruk med datamaskinen. Det er spesielt nokre

skrivemåtar som skilder seg ut. Blant desse har eg vald internettspråk,

chatspråk og leetspeak som hovedtema for sida.</td>

<td class="dividecenter" valign="top"> </td>

<td colspan="2" valign="top" bgcolor="#181818"><iframe width="284" height="92" frameborder="0" src="news.html"></iframe></td>

<td class="divideright" valign="top" colspan="2"> </td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_16.jpg" width="610" height="11" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_17.jpg" width="610" height="30" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_18.jpg" width="610" height="26" alt="" /></td>

</tr>

<tr>

<td>

<img src="images/index_19.jpg" width="6" height="259" alt="" /></td>

<td colspan="7" valign="top" bgcolor="#181818"><iframe width="599" height="259" frameborder="0" src="content.html"></iframe></td>

<td>

<img src="images/index_21.jpg" width="5" height="259" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_22.jpg" width="610" height="9" alt="" /></td>

</tr>

<tr>

<td colspan="9">

<img src="images/index_23.jpg" width="610" height="38" alt="" /></td>

</tr>

<tr>

<td>

<img src="images/spacer.gif" width="64" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="31" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="6" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="4" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="84" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="202" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="20" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="199" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="85" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="5" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="5" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="31" height="1" alt="" /></td>

<td>

<img src="images/spacer.gif" width="64" height="1" alt="" /></td>

</tr>

</table>

</center>

 

<div style="font-size: 0.8em; text-align: center; margin-top: 1.0em; margin-bottom: 1.0em;">

 </div>

</body>

</html>

 

 

 

Lim dette inn i style.css filen (om du ikke har den åpne opp notisblokk, lim inn og lagre som style.css)

 

@charset "utf-8";

/* CSS Document */

 

 

.meny {

font-family: "Courier New", Courier, monospace;

font-style: normal;

color: #FFFFFF;

background-image: url(images/index_07.jpg);

}

 

.menytekst {

font-family: Verdana;

font-size: x-small;

font-style: normal;

line-height: normal;

font-weight: normal;

color: #FFFFFF;

}

 

.standardtekst {

background-color:#181818;

font-family: Verdana;

font-size: x-small;

font-style: normal;

line-height: normal;

font-weight: normal;

color: #FFFFFF;

text-align: left;

}

 

.artleft {

background-image: url(images/index_02.jpg)

}

 

.artright {

background-image: url(images/index_04.jpg)

}

 

.dividecenter {

background-image: url(images/index_13.jpg)

}

 

.divideleft {

background-image: url(images/index_11.jpg)

}

 

.divideright {

background-image: url(images/index_15.jpg)

}

 

 

 

Og vips så er siden din skrevet i xhtml, validert og bilder og tekst vises slik de skal ;P

 

Edit: Leif was here

Endret av zyx
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å
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...