Background image photo to fit browser screen
Page 1 of 1
Background image photo to fit browser screen
I am trying to put a 3000x2000 photograph as my background and I want it to fit the browser screen.Right now I simply have this as my background line: <body background="background1.jpg">
It shows only the upper left hand corner of the image in my screen because it is not resizing to fit the browser. Any suggestions as to what I can do to fix this? Thank you.
Re: Background image photo to fit browser screen
http://www.youtube.com/watch?v=6YlGJVqepLAThis video described it perfectly.
Re: Background image photo to fit browser screen
A large image means a large file size. So your page speed will be effected if you use it with resizing by the browser. So it would be better to resize it with any image editor like photoshop to fit it with your screen. But if there is a no other way but to resize your background image then you can use css3 background size property. The rule will be as follows- Code: Select all
body {
background: url('images/image_1.jpg') no-repeat scroll;
background-size: 100% 100%;
min-height: 700px;
}
You can edit your background size in px or % to fit your need.
For more info you can visit this page
http://www.w3schools.com/cssref/css3_pr_background-size.asp
Re: Background image photo to fit browser screen
Would it help if you just resized the image to fit the browser?--
Is there a certain type of HTML I should be using when trying to create an e-commerce store that sells a survival seed bank supply? I want something that will help me to target gardeners that are interested in my product.
Is there a certain type of HTML I should be using when trying to create an e-commerce store that sells a survival seed bank supply? I want something that will help me to target gardeners that are interested in my product.
Page 1 of 1