Due to reasons that are necessary but difficult to explain here I am setting both an absolutely positioned image as well as a background image on a div.
I want to make sure that once the browser has grabbed these images (they're very large) it doesn't re-grab them.
Let's pretend the image bg.jpg in the following code is 500KB. Does the following code cause the browser to download the image in its entirety twice for a total of 1000KB?
<style>
header {
background: url(img/bg.jpg) center center fixed transparent;
}
</style>
<header>
<img src="img/bg.jpg" width="500" height="500">
</header>
EDIT: Thank you all for your excellent answers. I just wanted to double check and make sure I wasn't causing the user to re-download these very large images.