CSS - CSS Background - CSS Background Repeat




 CSS Background Repeat

Learn css - css tutorial - CSS Background Repeat - css examples - css programs

Background repeat - Definition and Usage

  • In css background-repeat is to apply if a background image will be repeated.
  • In this background-image is repeated both in vertical axis and horizontal axis or should not be repeated at all.
  • By default, the repeated images are cropped to the size of the element.
CSS background repeat
  • In CSS, Background-repeat property is used to control the repetition of an image in the background.

sample html code - css in html

Tryit<!DOCTYPE html>
<head>
  <style>
    body 
        {
            background-image: url("http://www.wikitechy.com/img/logo.png");
            background-repeat: repeat-x;
        }          
    </style>
</head>
  <body>
  Welcome to Wikitechy! 
  </body>
</html>
click below button to copy the code. By - css tutorial - team

Code Explanation - stylesheet css

background position css
  1. The background-image property specifies an image to use as the background image for the element. URL specifies the location path of the background image.
  2. By using repeat property in CSS, we can avoid appearing of image several times in the output browser.
  3. Here we have the text Welcome to Wikitechy! which has been called inside the body tag (<body> </body>).
Note: We can also display image to appear several times in X and Y axis using repeat-x and repeat-y respectively in background repeat property.

Code Output - ccs online

    image background
  1. The text “Welcome to Wikitechy!” was displayed in the browser window as shown.
  2. Here, the background image wikitechy.com was displayed in the output WITH NO REPEAT PROPERTY OF CSS.
css background url
  1. The text “Welcome to Wikitechy!” was displayed in the browser window as shown.
  2. Here, the background image wikitechy.com was displayed in the output WITH NO REPEAT PROPERTY OF CSS.
    background no repeat
  1. The text “Welcome to Wikitechy!” was displayed in the browser window as shown.
  2. Here, the background image wikitechy.com was displayed in the output WITH NO REPEAT PROPERTY OF CSS.

This page provides a detailed information on stylesheet css , css input , css menu , css for table , css in js , external css , css maker , html css style , css documentation , css page , css site , css3 websites , html css course , css stylesheets , css web design , css beginner , html to css , learn html css and javascript , css official website.


View More Quick Examples

CSS BASICS & SELECTORS CSS SELECTOR ATTRIBUTE CSS STYLE FORMS COLORS & BACKGROUND CSS MARGIN & PADDING CSS WIDTH & HEIGHT CSS LINKS CSS BLOCKS

Related Searches to CSS - Background Repeat