Kliknite tukaj, da si ogledate profil, kot ga vidijo drugi

Urejanje in kodiranje dizajna
Avtor: jones | Objavljeno: dne 7. september 2009, 12:09
  V lekciji razreza designa smo se naučili izrezovati grafiko, tukaj pa jo bomo na spletni strani uporabili.
 
 
1
  
 
Najprej poiščemo mapo, v kateri imamo shranjene slike in html dokument.

Imeti morate mapo s slikami ter html dokument, kot kaže slika.
 
 
2
  
 
Nato v Dreamweaverju odprete ta html dokument.

Če kliknete nanj na nekem delu vidite, da je sestavljen iz več slik in tako je tudi prav. Glej sliko.
 
 
3
  
 
Sedaj bomo postavili del dizajna kot ozadje, tako da bo kasneje možno pisati po njem.

Torej kliknemo na del dizajna kjer želimo kasneje pisati in pritisnemo Delete na tipkovnici. Slika se vam izbriše ostane pa prazno (belo) okence toda, tako je prav, saj bomo v naslednjem koraku sliko vstavili kot ozadje.
 
 
4
  
 
Sedaj moramo to isto sliko izbrati v polju Bg, ki se nahaja pod Properties na dnu strani, tako kot kaže slika.

To storimo tako, da kliknemo na ikono z mapo, ki leži desno od polja Bg (glej večjo sliko). V mapi Images izberemo sliko, ki smo jo prej izbrisali in kliknemo OK.

Klik tukaj za večjo sliko.
 
 
 
 
 
5
  
 
No sedaj znate postaviti sliko v ozadje, da lahko pišete po njej. Sedaj vam bom pa pokazal kako naredimo gumb uporaben oz. mu dodamo povezavo.

Kliknemo na gumb kateremu želimo dodati povezavo, ter pod Properties v polje Link vpišemo podstran, na katero želimo, da nas po kliku na gumb preusmeri. Bodisi index.html, news.php, contact.php itd. Glej sliko.

Če vam stran čudno raztegne, vpišite v polje Border 0.

Klik za večjo sliko.
 
 
6
  
 
Torej sedaj naj bi znali dati sliko za ozadje ter gumbu nastaviti povezavo. Za bolj zahtevne pa bom predstavil Rollover Image.

To je v bistvu gumb, ki se spremeni, ko gremo z miško čez njega. Spremeni se lahko barva, napis, obroba ... Pogoj za to pa je, da naredite še eno enako veliko sliko gumba (recimo namesto modre date rdečo barvo) in jo shranite nekam v isto mapo.

Torej na tem primeru bo gumb modre barve, ko pa bomo šli z miško prek njega, bo postal rdeč.
 
 
7
  
 
Najprej kliknete na gumb ter pritisnete Delete, polje bo belo tako kot v zgornjem primeru; ne skrbite.

Rollover gumb pa ustvarite tako, da greste pod  Insert -> Image Objects -> Rollover Image.

Sledite korakom ter si pomagajte s sliko na spodnji povezavi. Sedaj v polju Original Image izberete originalno sliko gumba (moj primer modra slika).

V polju Rollover Image izberete sliko, ki se prikaže, ko gremo z miškinim kazalcem prek gumba (moj primer rdeča slika).V polju When clicked, Go to URL pa napišete povezavo oz. podstran, na katero vas klik na gumb preusmeri.

Pomagajte si s to sliko.

Sedaj naj bi znali nastavit sliko kot ozadje, dodati povezavo na gumb ter narediti Rollover Image. Lekcija za razred dizajna se nahaja tukaj, za vsa vprašanja pa forum.
 
 
Komentiraj
  
 
 
 
 
7.9.2009, 14:45
Bravo, odlična lekcija. Super!!!
 
 
 
 
7.9.2009, 14:52
Sem vesel, da ti je všeč. Če pa kdo potrebuje kakšno dodatno obrazložitev naj kar tukaj napiše.
 
 
 
 
7.9.2009, 16:26
Imam en problem.
Namreč ko razrežem dizaj na kose (prejšnja lekcija) in ga shranim kot .html dokument in to "stran" odprem v Dreamweaverju mi začne pisati na sredino posamezdega izreza.
Če kdo ne razume, evo še screen:

http://www.shrani.si/f/W/Cr/4zkPsGWd/unt....
(Desing sem vzel od uporabnika .lolo-ja, ki mi je dovolil njegovo uporabo, da ne bo dzaj kakšne panike tukaj)

spremenil: aleksy (7.9.2009 ob 16.27.44)
 
 
 
 
7.9.2009, 16:59
Hvala za lekcijo!

Imam pa isti problem kot aleksy.Ko pa pritiskam <ENTER> mi pa naredi bele presledke in ne zgleda lepo.
 
 
 
 
7.9.2009, 17:01
Najverjetneje je vertikalna poravnava nastavljena v sredino. Poglejta v HTML kodo in spremenita.
 
 
 
 
7.9.2009, 17:07
Bravo! Zelo dobra lekcija. Vse je nazorno razloženo, povezave do večjih slik, vidi se, da si se potrudil.
 
 
 
 
7.9.2009, 17:50
jones, ali si ti dejansko izdelal spletno stran?
Ker lekcija je super, se pa kar ne morem nagledati designa
 
 
 
 
7.9.2009, 19:04
Dobra lekcija... v veliko pomoč
 
 
 
 
7.9.2009, 20:54
@ aleksy in PTA

Tako kot je rekel kljuka.
V polju Vert nastavita na top. (poglej sliko)



Drugače pa za večjo natančnost oziroma razdelitev teksta ponavadi narisem tabelo pa potem v tabelo pišem.

@ Erco

Dizajn sem samo uporabil na primeru, drugače bi ga bilo malo bolj zakomplicirano skodirati, jaz pa znam samo osnove. Sedaj, če se mi uspe počasi Flash naučit, bom tudi kaj takega probal

spremenil: jones (7.9.2009 ob 21.10.50)
 
 
 
 
8.9.2009, 15:58
@ aleksy in PTA
Tako kot je rekel kljuka.
V polju Vert nastavita na top. (poglej sliko)
Drugače pa za večjo natančnost oziroma razdelitev teksta ponavadi narisem tabelo pa potem v tabelo pišem.
@ Erco
Dizajn sem samo uporabil na primeru, drugače bi ga bilo malo bolj zakomplicirano skodirati, jaz pa znam samo osnove. Sedaj, če se mi uspe počasi Flash naučit, bom tudi kaj takega probal
Hvala, dela jones.
 
 
 
 
10.9.2009, 20:18
zelo dobro
zelo zvito
zelo iznajdljivo
 
 
 
 
14.11.2009, 21:14
dobra lekcija....

Težave imam samo taktat ko naj bi dal del dizajna za ozadje.. Pod "bg" lahko izbiram samo barvo.
Kje je problem? A se da del dizajna dati kod ozadje tudi na kakšen drug način?
 
 
 
 
15.11.2009, 9:58
Pozdravljen.
Morda je težava v tem, da uporabljaš Dreamweaver CS4, saj v tej različici tudi jaz še nisem ugotovil ali obstaja ta opcija.

Drugače pa samo vstaviš background opcijo.
background="pot-do-slike"


Recimo tukaj:
<td colspan="3" valign="top" background="pot-do-slike">
 
 
 
 
17.11.2009, 20:36
jones, hvala za pomoč a se ne spoznam najbolje na kodo...
To je moja koda, pojma nimam kam naj ustavim tale background...

<html>
<head>
<title>Domov</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('roll/images/trueblue_20.gif','roll/images/trueblue_06.gif','roll/images/trueblue_12.gif','roll/images/trueblue_03.gif','roll/images/trueblue_15.gif','roll/images/trueblue_17.gif')">
<!-- ImageReady Slices (trueblue.psd) -->
<table id="Table_01" width="1263" height="1801" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="16">
<img src="images/index_01.gif" width="1262" height="313" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="313" alt=""></td>
</tr>
<tr>
<td colspan="9">
<img src="images/index_02.gif" width="718" height="4" alt=""></td>
<td rowspan="6"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image62','','roll/images/trueblue_03.gif',1)"><img src="images/index_03.gif" name="Image62" width="87" height="36" border="0"></a></td>
<td colspan="6" rowspan="3">
<img src="images/index_04.gif" width="457" height="7" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="4" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/index_05.gif" width="418" height="1" alt=""></td>
<td rowspan="5"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image60','','roll/images/trueblue_06.gif',1)"><img src="images/index_06.gif" name="Image60" width="118" height="32" border="0"></a></td>
<td colspan="3" rowspan="2">
<img src="images/index_07.gif" width="182" height="3" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="images/index_08.gif" width="201" height="4" alt=""></td>
<td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image59','','roll/images/trueblue_09.gif',0)"><img src="images/index_09.gif" name="Image59" width="187" height="30" border="0"></a></td>
<td rowspan="6">
<img src="images/index_10.gif" width="30" height="68" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td rowspan="5">
<img src="images/index_11.gif" width="24" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image61','','roll/images/trueblue_12.gif',1)"><img src="images/index_12.gif" name="Image61" width="123" height="28" border="0"></a></td>
<td rowspan="5">
<img src="images/index_13.gif" width="35" height="66" alt=""></td>
<td rowspan="5">
<img src="images/index_14.gif" width="35" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image63','','roll/images/trueblue_15.gif',1)"><img src="images/index_15.gif" name="Image63" width="126" height="28" border="0"></a></td>
<td rowspan="5">
<img src="images/index_16.gif" width="29" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image64','','roll/images/trueblue_17.gif',1)"><img src="images/index_17.gif" name="Image64" width="186" height="28" border="0"></a></td>
<td colspan="2" rowspan="5">
<img src="images/index_18.gif" width="81" height="66" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td rowspan="6">
<img src="images/index_19.gif" width="42" height="1478" alt=""></td>
<td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image58','','roll/images/trueblue_20.gif',1)"><img src="images/index_20.gif" name="Image58" width="133" height="29" border="0"></a></td>
<td rowspan="4">
<img src="images/index_21.gif" width="26" height="64" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="26" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="images/index_22.gif" width="187" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_23.gif" width="123" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_24.gif" width="126" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_25.gif" width="186" height="38" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/index_26.gif" width="118" height="37" alt=""></td>
<td rowspan="2">
<img src="images/index_27.gif" width="87" height="37" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index_28.gif" width="133" height="35" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="35" alt=""></td>
</tr>
<tr>
<td colspan="14">
<img src="images/index_29.gif" width="1184" height="1380" alt=""></td>
<td rowspan="2">
<img src="images/index_30.gif" width="36" height="1414" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1380" alt=""></td>
</tr>
<tr>
<td colspan="14">
<img src="images/index_31.gif" width="1184" height="34" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="34" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="42" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="133" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="26" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="187" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="30" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="118" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="24" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="123" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="35" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="87" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="35" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="126" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="29" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="186" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="45" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="36" height="1" alt=""></td>
<td></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

spremenil: kljuka (17.11.2009 ob 20.44.49)
 
 
 
 
17.11.2009, 22:33
Hja ne morem ti natančno razložit, ker ne vem katero sliko bi dal za ozadje.
Primer, da želiš sliko 13 dati za ozadje:

Sedaj imaš tole:
<td rowspan="5">
<img src="images/index_13.gif" width="35" height="66" alt=""></td>


Kodo za sliko izbrišeš ter dodaš značko bg:

<td rowspan="5" background="images/index_13.gif">


Mislim, da bi moralo delovati, če se nisem kje zmotil.
 
 
 
 
18.11.2009, 14:48
Hvala za pomoč, a mi vseeno ne dela...
Za ozadje bi rad dodal sliko "index_29"...
 
 
 
 
18.11.2009, 14:57
igaelj:
Hvala za pomoč, a mi vseeno ne dela...
Za ozadje bi rad dodal sliko "index_29"...




Pač iz index_13.gif spremeniš v index_29.gif.
 
 
 
 
18.11.2009, 16:41
Oprosti Erco ampak jaz se ne spoznam na php kodo.
če zamenjam to vrstico
"img src="images/index_29.gif" width="1184" height="1380""

z to mi ne deluje....

<td rowspan="5" background="images/index_29.gif">
 
 
 
 
18.11.2009, 18:37
Ba koncu daj </td>, potem se prepričaj,da je slika res index_29.gif, nato po mojem je background-image, ne zgolj background, pa tretjič, nitč ti ne zamerim, četrtič, to ni PHP, je HTML.
 
 
 
 
19.11.2009, 19:20
Kam točno naj vstavim to zgoraj navedene vrstice kode...
Lepo vas prosim, kopirajte mojo kodo in dodajte sliko index_29.gif za ozadje...
 
 
 
 
19.11.2009, 20:26
Z malo truda bi šlo saj ni tako težko.
<html>
<head>
<title>Domov</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('roll/images/trueblue_20.gif','roll/images/trueblue_06.gif','roll/images/trueblue_12.gif','roll/images/trueblue_03.gif','roll/images/trueblue_15.gif','roll/images/trueblue_17.gif')">
<!-- ImageReady Slices (trueblue.psd) -->
<table id="Table_01" width="1263" height="1801" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="16">
<img src="images/index_01.gif" width="1262" height="313" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="313" alt=""></td>
</tr>
<tr>
<td colspan="9">
<img src="images/index_02.gif" width="718" height="4" alt=""></td>
<td rowspan="6"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image62','','roll/images/trueblue_03.gif',1)"><img src="images/index_03.gif" name="Image62" width="87" height="36" border="0"></a></td>
<td colspan="6" rowspan="3">
<img src="images/index_04.gif" width="457" height="7" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="4" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/index_05.gif" width="418" height="1" alt=""></td>
<td rowspan="5"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image60','','roll/images/trueblue_06.gif',1)"><img src="images/index_06.gif" name="Image60" width="118" height="32" border="0"></a></td>
<td colspan="3" rowspan="2">
<img src="images/index_07.gif" width="182" height="3" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="images/index_08.gif" width="201" height="4" alt=""></td>
<td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image59','','roll/images/trueblue_09.gif',0)"><img src="images/index_09.gif" name="Image59" width="187" height="30" border="0"></a></td>
<td rowspan="6">
<img src="images/index_10.gif" width="30" height="68" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td rowspan="5">
<img src="images/index_11.gif" width="24" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image61','','roll/images/trueblue_12.gif',1)"><img src="images/index_12.gif" name="Image61" width="123" height="28" border="0"></a></td>
<td rowspan="5">
<img src="images/index_13.gif" width="35" height="66" alt=""></td>
<td rowspan="5">
<img src="images/index_14.gif" width="35" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image63','','roll/images/trueblue_15.gif',1)"><img src="images/index_15.gif" name="Image63" width="126" height="28" border="0"></a></td>
<td rowspan="5">
<img src="images/index_16.gif" width="29" height="66" alt=""></td>
<td rowspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image64','','roll/images/trueblue_17.gif',1)"><img src="images/index_17.gif" name="Image64" width="186" height="28" border="0"></a></td>
<td colspan="2" rowspan="5">
<img src="images/index_18.gif" width="81" height="66" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td rowspan="6">
<img src="images/index_19.gif" width="42" height="1478" alt=""></td>
<td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image58','','roll/images/trueblue_20.gif',1)"><img src="images/index_20.gif" name="Image58" width="133" height="29" border="0"></a></td>
<td rowspan="4">
<img src="images/index_21.gif" width="26" height="64" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="26" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="images/index_22.gif" width="187" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_23.gif" width="123" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_24.gif" width="126" height="38" alt=""></td>
<td rowspan="3">
<img src="images/index_25.gif" width="186" height="38" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/index_26.gif" width="118" height="37" alt=""></td>
<td rowspan="2">
<img src="images/index_27.gif" width="87" height="37" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index_28.gif" width="133" height="35" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="35" alt=""></td>
</tr>
<tr>
<td colspan="14" background="images/index_29.gif">
</td>
<td rowspan="2">
<img src="images/index_30.gif" width="36" height="1414" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1380" alt=""></td>
</tr>
<tr>
<td colspan="14">
<img src="images/index_31.gif" width="1184" height="34" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="34" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="42" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="133" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="26" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="187" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="30" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="118" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="24" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="123" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="35" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="87" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="35" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="126" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="29" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="186" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="45" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="36" height="1" alt=""></td>
<td></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>


Mislim, da bi moralo delovat, če nisem česa pozabil.
 
 
 
 
19.11.2009, 20:44
hvala jones, dela
 
 
 
 
16.7.2010, 2:05
Zdravo,

zanima me, zakaj ko grem na mojo spletno stran preko drugega računalnika (ne preko tega, ko imam strežnik) se stran tako čudno oblikuje/ razreže ?

Še razlaga primera na slikah:

Računalnik na katerem je strežnik:




Nek drug računalnik:
 
 
 
 
16.7.2010, 10:43
Kar gledam sta sliki narejeni v različnih brskalnikih (Firefox 3.6 in 4.0).

Napaka pa po vsej verjetnosti leži nekje v CSS-u. Ali je problem v kakšni nekompatibilnosti CSS-a ali pa kakšen problem s prenosom CSS datoteke.

Na žalost iz podanih informacij ni možno oddati kakšen bolj pameten odgovor.

spremenil: podtalje (16.7.2010 ob 10.44.42)
 
 
 
 
16.7.2010, 10:50
Zgleda, da res stran pravilno odpre samo v Firefox 4.0 verziji, saj sem zdaj poskusil v Explorerju in je podobno kot v Firefox-u 3.6;




Zanima me pa kaj je napaka?

Še koda:

<html>
<head>
<title>Slovenian Designers - Domov</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
</head>
<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (slovenian-designers-domov-razrezana.psd) -->
<center
<!-- ImageReady Slices (slovenian-designers-domov-razrezana.psd) -->
<table id="Table_01" width="901" height="1201" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="15">
<img src="images/index_01.gif" width="900" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="15">
<img src="images/index_02.gif" width="900" height="214" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="214" alt=""></td>
</tr>
<tr>
<td colspan="15">
<img src="images/index_03.gif" width="900" height="11" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td rowspan="9">
<img src="images/index_04.gif" width="67" height="974" alt=""></td>
<td rowspan="2">
<a href="index.php"><img src="images/index_05.gif" width="123" height="33" alt=""></a></td>
<td colspan="13">
<img src="images/index_06.gif" width="710" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img src="images/index_07.gif" width="40" height="78" alt=""></td>
<td>
<a href="novice.php"><img src="images/index_08.gif" width="123" height="32" alt=""></a></td>
<td rowspan="2">
<img src="images/index_09.gif" width="31" height="78" alt=""></td>
<td>
<a href="vodici.php"><img src="images/index_10.gif" width="123" height="32" alt=""></a></td>
<td rowspan="2">
<img src="images/index_11.gif" width="30" height="78" alt=""></td>
<td>
<a href="kontakt.php"><img src="images/index_12.gif" width="122" height="32" alt=""></a></td>
<td colspan="2" rowspan="2">
<img src="images/index_13.gif" width="33" height="78" alt=""></td>
<td colspan="2">
<a href="phpBB3/index.php"><img src="images/index_14.gif" width="123" height="32" alt=""></a></td>
<td colspan="2" rowspan="3">
<img src="images/index_15.gif" width="85" height="140" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="32" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index_16.gif" width="123" height="46" alt=""></td>
<td>
<img src="images/index_17.gif" width="123" height="46" alt=""></td>
<td>
<img src="images/index_18.gif" width="123" height="46" alt=""></td>
<td>
<img src="images/index_19.gif" width="122" height="46" alt=""></td>
<td colspan="2" rowspan="2">
<img src="images/index_20.gif" width="123" height="108" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="46" alt=""></td>
</tr>
<tr>
<td colspan="9" rowspan="3" valign="top" background="images/index_21.gif">&nbsp;</td>
<td rowspan="4">
<img src="images/index_22.gif" width="32" height="839" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="62" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="images/index_23.gif" width="33" height="777" alt=""></td>
<td colspan="2" valign="top" background="images/index_24.gif">&nbsp;</td>
<td rowspan="5">
<img src="images/index_25.gif" width="32" height="833" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="587" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="4">
<img src="images/index_26.gif" width="143" height="246" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="133" alt=""></td>
</tr>
<tr>
<td colspan="9">
<img src="images/index_27.gif" width="593" height="57" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="57" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img src="images/index_28.gif" width="129" height="56" alt=""></td>
<td colspan="9" background="images/index_29.gif">&nbsp;</td>
<td>
<img src="images/spacer.gif" width="1" height="30" alt=""></td>
</tr>
<tr>
<td colspan="9" background="images/index_30.gif">&nbsp;</td>
<td>
<img src="images/spacer.gif" width="1" height="26" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="67" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="123" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="6" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="34" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="123" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="31" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="123" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="30" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="122" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="32" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="33" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="90" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="53" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="32" height="1" alt=""></td>
<td></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</center>
</body>
</html>


Če slučajno kdo ve...
 
 
 
 
17.7.2010, 9:31
Sem rešil problem; če koga zanima

<head>
<style>
img {border: 0;}
</style>
</head>
 
 
 
 
4.12.2012, 21:16
Jaz tudi ne znam označit Bg. Imam CS6.
 
Prijava in registracija
 
 
 
Zmaga.com ponuja brezplačno in razumljivo učenje računalniških programov, vas na enkraten način spozna z različnimi svetovnimi jeziki, s podrobno obrazloženimi recepti prikaže čare kulinarike in vam prežene strahove pred domačimi opravili.
 
 
Poleg tega lahko prebirate poučne članke, ki so namenjene širjenju naše splošne razgledanosti ter preverite svoje znanje z priljubljenim in enostavnim sistemom za preverjanje znanja. Če med vsebinami, ki se dodajajo vsak dan, ne najdete želenega znanja, je za vaša vprašanja na voljo dobro obiskan forum, kjer lahko tudi aktivno sodelujete. V primeru, da bi radi svoje praktično znanje delili z ostalimi, pa to lahko storite preko preprostega vmesnika za dodajanje vsebin. Zmagajte z znanjem z Zmaga.com!
  
Zmaga.com na Facebooku | Pošljite nam e-pošto | Informacije o Zmaga.com