Hackerboard Wiki HaboBlog
Hackerboard bei Facebook Hackerboard bei Google+ Hackerboard bei Twitter

[HaBo]

 
(Web-) Design und webbasierte Sprachen Tipps & Tricks, Designabgleich, HTML & Javascript, Flash, ASP, PHP, Perl/CGI...

Homepage an Bildschirm anpassen

Diskussion: Homepage an Bildschirm anpassen im Forum (Web-) Design und webbasierte Sprachen, in der Kategorie Web, Network & Multimedia Palace; Anzeige Hallo, ich habe absolut kein Plan, wie ich am besten meine Homepage an die Bildschirmgröße des Betrachters anpassen kann!! ...

Antwort
Alt 01.05.06, 16:05   #1 (permalink)
gesperrt
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard Homepage an Bildschirm anpassen

Anzeige

Hallo,
ich habe absolut kein Plan, wie ich am besten meine Homepage an die Bildschirmgröße des Betrachters anpassen kann!! Wie mache ich das am besten? Bin echt am verzweifeln.

Arbeite mit CSS,HTML (PHP ist bei dem Vorhaben eher nicht so wichtig).

Als Beispiel das Board hier, ob ich es mit 800x600 oder 1024x768 anschaue, es ist "gleich" oder irre ich mich selber??

Achso, ich habe schon versucht mit % zu arbeiten, jedoch kommt da bei mir völliger Humbuck raus, wäre schön, es würde mir jemand erklären, was ich genau in Prozent angeben muss und was in Pixel (feste Zahl).


Danke

Hirnbreaker ist offline   Mit Zitat antworten
Alt 01.05.06, 16:37   #2 (permalink)
 
Registriert seit: 11.07.05
RemoteC Leistung: Facit NTK
RemoteC eine Nachricht über ICQ schicken
Likes: 0
Standard

Wie ist die HP überhaupt aufgebaut? Mit Frames? Wenn sie mit Frames ist: Du kannst für einen Frame die restliche Bildschirmbreite festlegen. Du hast also links die Navigation, die 150 px breit sein soll, dann schreibst du beim Frameset 150,* - Stern steht für den 2. Frame der einfach den Rest ausfüllt.

In % kannst du Tabellen angeben. Du kannst also sagen: Die ein Spalte soll 50% des Bildschirms ausmachen, und die beiden anderen je 25%. Einfach beim defienieren der Tabelle statt px % hinschreiben.
RemoteC ist offline   Mit Zitat antworten
   
HaBOT
 
- Anzeige -

Werbung ist gerade online    
Alt 01.05.06, 17:26   #3 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

Ja ist mir Frames!

Hab noch nie mit Frameset gearbeitet, nur mit iframes!!

Wie mache ich das denn eigentlich mit dem Banner (also der Breite). Angenommen ich habe ne HP, die von Oben aufgebaut wie folgt aussieht:

Banner
Menü
Inhalt (Iframe)

Ganz simple (ohne großen grafischen Aufwand) Beispiel: www.dp-clan.de.be

So und diese HP möchte ich anpassen. Wie würdest du das am besten tun??

PS: Die Hp ist von mir und komplett mit festen Zahlen geschrieben. Ohne irgendwelche Prozentangaben.
Hirnbreaker ist offline   Mit Zitat antworten
Alt 01.05.06, 18:37   #4 (permalink)
 
Registriert seit: 29.01.06
xsheep Leistung: Facit NTK
Likes: 0
Standard

Ich würde nicht zu Frames raten, denn Frames sind veraltet und es existert meistens eine bessere Alternative. Ich persönlich finde, das Frames eine Seite entstellen und sie amateurhaft wirken lassen, aber wie gesagt, das ist nur meine persönliche Meinung

cya xsheep
xsheep ist offline   Mit Zitat antworten
Alt 01.05.06, 19:08   #5 (permalink)
 
Registriert seit: 11.07.05
RemoteC Leistung: Facit NTK
RemoteC eine Nachricht über ICQ schicken
Likes: 0
Standard

Zitat:
Original von Hirnbreaker
Ganz simple (ohne großen grafischen Aufwand) Beispiel: www.dp-clan.de.be
Der Link funzt nicht!

Zum Frameset: Es kommt drauf an wie die Frames definiert sind. Wenn man natürlich überall Scrollbars hat und eindeutig sieht, wo die Frames sind, dann sieht das scheiße aus. Aber es ist halt eine praktische Art um zB eine Naviation einzubinden.
Meine HP (www.remotec.at.tt) ist auch mit Frames aufgebaut und sieht, find ich, nicht so schlecht aus, nächstes Update kommt, wenn mein PC wieder funzt PHP unterstüzt der Server auf dem die Seite liegt nicht und daher fällt php-include schonmal weg. Aber jetzt B2T, die Diskussion mit Frames gabs schon oft genug

Für dich würde der HTML-Code in etwas so aussehen
Code:
<frameset rows="60,50,*,1">
<frame src="banner.htm" name="Banner">
<frame src="nav.htm" name="Navigation">
<frame src="willkommen.htm" name="Hauptframe">
<frame src="unten.htm" name="Abschluss">
</frameset>
In dem Fall wäre der Banner (ganz oben) 60px hoch, die Navigationsleiste 50px hoch, dann kommt der Hauptframe dessen Höhe sich automatisch anpasst und das 1 steht für einen Abschlussframe, der 1px hoch ist. Dieser Abschlussframe ist nicht unbeding notwendig, ich mache das, weil ich finde, dass es etwas besser aussieht.
Du kannst natürlich auch hier mit % arbeiten, dann würde es <frameset rows="xx%,yy%,zz%,xy%"> Allerdings hat das in deinem Fall nicht viel Sinn, weil die Höhe des Banners ja immer gleich ist.

Vergessen solltest du auch nicht folgendes reinzuschreiben:
Code:
<noframes>
    <body>
      <p><a href="nav.htm">Navigation</a> <a href="willkommen.htm">Startseite</a></p>
    </body>
  </noframes>
mfg

RemoteC
RemoteC ist offline   Mit Zitat antworten
Alt 01.05.06, 19:14   #6 (permalink)
Senior Member
 
Registriert seit: 18.09.05
[starfoxx] Leistung: Facit NTK
Likes: 0
Standard

Zitat:
Original von xsheep
Ich würde nicht zu Frames raten, denn Frames sind veraltet und es existert meistens eine bessere Alternative. Ich persönlich finde, das Frames eine Seite entstellen und sie amateurhaft wirken lassen, aber wie gesagt, das ist nur meine persönliche Meinung

cya xsheep

Dem stimme ich zu.

Am besten du machst div gerüste.
Aber fang besser garnie mit Tabellen an

topic, es kommt sehr drauf an wie die Seite aufgbaut ist. Div layer kannst du relative breiten geben, zB 50% und die dann an die Child elemente vererben.

Ich für meinen Teil baue webseiten mit absoluten Breiten so dass sie för 1024x768px und mehr gut aussehen, denn diese Auflösung macht 87% meiner Besucher aus. (viele drüber, und soweite ich mich erinnere waren nur 3% mit ner tieferen Auflösung unterwegs).
[starfoxx] ist offline   Mit Zitat antworten
Alt 01.05.06, 20:12   #7 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

@Remotec
Danke, der link ist moemntan irgendwie down, da komplette funpic.de nen fehler hat!

Ja ich persönlich nutze auch ungern frames, jedoch den einen immer (iframe) um meinen inhalt anzuzeigen.

Ich nutze aber Tabellen! Ich kann mir auch net vorstellen ohne zu arbeiten!? Das wäre ja reines geschreibe in css!?

Wie würde sowas denn aussehen? Also nur mit <div class="blub">blub</div> oder wie!??
Hirnbreaker ist offline   Mit Zitat antworten
Alt 01.05.06, 21:02   #8 (permalink)
 
Registriert seit: 17.01.06
Oi!Alex Leistung: 8086
Likes: 7
Standard

index.html
Zitat:
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css"/>
<head>
<div id="header">
<b>inhaltblablabla</b>
</div>
</html>
style.css
Zitat:
#header
{
background-color:#000000;
overflow:hidden;
position:absolute;
width:700px;
height:75px;
z-index:1;
left:150px;
top:15px;
}
so z.B. mache ich das immer wobei ich halt immer mit php arbeit eund immer bloss in den div's include...
Oi!Alex ist offline   Mit Zitat antworten
Alt 01.05.06, 21:23   #9 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

Ja, so ähnlich habe ich das bisher auch gemacht! (nur mit tables)

Aber wenn du dein Beispiel mit der Auflösung 800x600 öffnest und dannach mit 1024x786 bleibt die Größe gelich, d.h. unter 800x600 musst du mehr scrollen!

Ich will das ja anpassen!
Hirnbreaker ist offline   Mit Zitat antworten
Alt 02.05.06, 17:15   #10 (permalink)
 
Registriert seit: 02.05.06
LordZed Leistung: Facit NTK
Likes: 0
Standard

Bei Boards wie diesem funktioniert das anpassen an den Bildschirm recht simpel.
Die ienzigen Grafiken, die angepasst werden müssen sind die horizontalen (ich hoffe ich liege richtig! Verwechsel horizontal und vertikal manchmal. Naja die, die so liegen halt: ---- *fg*). In diesem Board ist es zum Beispiel so, dass die horizontalen Grafiken (zum Beispiel der rote Farbverlauf den du hier überall wiederfindest) eine winzig kleine Grafik ist, bei der man einfach nicht sieht, wenn man sie mehrfach nebeneinander setzt. Desweiteren ist die Tabellenbreite 100% und die Grafik wird als Hintergrundbild in den Titel gesetzt und in der horizontalen einfach wiederholt.
Bei der Grafik im Titel ist es so, dass sie wahrscheinlich auch als Hintergrundbild oder einfaches Bild nur eben rechtsbündig ausgerichtet ist.
Vielleicht siehst du, was ich meine, wenn du dein Browserfenster mal nicht maximierst und dann die breite ein bißchen hin und her schiebst. Ab einer bestimmten größe hört er auch auf die breite anzupassen.

Das alles ist dann mit CSS realisiert. Schau einfach mal genauer bei den ganzen "background-[...]" Attributen nach.

Hoffe ich habe dir vielleicht ein bißchen weiter geholfen.

Ach ja! Bin neu hier! Hallo erstmal!
LordZed ist offline   Mit Zitat antworten
Alt 02.05.06, 17:29   #11 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

Hi!

Ja du hast es mir schonmal ein wenig näher gebracht! ^^

Doch kannst du mir nochmal helfen? Wie würdest du das Problem bei dieser Homepage lösen? www.dapartiou.de.be oder www.dp-clan.de.be

Sind beide von mir, und da wirst du evtl gleich sehen, was ich meine!!

Wäre echt cool, du oder jemand anders würden wir sagen, was ich da anders machen muss, damit sich die HP anpasst!?


Riesen Dank....
Hirnbreaker ist offline   Mit Zitat antworten
Alt 02.05.06, 17:39   #12 (permalink)
 
Registriert seit: 02.05.06
LordZed Leistung: Facit NTK
Likes: 0
Standard

Also wenn ich das richtig sehe hast du in der CSS-Datei die Breite der Container-Tabelle main1 auf einen festen Wert gesetzt. Schonmal geguckt, ob da das Problem liegt?
Informier dich vielleicht auch mal genauer über die CSS-Eigenschaft "position: absolute/relative". Da fand ich bei mir oft die Ursache des Problems.

Oder meinst du hier das Problem, dass der Content nicht zentriert ist?
LordZed ist offline   Mit Zitat antworten
Alt 02.05.06, 17:57   #13 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

Hi,
hmm also ich hab einfach eine Tabelle um die ganze HP gemacht:

<table width="100%" height="100%">
<tr>
<td align="center">

HOMEPAGE....

</td>
</tr>
</tabel>


Jetzt wird die HP immer der Bildschirmgröße angepasst (jedoch nur wo sie sitzt (mittig)) an der Größe verändert sie sich net, da ich da ja auch feste Zahlen (verbessert mich, wenn das anders heißt) genommen habe! Wird denn z.B. das hackerboard auch so angepasst oder verändert die sich auch mit der gesammtgröße? Kann das net erkennen! ^^

Und nochwas, wie würde ich denn machen, wenn ich die HP net immer mittig haben möchte, sondern so wie dapartiou.de.be (untenlinks)? Also jetzt habe ich das ja per <td align="center> gelöst! Geht das auch irgendwie anders?

Danke!
Hirnbreaker ist offline   Mit Zitat antworten
Alt 02.05.06, 18:09   #14 (permalink)
 
Registriert seit: 02.05.06
LordZed Leistung: Facit NTK
Likes: 0
Standard

Also im Burning Board allgemein ist es glaube ich mit der automatischen Anpassung so, dass es eine Container-Tabelle gibt, die aus einem Feld besteht. Die breite wird (glaube ich) mit den CSS-Eigenschaften
Code:
position: absolute;
width: 100%;
so eingestellt, dass sie relativ zum Fenster ist. Wenn die Eigenschaft position auf relative steht wird das Element relativ zu seinem Übergeordneten Element ausgerichtet. Ich habe selber oft genug Probleme mit der Sache und krieg es immer durch rumprobiererei irgendwie hin. Wie genau weiß ich aber nicht mehr! ^^
Google einfach mal danach! Findest bestimmt ein Tut, was sich mit automatischer Breitenanpassung eines Table-Designs befasst.

Ich hoffe ich verstehe deine 2. Frage richtig und du willst die Website nicht zentriert, sondern in einer Ecke des Fensters ausrichten. Mach einfach ne Tabelle mit einer Zelle. Bei dieser kannst du dann die Eigenschaften valign und align nutzen um es auszurichten.
LordZed ist offline   Mit Zitat antworten
Alt 02.05.06, 18:30   #15 (permalink)
gesperrt
Themenstarter
 
Registriert seit: 07.03.05
Hirnbreaker Leistung: Facit NTK
Likes: 0
Standard

Hi, ja das hatte ich gemeint! Danke!

Ist diese ganze Anpassung denn eigentlich mit

<div id="bla">blub</div>

möglich?

Also komplett ohne Table?

Ansonten hab ich aber alles verstanden! Ich danke euch, ihr seid die Besten!

Gruß hirnbreaker
Hirnbreaker ist offline   Mit Zitat antworten
Antwort
   
- Anzeige -

Werbung ist gerade online    

[HaBo] » Web, Network & Multimedia Palace » (Web-) Design und webbasierte Sprachen » Homepage an Bildschirm anpassen
Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks sind aus
Pingbacks sind aus
Refbacks sind aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
mediawiki tabellen per css anpassen RedEagle Code Kitchen 3 19.02.09 22:11
iframe Größe anpassen TheTeddy (Web-) Design und webbasierte Sprachen 3 15.08.07 15:54
Userprofil anpassen weau Linux/UNIX 3 11.03.07 21:49
html-background anpassen Corex Code Kitchen 3 29.01.07 15:40
Kontextmenü von Firefox anpassen IsNull Code Kitchen 2 31.10.06 12:50


1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61