Header Programmierung Webseite

Mitglied: Snowboarder1994

Snowboarder1994 (Level 1) - Jetzt verbinden

27.07.2019 um 14:15 Uhr, 2073 Aufrufe, 16 Kommentare, 3 Danke

Hallo,

wollte einen Header programmieren bei www.Domainagentur.de, aber irgendwas stimmt hier mit den DIVs nicht möchte das genau mittig auf der Webseite positionieren.

Wollte das so machen wie auf dem Screen: http://domainagentur.de/test/Unbenannt.png
Wer kann mir da bitte weiterhelfen? Muss das HeaderLogo und Headerbild auch in einen DIV?


Gruß Markus
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 16:11 Uhr
Wer kann mir da bitte weiterhelfen?
Selbsthilfe ist der Weg zum Erfolg
https://wiki.selfhtml.org/wiki/CSS/Tutorials/Inhalte_zentrieren
Lesen, nachmachen, freuen das man's selbst geschafft hat.👍
Bitte warten ..
Mitglied: Snowboarder1994
27.07.2019 um 16:34 Uhr
Ja mittig hab ich das bekommen aber ich weiß nicht genau wie ich das alles positioniere, also was ich in einen DIV packen muss und wie der HauptDiv also div id="header" reinmuss. Blicke irgendwie überhaupt nicht durch.
Bitte warten ..
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 16:42 Uhr
Verschachtelte, also einen globalen Container der alles enthält, dann für den Header, Main content und Footer jeweils ein eigener DIV welche im globalen Container enthalten sind. Ist der Header ebenfalls in Sektionen unterteilt dort ebenfalls so verfahren, also die divs im Header-Container platzieren.
Such das ist schnell nachgeschlagen, wenn man keinen Durchblick hat
https://www.w3schools.com/html/html_layout.asp
Bitte warten ..
Mitglied: Snowboarder1994
27.07.2019 um 16:42 Uhr
Einen HauptContainer wo HeaderDIV MainDIV FooterDIV drin ist und


<div id complete>
<div id header
<div id logo
<div/>
<div id headerbild>
<div>
<div/>
<div/>
<div id main
<div/>
<div id footer
<div/>
<div/>
Bitte warten ..
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 16:44 Uhr
S. Beispiel und den Link im letzten Beitrag und du bist im Bilde! Fertig.
Bitte warten ..
Mitglied: Snowboarder1994
27.07.2019 um 16:44 Uhr
Ok danke muss ich die bilder also headerbild und das logo auch in ein div packen?
Bitte warten ..
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 16:49 Uhr
Müssen muss man man gar nichts, kann man, je nachdem welche Verfahren zur Platzierung du nutzt und was in den ein oder anderen Teil kommt, zur eindeutigen Trennung und zum Handeln des Flow ist es aber nützlich.
Schau dir mal das CSS Grid an, damit ist sowas fix zusammengestellt und auch responsive gestaltet.
Bitte warten ..
Mitglied: Snowboarder1994
27.07.2019, aktualisiert um 16:56 Uhr
Den Main-Text will ich ja mit Include Verfahren machen.

Also das wäre:

include header
Impressumstext z.B.
include footer

dann ist es ja besser wenn ich den div main noch im header.php öffne und im footer.php schließe oder
Bitte warten ..
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 16:59 Uhr
Erst lesen, dann nachdenken, Gedanken sortieren und dann machen
https://blog.kulturbanause.de/2013/12/css-grid-layout-module/
Btw. Als Domainagentur als die ihr euch schimpft solltet ihr das eigentlich alles selbst wissen 😁.
Bitte warten ..
Mitglied: Snowboarder1994
27.07.2019 um 17:02 Uhr
Ok mein Gedanke müsste ja richtig sein, das man in der header.php den DIV für den MAIN-Bereich noch öffnet und im Footer.php schließt weil da schließt man ja auch dann den Container.
Bitte warten ..
Mitglied: 140447
140447 (Level 1)
27.07.2019, aktualisiert um 17:40 Uhr
Heutzutage macht man sowas gleich mit Templates um Design und Business-Logic zu trennen und dadurch as ganze wartbarer zu gestalten.
https://www.sitepoint.com/the-mvc-pattern-and-php-1/
Bitte warten ..
Mitglied: NordicMike
28.07.2019, aktualisiert um 06:32 Uhr
Du willst später das Menü auch so breit haben? Dann würde ich nicht das Bild kleiner machen, sondern den gesamten Bereich.

Und wenn Du im css die Einheit px verwendest, hast Du bei Geräten mit unterschiedlicher Auflösung unterschiedliche Ergebnisse, falls es sich um diese hier handeln sollte: http://domainagentur.de/css/stylesheet.css

Bei Geräten mit niedrigerer Auflösung passt das Bild dann nicht mehr aufs Display (Handy, Tablet usw). Deswegen macht man das (auch um bei Google ein höheres Ranking zu erhalten) im responsive Design. Und damit wärst Du, wie oben erwähnt, mit einem vorgefertigten Template besser aufgehoben.
Bitte warten ..
Mitglied: Snowboarder1994
28.07.2019 um 13:14 Uhr
Problem ist aber bei einer dynamischen Webseite das sich dann alle Button z.B. im MainBereich nach untenverschieben oder im Header die Menüleiste nur noch Aufklappbar also Art DropDown ist.
Bitte warten ..
Mitglied: NordicMike
28.07.2019 um 13:31 Uhr
Was bei kleinen mobilen Bildschirmen erwünscht wäre. Man kann die Schwellen einstellen, ab welcher Auflösung verschoben, geklappt oder in ein Menü geschoben wird. Mit Bootstrap sogar ein Kinderspiel und Google bestraft es nicht mit Rankingabzügen.
Bitte warten ..
Mitglied: Snowboarder1994
28.07.2019 um 14:36 Uhr
Bootstrap hab ich mir eben angeschaut. Wäre gar nicht so schlecht. Wie sieht es hier mit Copyright aus?

Wo finde ich dieses Template zum download?

https://getbootstrap.com/docs/4.3/examples/blog/
Bitte warten ..
Mitglied: NordicMike
28.07.2019 um 17:24 Uhr
Ich kann es am iPad schlecht nachprüfen, aber hier ist ein Downloadlink, vermutlich auch mit Deinem Example:
https://getbootstrap.com/docs/4.3/examples

Bei Download Source Code

Es ist kostenlos verwendbar. Hier die Lizenzbeschreibung:
https://getbootstrap.com/docs/4.3/about/license
Bitte warten ..
Heiß diskutierte Inhalte
Netzwerkprotokolle
DHCP-Server vom ausgeschalteten PC?
pow3rlock3Vor 1 TagFrageNetzwerkprotokolle47 Kommentare

Guten Tag in die Runde, kurz zu mir: IT-Administrator und seit über 20 Jahren im PC-Bereich unterwegs. habe zu Hause jetzt ein Problem: grober ...

Server
Argumente für Serverumstellung
Stivi1989Vor 1 TagFrageServer15 Kommentare

Hallo zusammen, ich benötige einmal unterstützung eine Serverumstellung zu begründen. Problem ist wie folgt: Ein Unternehmen setzt aktuell noch einen SBS2011 ein. Da dieses ...

Microsoft
Software zur Archivierung von Rechnungen
gelöst MazenauerVor 1 TagFrageMicrosoft12 Kommentare

Guten Tag zusammen Leider habe ich keine passende Rubrik gefunden, deshalb probiere ich es hier. Als ich letzthin die ersten bezahlten Rechnungen des Jahres ...

Server-Hardware
Intel(R) 82576 Gigabit-Netzwerkarte macht nur 10MBit
fdk007Vor 1 TagFrageServer-Hardware18 Kommentare

Hallo Leute, das Problem bleibt, (s. Bild): Egal welcher Treiber…die Intel Karten machen 10 Mbit. Egal was ich einstelle. Die 3. Netzwerkarte des Cisco ...

LAN, WAN, Wireless
Fritzbox mit Switch verbinden und Vlan einrichten
Forrest57Vor 1 TagFrageLAN, WAN, Wireless35 Kommentare

Hallo zusammen. Möchte meine Geräte über VLAN trennen. Anhand der Zeichung sieht man wie das Netz aufgebaut sein soll es ist ein 24 Port ...

Windows Server
Änderung des Standard-Browsers Server 2019
EmptymanVor 1 TagFrageWindows Server3 Kommentare

Hallo liebe Gemeinde. Ich schlage mich mit einem kleinen Problem rum, dessen Lösung ich aber leider nicht auf die Schliche komme. Auf meiner Terminalserver-Umgebung, ...

Netzwerkmanagement
TIA568A oder B - Leistungsunterschiede oder egal?
gelöst alboshiroVor 21 StundenFrageNetzwerkmanagement15 Kommentare

Hallo Zusammen, ich bin aktuell im Hausbau und habe in jedem Zimmer ein RJ45 CAT7 Ethernetkabel für jeden Raum verlegt. Jetzt müsste ich die ...

Firewall
PfSense direkt an Glasfasermodem der Telekom über PPPoE
gelöst snah0815Vor 17 StundenFrageFirewall23 Kommentare

Hallo Zusammen, nachdem ich die pfSense nun eine Zeit lang in einer Kaskade mit einer Fritzbox 7590 betrieben habe, möchte ich nun gerne die ...