background-repeat

The background-repeat property allows to specify how the background image is repeated.

The possible values are.

PropertiesDescription
no-repeatonly one instance of image will be rendered.
repeatthe image is rendered in both horizontally and vertically.
repeat-xthe image is repeated only horizontally.
repeat-ythe image is repeated only vertically.


snippet
<html>
<head>
<style>
p {border: 1px solid #000000;width:300px; height:250px; background-image: url(bg.jpg)}
</style>
</head>
<body>
<form>
<p style="background-repeat: repeat-x">
Commodi numquam adipisci sit consequatur vitae saepe beatae, vero sit dignissimos
harum accusamus fuga iusto facilis expedita omnis beatae, dolorum perferendis harum
blanditiis nemo cumque dignissimos recusandae a aliquid, laboriosam</p>
<p style="background-repeat: repeat-y">
Commodi numquam adipisci sit consequatur vitae saepe beatae, vero sit dignissimos
harum accusamus fuga iusto facilis expedita omnis beatae, dolorum perferendis harum
blanditiis nemo cumque dignissimos recusandae a aliquid, laboriosam</p>
<p style="background-repeat: repeat">
Commodi numquam adipisci sit consequatur vitae saepe beatae, vero sit dignissimos
harum accusamus fuga iusto facilis expedita omnis beatae, dolorum perferendis harum
blanditiis nemo cumque dignissimos recusandae a aliquid, laboriosam</p>
</form>
</body>
</html>
Related Tutorial
2. Padding
3. Margin
4. Border
5. Cursors