Lesson Thirteen: Entering Pictures to Cells
- Now you will put pictures into the table cells that you created in the last lesson. First put these images into your images folder.
- Now one by one replace the paragraph elements in your html code with the image elements shown below:
<div id="tablecontainer1"> <div id="tablerow1"> <div class="tablecell"> <img src="images/elephant1.jpg" alt="Elephant"> </div> <div class="tablecell"> <img src="images/lion1.jpg" alt="Lion"> </div> <div class="tablecell"> <img src="images/hippo1.jpg" alt="Hippopotamus"> </div> </div> <div id="tablerow2"> <div class="tablecell"> <img src="images/giraffe1.jpg" alt="Giraffe"> </div> <div class="tablecell"> <img src="images/rhinosaurus1.jpg" alt="Rhinoceros"> </div> <div class="tablecell"> <img src="images/tiger1.jpg" alt="Tiger"> </div> </div> </div>
Your page should look like this: Sample