Css Browserunterstützung

    Hey
    Da ich meine kleine, erste Webseite nun langsam fertig habe, teste ich sie in verschiedenen Browsern. (Chrome Edge und Exlorer)Leider merkte ich schnell das die Bilder nur in Chrome geladen werden.
    Die Bilder habe ich einfach in html eingefügt:

    HTML
    <a href="galarie.htm" class="pic1"></a>



    und dann in CSS zugewiesen.

    CSS
    .pic1 {	width: 150px;    	content:url("ressources/bilder/bla.jpg");}



    Meine frage:Unterstützen die Browser von Microsoft etwa kein CSS oder was habe ich falsch gemacht.Leider ist mir das erst jetzt aufgefallen, weil ich die Website immer in Chrome getestet habe.
    Was ich noch sagen sollte...Das Layout welches ich auch mit CSS gemacht habe stimmt jedoch in Edge und im Internet Explorer wieder.


    Hoffe jemand weis Bescheid...



    Grüsse Simi576

    Was wird denn genau angezeigt?


    Normalerweise wird auf jeden Fall ein Bild mit dem img-Tag eingebunden und nicht, wie du es gemacht hast, mit dem a-Tag, der für Links gedacht ist. Wahrscheinlich hast du das in der Datei aber richtig, oder?

    Hallo,


    die Konstruktion, ein Bild über das content-Attribut einzubinden, ist unzulässig. Das Chrome das Bild trotzdem anzeigt ist einfach nur Glück, da die Programmierer von Chrome mit solchen Fehlern gerechnet haben. Die Browser müssen solche fehlerhaften Quellcode aber nicht anzeigen.


    Hintergrundbilder werden korrekt mittels "background-image" eingebunden.


    Gruss


    MrMurphy

    Ach, habe das CSS content-Attribut komplett übersehen. :D


    Ähm, also:


    Hintergrundbilder: per CSS (background-image)


    Bilder für den Content: per HTML (img-Tag)



    Wenn das Bild einen Link bekommen soll, kannst du das Bild (also den img-Tag) mit einem a-Tag (Link) umschließen.

    Also wenn ich es mit background-image in Css verlinke kommt gar nicht. Wahrscheinlich da ich schon an body mit background-image den Hintergrund machte.
    Das Bilder für den Content in html rein kommen verstehe ich zwar jedoch will ich nicht jede einzelne Seite umschreiben müssen wenn ich ein Bild ändere.
    Gibt es da eine Alternative?
    Hab zwar was gefunden doch das hat auch nicht geklappt:


    HTML
    <img class="pic1">



    CSS
    background: url(...);

    Moment mal. Ich hab das Gefühl, dass wir aneinander vorbei reden.


    Kannst du nochmal beschreiben, was du genau haben möchtest? Besonders bzgl. des Hintergrundbildes. Da verstehe ich nicht ganz, was du möchtest.



    Bzgl. der Content-Bilder:


    Wenn du zwischenzeitlich mal Bilder ändern möchtest, ohne die ganzen HTML-Dateien anfassen zu müssen, brauchst du PHP.


    Damit könntest du dann in einer extra Datei Variablen mit dem Speicherort der Bilder erstellen und diese dann innerhalb des src-Attributs ausgeben.


    Funktionen, die du dafür benötigst sind eigentlich nur "echo" und "include".

    Hallo simi576,


    deine Problembeschreibung ist leider so ungenau, das zumindest ich deine Probleme nicht genau verstehe.


    Wenn du Bilder ohne Änderung des Quelltextes ändern willst ist das einfachste sie unter dem Namen des bereits vernüpften Bildes in dessen Verzeichnis abzuspeichern.


    Gruss


    MrMurphy

    Also ich habe eigentlich vier Bilder die ich auf allen seiten anzeigen lassen möchte.
    Da ich sie einfach ändern können möchte, habe ich vie Css und html:


    CSS
    .pic1 {	width: 150px;    background-image: url("ressources/bilder/Hof.jpg")    }
.pic2 {	width: 150px;    content:url("ressources/bilder/Hof.jpg");}
.pic3 {	width: 150px;    content:url("ressources/bilder/Hof_Oben.jpg");}
.pic4 {	width: 150px;    content:url("ressources/bilder/Hof.jpg");}







    HTML
    <div id="pics"> 
 <a href="galarie.htm" class="pic1"></a>
 <a href="galarie.htm" class="pic2"></a>
 <a href="galarie.htm" class="pic3"></a>
 <a href="galarie.htm" class="pic4"></a>
 </div>



    einprogrammiert das ich nur im Css file ändern muss.
    Da ich eventuell später noch den Code erweitern will das es dies automatisch macht wollte ich nicht einfach machen das ich das Bild mit einem anderen manuell ersetze.


    Hoffe Ihr versteht meine Problemlage.



    Habe noch wegen php gesucht jedoch kenne ich mich in php gar nicht aus und weis auch nicht wie ich das einbinden soll. Ich fand jedoch das:


    PHP
    <img src= "<?php echo $image ?>"



    Ich denke mal das dies in die html kommt jedoch versteh ich nicht wie ich ein php Script einbinde und wie ich das verlinke.


    Das einzige was ich diesbezüglich fand war php include:

    PHP
    <?php include ("header.php"); ?>




    Grüsse Simi576

    Hallo


    Zitat

    Hoffe Ihr versteht meine Problemlage.


    Ich verstehe deine Probleme nur ansatzweise. Insgesamt habe ich das Gefühl, dass du dir selbst Steine in den Weg legst, weil du unbedingt komplizierte Lösungen suchst. Das hat mit HTML und CSS aber nichts zu tun.


    Außerdem zeigst du nur aus dem Zusammenhang gerissene Quellcodeschnipsel, mit denen niemand wirklich deine Probleme lösen kann. Ein Link zu der betroffenen Seite wäre sinnvoller.


    PHP ist eine von HTML und CSS unabhängige Programmiersprache.


    Um die verwenden zu können musst du PHP-Seiten erstellen, erkennbar an der Endung .php.


    Außerdem lassen sich PHP-Seiten im Gegensatz zu HTML-Seiten nicht direkt im Browser aufrufen. Dazu wird ein Server benötigt, der das PHP in HTML übersetzt und an den Browser sendet. Daher auch die Bezeichnung von PHP als serverseitige Programmiersprache.


    Da du offensichtlich noch nicht mal die Grundsätze von HTML und CSS verstanden hast wird dir PHP nicht weiterhelfen. Um mit PHP in HTML und CSS eingreifen zu können solltest du HTML und CSS schon gut beherrschen.


    Gruss


    MrMurphy

    Deine HTML und CSS Kenntnisse scheinen noch zu gering zu sein. Versuche doch bitte erstmal die Grundlagen vernünftig zu verstehen.


    So, nochmal zu den Bildern:


    Du bindest normale Bilder über CSS ein. Das ist falsch!
    Mit CSS (background-image) macht es nur Sinn, wenn du z.B. deinem Header ein Hintergrundbild hinzufügen willst.


    In deinem Fall solltest du folgendes verwenden:


    HTML
    <img src="bild.jpg">


    Wenn du das Ganze dann noch verlinken willst, muss es so aussehen:



    HTML
    <a href="verlinkte_seite.html">
<img src="bild.jpg">
</a>

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden