This article is short but inculding very useful information. A few years ago, we web programmers are used to make these operations via javascript. However, this wasn’t good method because, computers were not powerful enough. Nowadays, computers are too powerfull and we don’t need to use javascript anymore! Just one thing is required for us: CSS(Cascading Style Sheet).
Look at the top-right of this page. Did you see it? Let’s see how it is done…
Structure 1.0:
1
2
3
4
5
6
7
8
9
10
| < !doctype html>
<head>
<style type="text/css">
#[DIV_ID]{
position:fixed;
top:[margin-top];
right:[margin-right];
left:[margin-left];
bottom:[margin-bottom];
}</style></head><body><div id="[DIV_ID]"></div></body> |
Example 1.0: Assume that we have a div named Click to Read Complete Article »
In this article, we are going to answer those questions:
- How to set position of background image in css?
- How to position background image using css?
- Can i set position of background image with css?
- Can css position background-image of a div?
Actually, there is a short method to do this. Look at structure 1.0:
Structure 1.0:
1
2
3
4
| #[DIVID] {
background-image:url([image url]);
background-position:[Horizontal position] [Vertical position]
} |
Example 1.0: Assume, we have a div named “ourdiv” and an image named “ourimage.jpg”.
1
2
3
4
5
6
| #ourdiv {
width: 86px;
height: 30px;
background-image: url(ourimage.jpg);
background-position: right top;
} |
Original view of ourimage.jpg:
It’s size: 259×202px
Click to Read Complete Article »
Recently Typed