HTML Quiz

Right Click on this page and view the source code, then save the source code window as Quiz1-YourName.html (be sure to put your name in the name of the file.) Open it up in your text editor (Dreamweaver or Brackets). Put your answers under each question.

Keep your answers short, clear, and concise. Long answers are more likely to be marked wrong.

Each question for this first section is worth 3 points each.

1. What does HTML stand for?

Replace this with your answer...

2. What is CSS used for?

3. What are the main elements of the box model concept?

4. What is the difference between inline and block?

5. How do you center a block element?

6. How do you center content inside of an element?

7. What are the 3 levels of CSS?

8. How are ID and Class the same, and how are they different? Be concise.

9. How should images be sized for the web, with HTML width and height attributes or with Photoshop’s image size dialogue box?

10. What are the 3 pixel image file formats used for web?

11. Can vector images be placed in websites?

12. Give a CSS example of a transparent color attribute.

13. What are pseudo classes, give an example?

14. What is an element in HTML?

15. What attribute is used to make a link open in a new window or tab?

16. List three qualities of a good navigation bar.

17. What is meant by semantic elements and why would you use them instead of a div?

18. Give 5 examples of HTML 5 semantic elements.

19. List three qualities of a good website design.

20. In a table, what attribute is used to join cells in a row to become one cell (this is tricky)?



This section is worth 40pts. Under the below line, create the following content: Create a div that is 900px wide and give it a background color, a border radius, and a shadow that is all aesthetically pleasing. In this box you are to create a mini layout of a page complete with a Navigation bar (the address links do not have to have any url, just a “#” for the value as a place holder), the navigation bar needs to be horizontal and with css pseudo coding as I showed you in class. The nav bar needs to be placed aesthetically in the top center of the box. This div also needs to be horizontally centered on the page.

Instead of using images for your layout you can use divs as graphic element place holders that you size and give background color to as place holders for where pictures would go. You are also to use text such as Lorem Ipsum as content. Include four links in the layout. They are to be the same links as I have in the first for of my html links page to the w3school's site. Be sure to style and place them in a tastefully and aesthetically appropriate way, just putting them in the layout will not satisfy, make them look like they belong there as part of the design.

And then do something else not described that will make a significant contribution to the layout, make it impressive, but not gaudy.

Do all your styling in this page, not in an external CCS page. Keep it all in this same document so that you only have to submit this one file for the assignment which includes all your answers and the div mockup.