Responsive Bilder nicht arbeite beim header Tag

[liebewinter]

Viele Danke für deine antwort !,

Für Dinge, die über CSS eingestellt werden, sind Media-Queries bereits als Teil von CSS vorhanden

@media screen and (min-width: 768px) {
   header {
      background-image: url('Bilder/night.JPG');
   }

das habe schon auf css datei …

@media (min-width:  48em) and (max-width: 64em) and (orientation: landscape) {
    body {
     
       display: grid;
       display: -ms-grid; 
       background-color: #eaf6e5;
       grid-row-gap: 5px;
       grid-template:  
        "header header header" auto
        "nav nav nav" auto
        "main main gap1" 1em
        "main main werb" 11em 
        "main main gap2" 3em
        "main main info" 1fr
        "footer footer footer" auto / 8% 64% 28%;

       
       -ms-grid-columns: 8% 64% 28%;
       -ms-grid-row:  120px 80px 103px 200px 110px 90px; 
       -ms-grid-gap: 5px;
    
          
    }
    body > header {
         grid-area: header;
         background-image: url("Bilder/view.JPG");
         background-repeat: no-repeat;
         padding: 60px;
    }

aber ich möchte haben verschiesen Große Bilder für jeden Geräte ,desktop , tablet , smartphone .

Beispiel habe eine gemacht für creativecommons Logo…

<footer id="copry" >
	<p>My Website: Computer and More  © 2018. All Rights Reserved.</p>
<a id="img1" href="https://creativecommons.org/licenses/by-nc/4.0/">
<picture>
  <source media='(max-width: 20em)' srcset='/Bilder/copry-kleine.png'>
  <source media='(max-width: 47.9375em) and (orientation: landscape)' srcset='/Bilder/copry-kleine.png'>
  <source media='(min-width: 80em)' srcset='/Bilder/copry.png'>
  <img alt="Creative Commons License" src="/Bilder/copry-kleine.png" style="width:auto;"></a>
</picture>
<p>This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
	Content of this site cannot be republished either online or offline without our permissions. </p>

</footer>

und alles funzioniert gut...