How to Write CSS Style for Images
Using Cascading Style Sheets (CSS) to handle images on your web page gives you additional formatting options and lets you remove hard-coded URLs from your HTML file. You can use CSS, a styling language, combined with HTML, to improve the appearance of your web page. You can use the CSS "background-image" property along with a few other image properties to set up a CSS image.
Instructions
-
-
1
Open your CSS file with a text editor, such as Windows Notepad.
-
2
Add a new CSS image by adding the code "#myimage { background-image:URL('image.gif'); background-repeat:no-repeat; background-position: right top; background-attachment: fixed; }." The "background-image" property sets the URL of the image. The "background-repeat" determines if the image should repeat horizontally (repeat-x), vertically (repeat-y), both (repeat) or not repeat at all (no-repeat). The "background-position" property sets the starting position of the image. The "background-attachment" property determines if the image should scroll with the rest of the page or not.
-
-
3
Save and close the CSS file.
-
4
Open your HTML file in a text editor, such as Windows Notepad.
-
5
Add a division (div) with the identification you used in the CSS file, by adding the code "<div id="myimage"></div>." The image will appear on your Web page where you add this code.
-
6
Save the HTML file. Load it and the CSS file on your server to see the CSS image.
-
1