Automatische Anpassung an Browser und Bildschirmgrößen möglich?
0 1 0 
rfb
0
Automatische Anpassung an Browser und Bildschirmgrößen möglich?
Wie kann man die Seite an alle Browser und Bildschirmgrößen automatisch anpassen???
Würde das ohne viel scripte gehen oder sind die doch unentbehrlich?
Ich bitte die Fachkundigen Programmierer hier ihre vorschläge zu posten.
Hier mein Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Anpassung an Browser und Bildschirmgrössen</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="" content="">
<meta name="suchmaschinenworte" content="">
</head>
<body text="#000000" bgcolor="red" link="#FF8000" alink="#FF8000" vlink="#FF8000" scroll="NO" scrolling="no" scrollbarvisable="no">
<table align="center" border="3" bgcolor="#949494" height="150" width="90%" bordercolordark="#7C7C7F" bordercolorlight="#A2A2A2" >
<tr >
<td align="center" colspan="90%"><font size="+4" color="#E5E5E5"><i>Wie kann man die Seite an alle Browser und Bildschirmgrößen automatisch anpassen?</i></font></td>
</tr>
<tr height="30">
<td>
</td>
</tr>
</table>
<div>
<span style="position: absolute; left: 235; top: 130">
<iframe src="http://de.selfhtml.org/" name="fensterlein" width="724" height="451" scrolling="no"
scrollbarvisable="no" noresize="noresize">
</iframe>
</span>
</div>
<div>
<span style="position: absolute; left: 60; top: 131">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste1.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 176">
<a href="http://www.google.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste2.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 221">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste3.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 266">
<a href="http://www.google.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste4.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 311">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste5.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 356">
<a href="http://www.google.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste6.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 401">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste7.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 446">
<a href="http://www.google.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste8.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 491">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste9.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>
<span style="position: absolute; left: 60; top: 536">
<a href="http://www.google.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste9.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span>
</div>
</body>
</html>
-
Wie kann man die Seite an alle Browser und Bildschirmgrößen automatisch anpassen???
Hallo,
was man unter Anpassen verstehen kann, kann sehr verschieden sein. Meinst du damit, dass das Layout browserunabhängig und monitorunabhängig gleich bleiben soll?
In diesem Fall verwende ich eine skriptfreie reine CSS-Lösung. Schau dir meine HP und damit an, ob dir diese Lösung gefällt. Wichtig ist dabei auch die Verwendung relativer Schriftgrößen.
Wenn ja, findest du unter Windows/TechInfo das Grundgerüst.
Leider ist auch der IE7 anders als alle anderen Browser, so dass man zwei Stylesheets, IE und alle anderen, einbinden muss. Glücklicherweise benimmt sich der IE7 hinsichtlich Positionierung so wie der IE6, so dass hier keine weitere Unterscheidung erforderlich ist.Gruß Michael
-
Ja,das layout soll unabhängig von browser oder Bildschirmgröße dargestellt werden,vielleicht kann jemand einen codevorschlag der mir helfen könnte direkt posten oder mir mailen.
Leider ist mein wissen nicht gut genug um diese relativen sachen
auch richtig einzustellen.
bitte um Hilfe.Danke
MFG-
codevorschlag der mir helfen könnte
Habe ich doch gemacht für CSS. Das CSS-Grundgerüst findest du wie gesagt unter http://dr-luthardt.de/tech.htm , CSS-Frames. Eigene Anpassung musst du aber immer selbst vornehmen.
Die IE-Variante kannst du auch bekommen, wenn du willst.
Wie du die Browserweiche IE/andere in deinem HTML gestaltest, hängt von deinem Server ab. Ich nehme SSI.Gruß
Michael-
Hallo,
... Das CSS-Grundgerüst findest du wie gesagt unter http://dr-luthardt.de/tech.htm
schon mal versucht, deine Site mit Opera zu laden?
Gruß plan_B
--
*®*´¯`·.¸¸.·
-
-
-
-
Hallo,
das hier sieht schon ein wenig verwegen aus:
<span style="position: absolute; left: 60; top: 131">
<a href="http://www.yahoo.de" target="fensterlein"><p style="cursor : crosshair"><img src="Taste1.jpg" width="177" height="45" hspace="0" vspace="0" border="0"></p></a></span><br>wenn die Taste schon absolut positionert wird, wofür dann noch <p> und <br>
noch nicht mal <span> wäre nötig, sondern das <a> positionierenob der p-cursor so funktioniert oder durch den <a>-Cursor übersteuert wird?
in jedem Fall bei den CSS-Angaben die Einheiten nicht vergessenund ein
<img> muss eine alt-Attribut bekommen[code =lang=html]
<a href="http://www.yahoo.de" target="fensterlein"
style="cursor:crosshair; position:absolute; left:60px; top:131px;" >
<img src="Taste1.jpg" alt="Taste1" width="177" height="45">
</a>
[/code]Gruß plan_B
--
*®*´¯`·.¸¸.· -
Moin
nur so als Hinweis:
span als Inline-Element darf keine Blockelemente wie p enthalten.
So ist dein Quellcode alles andere als valide (fehlerfrei) und was die Browser daraus machen ist sowieso eher Glückssache.Gruß
rfb--
Man kann einen Menschen nichts lehren, man kann ihm nur helfen, es selbst zu entdecken.
(Galileo Galilei) -
Moin,
Wie kann man die Seite an alle Browser und Bildschirmgrößen automatisch anpassen???
Würde das ohne viel scripte gehen oder sind die doch unentbehrlich?
Ich bitte die Fachkundigen Programmierer hier ihre vorschläge zu posten.Ja, in dem du mit CSS arbeitest und nur da Angaben zur Breite und Höhe machst wo es notwendig ist.
Ferner empfiehlt es sich so wenig wie möglich mit Massangaben wie px zu hantieren. Besser em oder % verwenden.
Wie der Zufall so will, hab ich sogar ein Beispiel zur Hand:
http://www.jp-digital.de/shared/htmlBeispiel/index.html
http://www.jp-digital.de/shared/htmlBeispiel/style.cssDer rechte und linke Bereich haben ein feste Breite, der mittlere passt sich dem zur Verfügung stehenden Platz an.
Um die Lesbarkeit sicherzustellen, ist die Maximalbreite des Body-Elements begrenzt (funktioniert allerdings nicht im IE6).
Gruß
Stareagle