Using CSS background properties, you can set the background of the whole page or of a page element: DIV, paragraph, table, form, etc.
The background-color
property is applied throughout the content area of the element and is drawn behind any background-image that is set.
<style> #idd { background-color: #a2fda3; } </style> <h4>Example background-color</h4> <div id='idd'>Web site: https://CoursesWeb.net</div>
The background color for the whole page can be defined in the body selector ( body {background-color:#e8e8fe;} ).
background-image
property s used to specify a background image for an element.<style> #idd { background-image: url('css/green_bg.jpg'); } </style> <h4>Example background-image</h4> <div id='idd'>Free CSS course</div>
background-repeat
sets if/how a background image will be repeated. By default, a background-image is repeated both vertically and horizontally.<style> #idd { background-image: url('css/green_bg.jpg'); background-repeat: no-repeat; } </style> <h4>Example background-repeat</h4> <div id='idd'>marplo.net</div>
background-attachment
defines how a background position is determined.<style> /* Fixed background image */ #idd { background-image: url('../imgs/smile_gift.png'); background-repeat: no-repeat; background-attachment: fixed; border:1px solid blue; height:200px; } </style> <h4>Example background-attachment</h4> <div id='idd'>In the world of illusions.</div>
background-position
property specifies the position of the background image given as a set of two values: horizontal and then vertical.<style> #idd { background-image: url('../imgs/smile_gift.png'); background-repeat: no-repeat; background-position: center top; border:1px solid blue; height:250px; } </style> <h4>Example background-position</h4> <div id='idd'>Anything seems important.</div>
background
property allows to add individual background properties (background-color, background-image, background-repeat, background-attachment, background-position) in the same definition, separated by space.<style> #idd { background:#f8fbfe url('../imgs/smile_gift.png') 50% no-repeat; border:1px solid blue; height:250px; } </style> <h4>Example background property with multiple values</h4> <div id='idd'>But nothing matters.<br> Have a good life.</div>
<form action="script.php" method="post"> ... </form>
#id { background-color: #bbfeda; box-shadow: 11px 11px 5px #7878da; }
var fruits = ["apple", "apricot", "banana"]; fruits.shift(); alert(fruits.length); // 2
if(extension_loaded("PDO") === true) echo "PDO is available."