Inserting a picture
Of course a web page does not simple consist of text but can contain
all sort of content: pictures, graphics, audio files or videos.
In this exercise you will add a picture of you to your website.
The picture should ideally have a width of 150 pixels. The height
can be proportional. If you already know how to resize a picture
make sure your picture has this width. If you do not know how to
edit a picture don't worry and just use the picture as it is. For
the sake of this exercise it is sufficient if you add any picture
of you saved in the jpg-format.
For inserting a picture into your web page you will use the image
source-tag <img src="filename.jpg">
The image tag
has no end tag.
Instead of 'filename' you need to type the filename of your picture,
- Save your picture to your folder 'My Resume'.
- Open your index.html file in the text editor.
- Copy & paste the image source tag from above into
your source code between the body tag and the font tag.
- Overwrite 'filename' with the filename of your picture.
- Save the file and then view it again in your web browser.
- Your web page should now look similar to this example.
- Can you see your picture on the web page? If yes, you can move
on to step 6.