У меня есть три изображения, два для смартфона, одно для orientation: portrait и другое для orientation: landscape, и еще одно для рабочего стола.
Я пытаюсь присоединить свои отзывчивые изображения к элементу заголовка Element с этим кодом;
<header>
<picture>
<source media='(max-width: 29.9375em) and (orientation: portrait)' srcset='/Bilder/night_smartphone.JPG'>
<source media='(max-width: 47.9375em) and (orientation: landscape)' srcset='/Bilder/night_tablet.JPG'>
<source media='(min-width: 80em)' srcset='/Bilder/night.JPG'>
<img src='/Bilder/night_smartphone.JPG' alt='night'>
</picture>
</header>
Но я приду этот скриншот,
Как показать, я приду картинка из night_smartphone.JPG, но посередине от экрана к другому изображению ... Код из моего @media Query Portrait для смартфона,
@media only screen and (min-width: 20em)
and (max-width: 29.9375em)
and (orientation : portrait) {
Элемент моей головы,
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Das letzte von Windows 10</title>
</head>
Но когда даютЗаголовок Элемент, этот код,
<header style="background-image: url('Bilder/night_smartphone.JPG'); background-repeat: no-repeat"; ></header>
Я пришел этот скриншот,
Как показать, моя проблема этоэто не Большой из моего изображения ....
У меня есть два файла, один для моих тегов Css, windows.css и еще для моего Media Query, планшета.css , чтобы связать это с
<style>
<?php
include 'CSS/windows.css';
include 'CSS/tablet.css';
?>
</style>
Слишком, когда измените его на
<link rel="stylesheet" type="text/css" href="CSS/tablet.css">
<link rel="stylesheet" type="text/css" href="CSS/windows.css">
на моей голове Элемент, это не изменится....
Я должен построить свой footer Элемент, с подобным кодом, и не приходят эти проблемы .. Я строю мой веб-сайт без WordPress, я строю его, я сам ...
Может пожалуйста Кто-нибудь помочья и говорю, потому что мои отзывчивые изображения не работают.