Can any one tell me how can I achieve gradient effect by using CSS, is there any way. This can be achieved through the image but they are heavy to load, CSS will be a good approach.
Excuse me, I am replying the answer my self. quite strange for me too.
well by the way I tried to explore it and some of good designers, recomend me that I should try to use images in much better way then we mostly do, make a gradient image, like if it is (width x height) 400x200 in size.
Then you should crop it into thin image according to the gradient effect like if it is up to bottom or vice versa then crop it vertically ( and the size can be 10x200 or 5x200 or even 1x200.
for left to right or vice versa gradient you crop it like. 400x10 or 400x5 or even 1x200.
Now what I mean by this is that this croped thin image of your whole gradient should be place where you need it and the make its duplication till it becomes equal to the size of its original image you made. With this only croped image will be loaded on user browser rather then the whole, and it will be just duplicated and will reduce the page loading time.