Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: HTML - rozdzielczosc
Forum PHP.pl > Inne > Hydepark
tasche
29.05.2005, 21:36:52
wiem ze to jest forum o php ale potrzebuje pomocy specjalistopw takich jak wy cool.gif

zrobilem strone w rozdzielczosci 1024*768 ale gosc chce ja w 800*600

Nie zabardzo wiem jak to zrobic sad.gif

prosze o pomoc bede bardzo wdzieczny winksmiley.jpg
crash
29.05.2005, 21:46:23
Zmień sobie rozdziałkę i zobacz jak wygląda stronka, ewentualnie zmniejsz szerokość tabel itp. tak żeby nie było paska przewijania poziomego...
dr_bonzo
29.05.2005, 22:29:33
Jesli nie chcesz zmieniac rozdzielczosci -- to uzyj extensiona dla ffoxa webdeveloper, i wybierz Resize... -- lub w operze wlacz wyswietlanie wielkosci okna i odpowiednio zmodyfikuj jego wielkosc.
Cytat
zrobilem strone w rozdzielczosci 1024*768 ale gosc chce ja w 800*600
Nie zabardzo wiem jak to zrobic sad.gif


A jak zrobiles w 1024x768?
Speedy
30.05.2005, 17:25:50
Zrób wyśrodkowaną tabelkę o stałej szerokości powiedzmy 770px . Wtedy na 800x600 będzie widoczna cała strona, a na wyższych rozdzielczościach tabelka, a za nią tło .
tasche
30.05.2005, 17:29:05
ale gostkowi chodzi o strone w 800px*600px a ja zrobilem w 1024*768
nie wiem jak zrbile w 1024*768 ale nie jest dobrze

probowalem ale nie wychdzi cos z tym co crasszu pisal

dlatego dam kod strony wszelkie odstepy zostana zachowane
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/html4/loose.dtd">
  3. <html>
  4. <head>
  5. <meta name="generator" content="WebSite PRO 4.3" />
  6. <title>Szkoła Podstawowa Nr 4 w Gorzowie Wielkopolskim </title>
  7. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
  8. <script language="JavaScript" type="text/JavaScript">
  9. <!--
  10. function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  11.   if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
  12.     document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  13.   else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
  14. }
  15. MM_reloadPage(true);
  16. //-->
  17. </script>
  18. <style type="text/css">
  19. <!--
  20. body,td,th {
  21.        font-family: Verdana, Arial, Helvetica, sans-serif;
  22.        font-size: 12px;
  23. }
  24. body {
  25.        background-color: #FFCC9A;
  26. }
  27. .style1 {
  28.        font-size: 24px;
  29.        font-weight: bold;
  30. }
  31. .style3 {
  32.        color: #FFFF00;
  33.        font-weight: bold;
  34.        font-size: 18px;
  35. }
  36. -->
  37. </style></head>
  38. <body>
  39. <div id="Layer1" style="position:absolute; left:0px; top:0px; width:309px; height:169px; z-index:1">
  40.   <table border="0" cellpadding="0" cellspacing="0" width="1000">
  41.     <tr>
  42.       <td><img src="images/spacer.gif" width="2" height="1" border="0" alt=""></td>
  43.       <td><img src="images/spacer.gif" width="24" height="1" border="0" alt=""></td>
  44.       <td><img src="images/spacer.gif" width="141" height="1" border="0" alt=""></td>
  45.       <td><img src="images/spacer.gif" width="2" height="1" border="0" alt=""></td>
  46.       <td><img src="images/spacer.gif" width="22" height="1" border="0" alt=""></td>
  47.       <td><img src="images/spacer.gif" width="182" height="1" border="0" alt=""></td>
  48.       <td><img src="images/spacer.gif" width="167" height="1" border="0" alt=""></td>
  49.       <td><img src="images/spacer.gif" width="11" height="1" border="0" alt=""></td>
  50.       <td><img src="images/spacer.gif" width="167" height="1" border="0" alt=""></td>
  51.       <td><img src="images/spacer.gif" width="7" height="1" border="0" alt=""></td>
  52.       <td><img src="images/spacer.gif" width="167" height="1" border="0" alt=""></td>
  53.       <td><img src="images/spacer.gif" width="108" height="1" border="0" alt=""></td>
  54.       <td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  55.     </tr>
  56.     <tr>
  57.      <td colspan="12"><img name="n001_r1_c1" src="images/001_r1_c1.jpg" width="1000" height="5" border="0" alt=""></td>
  58.       <td><img src="images/spacer.gif" width="1" height="5" border="0" alt=""></td>
  59.     </tr>
  60.     <tr>
  61.       <td rowspan="4" colspan="2"><img name="n001_r2_c1" src="images/001_r2_c1.jpg" width="26" height="523" border="0" alt=""></td>
  62.       <td colspan="3"><img name="n001_r2_c3" src="images/001_r2_c3.jpg" width="165" height="17" border="0" alt=""></a></td>
  63.       <td rowspan="2" colspan="7"><img name="n001_r2_c6" src="images/001_r2_c6.jpg" width="809" height="125" border="0" alt=""></td>
  64.       <td><img src="images/spacer.gif" width="1" height="17" border="0" alt=""></td>
  65.     </tr>
  66.     <tr>
  67.       <td rowspan="3" colspan="3"><img name="n001_r3_c3" src="images/001_r3_c3.jpg" width="165" height="506" border="0" alt=""></td>
  68.       <td><img src="images/spacer.gif" width="1" height="108" border="0" alt=""></td>
  69.     </tr>
  70.     <tr>
  71.       <td rowspan="15"><img name="n001_r4_c6" src="images/001_r4_c6.jpg" width="182" height="870" border="0" alt=""></td>
  72.       <td><a href="#"><img name="n001_r4_c7" src="images/link01.jpg" width="167" height="27" border="0" alt=""></a></td>
  73.       <td rowspan="15"><img name="n001_r4_c8" src="images/001_r4_c8.jpg" width="11" height="870" border="0" alt=""></td>
  74.       <td><a href="#"><img name="n001_r4_c9" src="images/link02.jpg" width="167" height="27" border="0" alt=""></a></td>
  75.       <td rowspan="15"><img name="n001_r4_c10" src="images/001_r4_c10.jpg" width="7" height="870" border="0" alt=""></td>
  76.       <td><a href="#"><img name="n001_r4_c11" src="images/link03.jpg" width="167" height="27" border="0" alt=""></a></td>
  77.       <td rowspan="15"><img name="n001_r4_c12" src="images/001_r4_c12.jpg" width="108" height="870" border="0" alt=""></td>
  78.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  79.     </tr>
  80.     <tr>
  81.       <td rowspan="14"><img name="n001_r5_c7" src="images/001_r5_c7.jpg" width="167" height="843" border="0" alt=""></td>
  82.       <td rowspan="14"><img name="n001_r5_c9" src="images/001_r5_c9.jpg" width="167" height="843" border="0" alt=""></td>
  83.       <td rowspan="14"><img name="n001_r5_c11" src="images/001_r5_c11.jpg" width="167" height="843" border="0" alt=""></td>
  84.       <td><img src="images/spacer.gif" width="1" height="371" border="0" alt=""></td>
  85.     </tr>
  86.     <tr>
  87.       <td rowspan="8"><img name="n001_r6_c1" src="images/001_r6_c1.jpg" width="2" height="145" border="0" alt=""></td>
  88.       <td colspan="3"><a href="#"><img name="n001_r6_c2" src="images/link04.jpg" width="167" height="27" border="0" alt=""></a></td>
  89.       <td rowspan="13"><img name="n001_r6_c5" src="images/001_r6_c5.jpg" width="22" height="472" border="0" alt=""></td>
  90.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  91.     </tr>
  92.     <tr>
  93.       <td colspan="3"><a href="#"><img name="n001_r7_c2" src="images/link05.jpg" width="167" height="27" border="0" alt=""></a></td>
  94.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  95.     </tr>
  96.     <tr>
  97.       <td colspan="3"><img name="n001_r8_c2" src="images/001_r8_c2.jpg" width="167" height="6" border="0" alt=""></td>
  98.       <td><img src="images/spacer.gif" width="1" height="6" border="0" alt=""></td>
  99.     </tr>
  100.     <tr>
  101.       <td colspan="3"><a href="#"><img name="n001_r9_c2" src="images/link06.jpg" width="167" height="27" border="0" alt=""></a></td>
  102.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  103.     </tr>
  104.     <tr>
  105.       <td colspan="3"><a href="#"><img name="n001_r10_c2" src="images/link07.jpg" width="167" height="27" border="0" alt=""></a></td>
  106.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  107.     </tr>
  108.     <tr>
  109.       <td colspan="3"><img name="n001_r11_c2" src="images/001_r11_c2.jpg" width="167" height="1" border="0" alt=""></td>
  110.       <td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  111.     </tr>
  112.     <tr>
  113.       <td colspan="3"><a href="#"><img name="n001_r12_c2" src="images/link08.jpg" width="167" height="27" border="0" alt=""></a></td>
  114.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  115.     </tr>
  116.     <tr>
  117.       <td colspan="3"><img name="n001_r13_c2" src="images/001_r13_c2.jpg" width="167" height="3" border="0" alt=""></td>
  118.       <td><img src="images/spacer.gif" width="1" height="3" border="0" alt=""></td>
  119.     </tr>
  120.     <tr>
  121.       <td colspan="3"><a href="#"><img name="n001_r14_c1" src="images/link09.jpg" width="167" height="27" border="0" alt=""></a></td>
  122.       <td rowspan="5"><img name="n001_r14_c4" src="images/001_r14_c4.jpg" width="2" height="327" border="0" alt=""></td>
  123.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  124.     </tr>
  125.     <tr>
  126.       <td colspan="3"><img name="n001_r15_c1" src="images/001_r15_c1.jpg" width="167" height="4" border="0" alt=""></td>
  127.       <td><img src="images/spacer.gif" width="1" height="4" border="0" alt=""></td>
  128.     </tr>
  129.     <tr>
  130.       <td colspan="3"><a href="#"><img name="n001_r16_c1" src="images/link10.jpg" width="167" height="27" border="0" alt=""></a></td>
  131.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  132.     </tr>
  133.     <tr>
  134.       <td colspan="3"><a href="#"><img name="n001_r17_c1" src="images/link11.jpg" width="167" height="27" border="0" alt=""></a></td>
  135.       <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  136.     </tr>
  137.     <tr>
  138.       <td colspan="3"><img name="n001_r18_c1" src="images/001_r18_c1.jpg" width="167" height="242" border="0" alt=""></td>
  139.       <td><img src="images/spacer.gif" width="1" height="242" border="0" alt=""></td>
  140.     </tr>
  141.   </table>
  142. </div>
  143. <div id="Layer2" style="position:absolute; left:521px; top:4px; width:474px; height:120px; z-index:2">
  144.   <div align="center" class="style1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="sienkiewicz.jpg" width="80" height="100" /></div>
  145. </div>
  146. <div id="Layer3" style="position:absolute; left:395px; top:96px; width:120px; height:22px; z-index:3">LINK  </div>
  147. <div id="Layer4" style="position:absolute; left:377px; top:71px; width:138px; height:20px; z-index:4">LINK </div>
  148. <div id="Layer5" style="position:absolute; left:358px; top:45px; width:159px; height:20px; z-index:5">LINK </div>
  149. <div id="Layer6" style="position:absolute; left:352px; top:23px; width:166px; height:17px; z-index:6">LINK </div>
  150. <div id="Layer7" style="position:absolute; left:1px; top:772px; width:164px; height:215px; z-index:7">
  151. <div align="center"> </div>
  152. </div>
  153. <div id="Layer8" style="position:absolute; left:333px; top:172px; width:490px; height:71px; z-index:8; font-weight: bold;"> 
  154.   <div align="justify"><h1>Szkoła Podstawowa Nr 4 <br />w Gorzowie Wielkopolskim </h1></div>
  155. </div>
  156. <div id="Layer9" style="position:absolute; left:233px; top:261px; width:589px; height:84px; z-index:9"> 
  157.   <div align="justify"><font face="Monotype Corsiva"><h4>Witamy Na stronie szkoły podstawowej nr 4</h4></font></div>
  158. </div>
  159. <div id="Layer10" style="position:absolute; left:177px; top:352px; width:637px; height:614px; z-index:10">
  160.    </p>
  161.   <p>&nbsp;  </p>
  162. </div>
  163.  
  164.   <div align="center"></div>
  165. </div>
  166.  
  167. <div id="Layer11" style="position:absolute; left:828px; top:180px; width:153px; height:315px; z-index:11">
  168.   <div align="justify">
  169.     <p><strong>News  </strong><br>
  170.     TRESC NEWSA<p><a href="#">czytaj więcej... </a><br>
  171.       </p>
  172.   </div>
  173. </div>
  174. <div id="Layer12" style="position:absolute; left:828px; top:528px; width:153px; height:310px; z-index:12">
  175.   <p><strong>News </strong><br>
  176.   Treść newsa<p><a href="#">czytaj więcej... </a></p>
  177. </div>
  178. <div id="Layer13" style="position:absolute; left:8px; top:32px; width:258px; height:181px; z-index:13">
  179.   <div align="center" class="style3"><!-- logio jakies--></div>
  180. </div>
  181. <div id="Layer14" style="position:absolute; left:176px; top:979px; width:636px; height:22px; z-index:14">
  182.  
  183. </div>
  184. </body>
  185. </html>
[HTML] pobierz, plaintext
dr_bonzo
30.05.2005, 17:40:43
Wiesz w ogole o co chodzi?
Jesli strona jest "zrobiona w 1024x768" to nie bedzie widoczna cala w 800x600.
Musisz ja zmiejszyc -- patrz tabela glowna -- ma szerokosc 1000px co jest > 800 -- czyli sie nie zmiesci w 800x600. Jak to zrobisz -- to juz twoj problem/decyzja -- zmiana layoutu/zmiejszenie go , itd.
Dravo
30.05.2005, 20:05:52
Jak widzimy kontakt z klientem do podstawa. Te kilka dni co dłużej spędzisz nad stroną, poważnie nadszarpnie zyski z samej strony.

Sprawa sprowadza się do zmiany klilku liczb i zmiany wielkości obrazków. Pozatym to radzę robić layouty na każdą możliwość. Przecież niewiadomo jakiej rozdzielczości używa użytkownik. Ważne jest, aby wszędzie wyglądała strona dobrze, choć niekoniecznie tak samo. (Co rozszerza się na różnicę w przeglądarkach).
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.