Eigene Internetseite veröffentlichen

  • Achso danke;)

    Ich weiß Asttofotografie ist ein schönes Hobby aber auch wirklich sehr teuer. Ich verstehe jetzt aber nicht ganz was ich weiter oben platzieren soll. Die komplette Menüleiste oder die Menüpunkte? Ich habe die Seite auch auf Geräten geöffnet, die z.B kein so großen Bildschirm z.B mein Handy. Wie kann ich das denn machen, dass die Webseite genau so aussieht, wie auf einem großen Bildschirm, denn bei den Geräten mit einem kleinen Bildschirm wird die Menüleiste und der Text, der in der Mitte steht verschoben?:thumbup:

    Trotzdem nochmal danke für den Tip

  • Du meinst reponsives Layout .bzw

    Code
    1. @media (min-width: 700px) {
    2. #content {
    3. width: 700px;
    4. }
    5. }

    So kannst du ab bestimmtte Bildschirmgrössen auch das passende css anlegen.


    zb hier https://jsfiddle.net/4jo58t7h/17/


    Da kannst du schön dran sehen .Wenn man das Browser Fenster grösser oder kleiner machst ändert sich das Layout bzw die position

  • Hi,


    zusätzlich im HTML Code bei den meta Einstellungen folgende Zeile nicht vergessen (wird gerne mal vergessen und ist ziemlich nützlich):


    Code
    1. <meta name="viewport" content="width=device-width, initial-scale=1">
  • Muss man diesen CSS Code also mit @Media eimal oder Mehrmals in die CSS Code einfügen? Denn auf der verlinkten Seite wurde dieser Befehl mehrmals geschrieben mit verschiedenen Größen

  • ja jenachdem ab welche grösse sich das ändern soll. Die meisten machen zb ab Handy grösse zb 200 pixel ,dann ab Tablet 500 Pixel und so weiter.So ungefär musst du das auch machen.Du kannst den Befehl so oft wie du willst nehmen.Nur drauf achten das die grössen sich nicht überlappen ,sonst könnte die css durcheinander kommt .

    Für die bestimmten Bilschirmgröösen gibt es auch Vorlagen .

    Dran denken.

    Code
    1. @media screen and (max-width: 790px) {
    2. // hier kommt die kommplette css rein für die angegebene grösse
    3. }
    4. @media screen and (max-width: 890px) {
    5. // hier kommt die kommplette css rein für die angegebene grösse
    6. }
    7. // und so weiter

    Hoffe du verstehst meine erklärung

  • Das sind zb Standart Vorgaben die ich so im Netz gefunden habe.


    Natürlich schreibt jeder was anderes,und es gibt noch grössere Werte als 1600 Pixel.Aber da musst du mal selber kucken was du so machst,


  • Menemey : Schau dir mal dein Menü an. Du hast ja auch Menüunterpunkte. Nun wenn du auf ein Menüoberpunkt gehst wie z.b. Photograf dann werden die Untermenüs angezeigt. Nun wenn ich versuche diese anzuwählen schließt sich das Untermenü wieder und wie du sehen kannst ist zwischen dem Photograf und Which Camera? eine kleine Lücke. Diese musst du bei allen Menüunterpunkten beheben. Sonst kommt man ja garnicht auf die Menüunterpunkte drauf.

  • Hallo Stef,

    In die Menüpunkte muss man mit der Maus schneller rein also Versuch mal schneller mit der Maus zu den Menüpunkten zu gehen. Denn wenn man langsam in die Menüpunkte geht, funktioniert es nicht. Also schneller rein gehen:thumbup: Die kleine Lücke kann ich dann auch wegmachen:)

  • Hallo Stef,

    In die Menüpunkte muss man mit der Maus schneller rein also Versuch mal schneller mit der Maus zu den Menüpunkten zu gehen. Denn wenn man langsam in die Menüpunkte geht, funktioniert es nicht. Also schneller rein gehen:thumbup: Die kleine Lücke kann ich dann auch wegmachen:)

    Das ist ja nicht sinn der sache ,das muss auch langsam gehen .Das sollte man ändern ,weil deine besucher wissen das ja nicht

  • Hallo,

    ich habe, wie oben gezeigt, versucht, die Internetseite mit dem Code von oben für kleinere Bildschirme zu verkleinern aber es hat nicht funktioniert. Die Menüleiste und die Überschrift verschieben sich die ganze Zeit.


    Hier ist nochmal ein Bild:

    [Blockierte Grafik: https://s13.postimg.org/b5rhny1mf/Bild_Fehler.jpg]Kann mir da vielleicht jemand weiterhelfen?

  • basti1012 : den link hat Menemey in einem vorigen Kommentar doch schon vorgegeben. Da kann man den Code sehr schön erkennen.


    Menemey : Du hast meinen Kommentar #23 in den Code kopiert. Das ist erst mal die Basis dafür, das Deine Seite überhaupt responsiv reagieren kann. Wenn ich das richtig sehe reagiert der Bildschirm Deiner HP auch responsiv. Schließlich hast Du center tag vorgegeben - also macht er das auch. Aber jetzt solltest Du die Kommentare von Bast #22 beachten und den Code als Rahmen eingeben! Natürlich nach Deinem Gusto. Das musst Du dann schon selbst machen.


    Ich bin mir auch nicht klar über Deinen CSS Code. Die "Steuerung" ist bei Dir im html auch nicht als Steuerung so erkennbar (oder meinst Du damit den #Control? - dann verwende doch gleich den nav tag.


    Schau doch mal in Axels:

    https://www.html-seminar.de/css-layout-generator.htm


    Vielleicht erleichtert Dir das ein wenig das Leben.


    Just my 5 cents

  • Hallo,

    ich habe, wie oben gezeigt, versucht, die Internetseite mit dem Code von oben für kleinere Bildschirme zu verkleinern aber es hat nicht funktioniert. Die Menüleiste und die Überschrift verschieben sich die ganze Zeit.

    Also komischer weisse kann ichin der css und html nix vom @media sehen.Hast du den wieder raus genommen oder wie ? Egal ,ichversuchedir mal ein Beispiel zu machen

  • Ich danke dir wirklich sehr:thumbup::thumbup:

    Dann hatte ich wohl ein Fehler oder ich habe es einfach wieder aus dem Code rausgenommen

  • Ich habe den CSS Code jetzt in mein CSS Code, wie oben gezeigt, verändert aber komsicherweise sehe ich jetzt nur noch das Hintergrunfbild mit der Milchstraße und der Rest ist unsichtbar. Also der Text, Überschrift, Menüleiste, einfach alles außer das Hintergrund ist zusehen. Ist das normal?