Enter your search terms Submit search form
	Web www.anniemation.com

Contents

 

1. Introduction & Tools

2. How external style sheets and html work together and what each does

3. Linking the html and the external style sheet

4. A bit about writing css in an external style sheet

5. Putting the css into the html code

6. Page body & page backgrounds

7. Text

8. Text links

9. Image links

10. Borders

11. Containers (DIVs)

12. Simple Containers (DIVs)

13. A DIV inside a DIV

14. Container as rows or columns

15. Two columns

16. Three columns

17. More Tools for css

18. Validating and checking the code

19. Creating a site

20. Working with backgrounds: single DIV background page

21. Working with backgrounds:
multiple DIV backgrounds

Bookmark this page

Setting up css properties - image links

Images that are not backgrounds are added to the html in the usual way: <img src="../../graphics/cat-cartoon-fp.jpg" width="300" height="225">

(image without link)

(linked image)

Suppose you want to link the image to a page. To get rid of the border, you could put "border=0" into the html
<img src="../../graphics/cat-cartoon-fp.jpg" width="300" height="225" border="0">

However, all of the design attibutes - including border sizes - are taken out of the html and put in the external style sheet. So we write a simple css property:

Now add that css into the html like this:

<p><a href="../../cats/cats1.html"><img src="../../graphics/cat-cartoon-fp.jpg" width="300" height="225" alt="image example with link" class="image"></a>

(put the class tag in with the image - not the link)

(linked image, using the "no border attribute" in external style sheet)

Even one "border" attribute in the html page will cause it to not pass the wc3.org validation.

Go to next page