search

orzubalsky / creative-computing-2018

0 stars 1 forks source link

Image as a background #82

Open niharikasundarigari opened 6 years ago

niharikasundarigari commented 6 years ago

What code do I use to limit the number of times an image repeats in the background?

niharikasundarigari commented 6 years ago

body { margin: 0; padding: 0; min-width: 100vw; min-height: 100vh; background: url(images/pattern.png) top left repeat, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAEBJREFUGBljsDt1/j8IMxAATATk8Us/uGH3H4SRVVFmIrJJcHbFebv/IAwXwMGgzOpPM+P+gzCy4ZSZiGwSjA0AMx4Wd4lKJLMAAAAASUVORK5CYII=) top left repeat ; background-attachment: fixed; background-position: top left; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; font: 12px Arial, Tahoma, Georgia, "Times New Roman", Times, serif; color: #000; margin-right: 30px ;

orzubalsky commented 6 years ago

Hi @niharikasundarigari!

You can either repeat the image multiple times either horizontally or vertically, or not at all. These are the possible values:

/* One-value syntax */
background-repeat: repeat-x;
background-repeat: repeat-y;
background-repeat: repeat;
background-repeat: space;
background-repeat: round;
background-repeat: no-repeat;

/* Two-value syntax: horizontal | vertical */
background-repeat: repeat space;
background-repeat: repeat repeat;
background-repeat: round space;
background-repeat: no-repeat round;