HTML – images, links and lists

After an intro to HTML and its common elements and a short exercise of writing a page with a limerick in it, we moved onto a very tasty exercise of building a page with images and links to recipes of our favourite desserts.

We used tags like ‘img src’ which links to an image saved in a folder ‘img’ with an alternative (alt) text displaying in the case of the image failing to upload.

Another way of using images is to use them as links, where the user is redirected ideally to a new tab (so they don’t move away from our website) after clicking on them.

The example below shows uploaded images which have been adjusted to have the same size.

unnamed

We have also learned how to use lists on our pages, the ordered <ol> and the unordered <ul> ones. Moreover, we created nesting which basically means placing lists inside other lists,

lists

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s