Turn to page 321 of the textbook and use the Practice Creating
iFrames exercise to create a page listing the Teenage Mutant
You’ll need to modify the music types pages
created earlier in your reading of the chapter to reflect the new
focus of the pages. Use CSS formatting to change the color of
each turtle’s name in the frame to the color of the headband
each one wears. After completing the pages, validate the code
using the XHTML validator at http://validator.w3.org/.
322 HTML & XHTML Demys tified
Practice Creating iFrames
In this final section you will create a web page holding four iFrames. Each iFrame will hold one of the music pages created earlier. You will place the iframe inside of a div positioned using CSS.
1. Create a new document based on your template called 1. iframes.html. Save it in the chapter12 folder.
2. Create a new CSS document called 2. chapter12.css.
3. Link the iframes.html file to the chapter12.css file.3. 4. Inside of the CSS file create two generic classes called .left and .right.4.
5. Set the width and height of the .left class to 50% of the page. Set the float 5. property to left. Set the clear option to clear both.
6. Set the width and height of the .right class to 50%. Set the float property 6. to right.
7. Save your CSS document.
8. Switch to the iframes.html file in your editor.8.
9. Create a div tag using the .left class.
10. Inside of this div, create an iframe utilizing 80% of the div size. Set the src to country.html.
11. Create a div tag using the .right class. Inside of this div, create an iframe 11. utilizing 80% of the div size. Set the src to pop.html.
12. Create a div tag using the .left class. Inside of this div, create an iframe utilizing 80% of the div size. Set the src to rap.html.
13. Create a div tag using the .right class. Inside of this div, create an iframe utilizing 80% of the div size. Set the src to rock.html.
14. Save and view your page in a browser. It will look like this image:
15. The final code listing for the iframes appears in Code Block 12-13.
* You can also use 2CO option if you want to purchase through Credit Cards/Paypal but make sure you put the correct billing information otherwise you wont be able to receive any download link.
* Your paypal has to be pre-loaded in order to complete the purchase or otherwise please discuss it with us at firstname.lastname@example.org.
* As soon as the payment is received, download link of the solution will automatically be sent to the address used in selected payment method.
* Please check your junk mails as the download link email might go there and please be patient for the download link email. Sometimes, due to server congestion, you may receive download link with a delay.
* All the contents are compressed in one zip folder.
* In case if you get stuck at any point during the payment process, please immediately contact us at email@example.com and we will fix it with you.
* We try our best to reach back to you on immediate basis. However, please wait for atleast 8 hours for a response from our side. Afterall, we are humans.
* Comments/Feedbacks are truely welcomed and there might be some incentives for you for the next lab/quiz/assignment.
* In case of any query, please donot hesitate to contact us at firstname.lastname@example.org.
* MOST IMPORTANT Please use the tutorials as a guide and they need NOT to be used for any submission. Just take help from the material.
******************************************** Good Luck ***************************************************
Any personal information received will only be used to fill your order. We will not sell or redistribute your information to anyone.
We will try our best to resolve the issue and if still persists we can discuss for a refund in case its required.