ugrás a tartalomhoz

760px széles oldal mindig középre

papi · 2006. Már. 13. (H), 11.46
Üdv mindenkinek a fórumon!
Hogyan tudom elérni azt, hogy a 760 pix szélességre tervezett oldalak, amik 800x600 felbontásban ugye kitöltik a képernyőt, 1024-es felbontásban (is) középre kerüljenek, és ne baloldalra? (természetesen a jobb és baloldalon ezesetben egy üres rész lesz látható)
Köszönettel egy gyakorlatlan web-kreátor.
‹ Firefox xhtml 1.0 Strict validator nyelvi beállítás ›
 ■
1

css-el

winston · 2006. Már. 13. (H), 11.53
1. tedd be az oldalad tartalmás egy div-be (legyen mondjuk contener a neve)

2. a css file-ba meg ez kerüljön:
  1. body  
  2.   {  
  3.   text-align: center;  
  4.   }  
  5.   
  6. #container  
  7.   {  
  8.   width: 760px;  
  9.   position: relative;  
  10.   margin: 10px auto 10px auto;  
  11.   }  
2

weboldal megjelenítés

papi · 2006. Már. 13. (H), 12.03
Nagyon köszönöm a gyors segítséget!
Biztosan elegetek van a kezdőkből, de én tényleg az vagyok (weboldal készítés terén). Dreamweaver-rel készítem a saját leendó oldalamat. Nagyon megköszönöm, ha még azt megírnád, hogy mi az a div ? A paraméterek világosak, de teljesen grafikus módszerrel csinálom.
3

táblázattal csinálod?

Anonymous · 2006. Már. 13. (H), 12.26
a dreamweaver-ben az oldalad táblázattal készül, vagy div-es, css-es modern(ebb) szemlélettel?
a <body> tag után mi következik, ha megnézed a forráskódot?

gex
4

rétegekkel dolgozom

papi · 2006. Már. 13. (H), 12.33
A html és a css nekem sajnos ismeretlen. Nem tudom illik-e ilyet csinálni, elküldöm a jelenlegi kódokat:
  1. <html>  
  2. <head>  
  3. <title>Untitled Document</title>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
  5. <style type="text/css">  
  6. <!--  
  7. a:link {  
  8.     color: #00CCCC;  
  9. }  
  10. a:visited {  
  11.     color: #669966;  
  12. }  
  13. a:active {  
  14.     color: #006699;  
  15. }  
  16. .style3 {font-family: Arial; font-size: 18px;}  
  17. -->  
  18. </style>  
  19. <script language="JavaScript" type="text/JavaScript">  
  20. <!--  
  21.   
  22.   
  23.   
  24. function MM_preloadImages() { //v3.0  
  25.   var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();  
  26.     var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)  
  27.     if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}  
  28. }  
  29. //-->  
  30. </script>  
  31. <script language="JavaScript" type="text/JavaScript">  
  32. <!--  
  33. function MM_reloadPage(init) {  //reloads the window if Nav4 resized  
  34.   if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {  
  35.     document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}  
  36.   else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();  
  37. }  
  38. MM_reloadPage(true);  
  39. //-->  
  40. </script>  
  41. </head>  
  42. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">  
  43. <div>  <div id="Layer1" style="position:absolute; left:122px; top:0px; width:760px; height:70px; z-index:1; background-color: #6987BC; layer-background-color: #6987BC; border: 1px none #000000;"></div>  
  44.   <div id="Layer2" style="position:absolute; left:122px; top:70px; width:760px; height:24px; z-index:2; background-color: #D8DFEE; layer-background-color: #D8DFEE; border: 1px none #000000;"></div>  
  45.   <div id="Layer3" style="position:absolute; left:122px; top:560px; width:760px; height:40px; z-index:3; background-color: #6987BC; layer-background-color: #6987BC; border: 1px none #000000;"></div>  
  46.   <div id="Layer4" style="position:absolute; left:243px; top:24px; width:261px; height:24px; z-index:4; font-weight: bold; font-size: 16px; color: #FFFFFF;">   
  47.     <p class="style3">&Uuml;dv&ouml;zl&ouml;m weboldalamon ! </p>  
  48.   </div>  
  49.   <div id="Layer6" style="position:absolute; left:485px; top:180px; width:57px; height:45px; z-index:6"><img src="gombok/vissza.jpg" width="70" height="24"></div>  
  50. </div>  
  51. </body>  
  52. </html>  
5

Amondó vagyok...

NetBandita · 2006. Már. 13. (H), 12.34
Jobban járnál egy notepaddel vagy mondjuk a jEdittel.
6

válasz Netbandita-nak

papi · 2006. Már. 13. (H), 12.38
Szerintem a megjelenítés eredeti kérdését az sem oldaná meg. Egyébként az oldalak majdnem teljesen kész vannak a dreamweaver-ben, "csak" a megjelenés volt probléma (most már).
7

html/css

winston · 2006. Már. 13. (H), 12.41
szerintem érdemes ráfordítanod egy kis időt, és energiát, hogy a css és html alapokkal megismerkedj. nem olyan bonyolult. onnantól eldobhatod a dreamweaver-t és az összes wysiwyg editort. hidd el, az ember magától sokkal szebben meg tudja írni, és sokkal több lehetőséged is van, mert nem korlátoz semmi.
8

(X)HTML és CSS

NetBandita · 2006. Már. 13. (H), 12.41
De, én úgy hiszem igen. Azért is, mert hogy ezeket tudd használni weboldal elkészítésére, elengedhetetlen, hogy ismerd legalább az (X)HTML-t. Viszont manapság magára valamit is adó weboldalszerkesztő ismeri a CSS-t is.
9

köszönet

papi · 2006. Már. 13. (H), 13.00
A CSS és a HTML rövidítések jelentésére utaló linkek ugyan nem vittek elöbbre, de köszönöm a konkrét segítséget is a div-vel kapcsolatban. Keresek egy ismerőst, aki megoldja ezt a megjelenítést winston tanácsai alapján, a programozás alapjait pedig majd igyekszem elsajátítani.
Mégegyszer köszönöm!