Pixelated mobile background images
Return to site:
http://www.jenniferharper-deacon.com/
I added background images using the following css:
#pl_areauzza45k .pl-area-wrap {
background-image: url("http://www.jenniferharper-deacon.com/wp-content/uploads/2015/01/WHEAT-FIELD.jpg");
right: 0;
left: 0;
width: 100%;
height: 100%;
background-position: center center;
background-size: cover;
background-attachment: fixed;
}
However, they appear to be pixelated on my phone. Any help on how to resolve this issue would be greatly appreciated.
+3
source to share
1 answer
The reason is that the image becomes compressed.
Try the following:
#pl_areauzza45k .pl-area-wrap {
background-image: url("http://www.jenniferharper-deacon.com/wp-content/uploads/2015/01/WHEAT-FIELD.jpg");
right: 0;
left: 0;
width: 100%;
height: 100%;
background-size: 100%;
background-attachment: fixed;
}
0
source to share