Background Image auto scaling using CSS

Hi guys today I am going to explain about a CSS property known as¬†background-size. This helps in image auto scaling based on screen view. Usual case we use textures to fill background using repeat property. Some time we use single image as background. We can’t use very large time which will take more bandwidth and so we use optimized images. This should auto scale and fit background. To achieve this we can use background-size property of CSS. For an Example

 

/**
 * CodeZone.in
 * Author: Dineshkumar
 * Contact : hi@codezone.in
 */
 body {
    background-image:    url(images/background.jpg);
    background-size:     cover;                      /* <------ */
    background-repeat:   no-repeat;
    background-position: center center;              /* optional, center the image */
}

In above example we can give cover as value of background-size property or contain. To demonstrate how this two input value make effect in display let us consider below image as screen in which grey area are out of your visible screen.

rcjke

contain:

If we use this property then image will be fit inside visual area and which may have some blank space which can be filled with background-color property as show in below image.

matcl

Cover:

This makes sure that background is covered everything based on that image will be scaled. So it is like auto scale to cover your entire background. To make you understand please see below image.

p96p5

Hope you understand the concept behind this property.

Happy Coding….

Delete A Repository in BitBucket

Hi as a professional developer we always keen to organize source code through git hub or bitbucket. After creating repository sometime we are in situation to delete such repositories. In bit bucket you can able to do that through following steps:

  1. Log into your Bitbucket account.
  2. Navigate to the repository you want to delete.
  3. Click the repository’s ¬†settings icon.
  4. Choose Delete Repository from the left-hand navigation.
    The system displays the deletion dialog.
  5. (Optional) Enter a URL in the Redirect to field.
    Future users who try to access your repository are sent to this new URL.
  6. Press Delete repository.

Happy Coding…

Snowden Warns agains using Google Allo

Edward Snowden, an American Computer professional & Former CIA employee has warned people against using Google’s new chat app ‘Allo’. The mobile application, that had been launched recently, is termed to be ‘dangerous’ as per the whistle-blower’s information. He tweeted saying that the app records all the messages sent by users, thereby making it available to police upon request.

7 Reasons why Allo is better than WhatsApp

allo-logo

Google has finally rolled out its messaging app Allo. With brilliant features like

Google Assistant

In-message searches

Automatic responses

Picture recognition

Selective end to end encryption

Text Formatting & mode advanced features.

Experts says Allo can beat WhatsApp. Allo drew criticism its for lack or privacy but google has defended it saying the users can opt for ‘incognito’ mode.