Bild austauschen
Author: Klaus G.
Visited 996,
Followers 1,
Shared 0
Hallo Leute,
sicherlich hat diese Frage irgend jemand mal in der Vergangenheit schon gestellt
Ist es möglich mit einer Codeanweisung ein Bild in einer bestimmten Auflösung auszutauschen bzw. ein anderes Pixelmaß anzugeben ????
Das jetzige Bild ist Linksbündig mit max-width: 181px
Ab der Auflösung von 360 soll es dann max-width: 300px haben.
Ist dass ohne das ich vorher jedesmal die CSS bearbeiten muss möglich ???
Gruß
MCMACMASTER
Posted on the
(It > De) ... es gibt verschiedene Möglichkeiten und es hängt von der Art Ihres Ansatzes und Ihrem eigenen Wissen ab ...
... Wenn Sie sich auf Images beziehen, die Teil des WebSiteX5-Projekts sind, hängt es von Typ und Speicherort der Images ab.
... im allgemeinen ed die unmittelbarste Methode erfolgt je nach Fall über den CSS-Code "Media Query" ... (*) ...
... oder prüfen Sie mit dem JS-Skript EXTRA, ... oder über EXTRA-Bilder im Object-HTML-Code mit HTML-Tag <picture> ...
(*) - Wenn Sie interessiert sind, müssen Sie den LINK Ihrer Seite hier posten und angeben, welches Bild Sie ändern möchten, oder eine bestimmte Auflösung ersetzen ...
.
ciao
.
Author
Hallo KolAim,
hier ist der Link der Seite, es betrifft das Profilbild. Die Seite ist online und hier habe ich es in der CSS geändert.
Am liebsten wäre es mir mit der "Media Query"
Danke im vorraus
Gruß
MCMACMASTER
... versuche diesen Code in /HEAD:
<style>
@media (max-width: 1080px) {
.image-0 { width:300 !important;max-width: 300px !important;}}
@media (max-width: 799px) and (min-width: 640px) {
.image-0 { width:260 !important;max-width: 260px !important;}}
@media (max-width: 639px) and (min-width: 480px) {
.image-0 { width:220 !important;max-width: 220px !important;}}
</style>
.
ciao
.
Author
ECHT COOOOOL
habe es noch etwas angepasst und jetzt passt es
<style>
@media (max-width: 799px) and (min-width: 640px) {
.image-0 { width:220 !important;max-width: 187px !important;}}
@media (max-width: 639px) and (min-width: 480px) {
.image-0 { width:220 !important;max-width: 220px !important;}}
@media (max-width: 479px) and (min-width: 360px) {
.image-0 { width:300 !important;max-width: 300px !important;}}
@media (max-width: 359px) and (min-width: 320px) {
.image-0 { width:300 !important;max-width: 300px !important;}}
</style>
Danke DIR
MCMACMASTER