Images and CSS

By themselves, Cascading Style Sheets are not used to put on the Web-pages of the main image. Despite everything, this task is performed by the tag . Nevertheless, they are used to control the main images, and to insert and control background images.

The following markup inserts the image:

img src=”demo.gif” alt=”demo” id=”demoimg”

CSS can be used to change the size, location and image streaking. For example, instead of the height and width parameters in HTML you can do the following:

#demoimg {height: 100рх; width: l00px; }

Most likely that browsers will continue to rely on the attributes of HTML, so far you shouldn’t send them to the scrap.

In addition, avoiding the definition of basic settings of alignment in HTML, you can assign this task to CSS.

#demoing {float: left;}

You can set the fields, use the other options, but in order to achieve greater accuracy, there is a possibility of positioning of the image on the page with more specific means of CSS:

#demoimg {position: absolute; left: l00px; top: 50px; z-index: 3;}

As it can be seen from the last rule, you can even set the z-index parameter and place the images over the other objects of the page. Finally, it makes sense to apply the style effects to some images, such as borders:

#demoimg {border-style: double; border-width: 2px; border-color: orange;}

Most of these features can be implemented by the means of HTML, although in this case the performance will be less accurate; CSS stands by its functions that are associated with the background image.