2017-03-20 5 views
0

J'essaye de construire une page d'atterrissage simple pour mon site Web sur bigcartel. je suis en train de le faire de sorte qu'une image plein écran prend toute la page et dirige vers la page du produit après avoir été cliqué après des tonnes de recherche ce que je suis venu avecDynamique plein écran image splash page

<head> 
<a href="/products"> 
<img title="click to enter" src="http://i.imgur.com/QC0IqJ9.gif" 
style="width: 100%"; style="height: 100vh"> 

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<style> 
< 
body { 
background: src="http://i.imgur.com/QC0IqJ9.gif" ; 
background-size: 100% 100%; 
} 
--> 
<a { 
position:absolute; 
top:0; 
left:0; 
width:100%; 
height:100%; 
}> 
</style> 
    </a> 
    {{ head_content }} 
</head> 

mon problème est que je ne peux pas obtenir l'image d'étirer et ajustement en fonction de la résolution du navigateur

Répondre

0

Vous avez des balises vraiment étranges au sein de votre <style>, mais je suis en supposant ils font partie de Scrapy-Splash. Le problème est spécifiquement avec votre ligne background: src="http://i.imgur.com/QC0IqJ9.gif";. Vous configurez CSS, de sorte que vous ne définissez pas le src, vous définissez un url() en tant que tel:

body { 
 
    background: url("http://i.imgur.com/QC0IqJ9.gif"); 
 
    background-size: 100% 100%; 
 
}
<body> 
 
</body>

Hope this helps! :)