Imperial Valley College Faculty Websites

You are here:Instructors»Robert Gallegos»CIS 212»Chapter 11 and 12 Review
Monday, 17 October 2011 18:40

Chapter 11 and 12 Review

Written by Robert Gallegos
Rate this item
(0 votes)

CIS 212          Fall 2011                                                          Date handed out: 10/17/2011

Chapter Review:
11 Advanced Web Construction: divs and spans
12 Arranging Elements: layout and positioning

         Chapter 11 Review

  1. <div> elements are used to group related elements together into logical sections.

  2. Creating logical selections can help you identify the main content areas, header, and footer of your page.

  3. You can use <div> elements to group elements together that need a common style.

  4. Use nested <div> elements to add further structure to your files for clarity or styling.

  5. Once you have grouped together sections of content with <div> elements, you can style the <div>s just like you would any other block element.

  6. The width property sets the width of the content area of an element.

  7. The total width of an element is the width of the content area, plus the width of any padding, border, and margins you add.

  8. Once you set the width of an element, it no longer expands to fit the entire width of the browser window.

  9. Text-align is a property for block elements that centers all inline content in the block element. It is inherited by any nested block elements.

  10. You can use descendant selectors to select elements nested within other elements.

  11. You can use shortcuts for related properties.

  12. Padding, margin, border, background, and font properties can all be specified with shortcuts.

  13. The <span> inline element is similar to the <div> element: it is used to group together related inline elements and text.

  14. The <a> element is an example of an element with different states. The main <a> element states are unvisited, visited, and hover.

  15. You can style each of these states separately with pseudo-classes.

    Chapter 12

  16. Browsers place elements in a page using flow.

  17. Block elements flow from the top down, with a linebreak between elements. By default, each block element takes up the entire width of the browser window.

  18. Inline elements flow inside a block element from the top left to the bottom right.

  19. The top and bottom adjacent margins of two block elements in the normal page flow collapse to the size of the larger margin, or to the size of one margin if they are the same size.

  20. Floated elements are taken out of the normal flow and placed to the left or right.

  21. Floated elements sit on top of block elements and don’t affect their flow.

  22. The clear property is used to specify that no floated elements can be on the left or right (or both) of a block element.

  23. A floated element must have a specific width set to a value other than auto.

  24. A liquid layout is one in which the content of the page expands to fit the page when you expand the browser window.

  25. A frozen layout is one in which the width of the content is fixed and it doesn’t expand or shrink with the browser window.

  26. A jello layout is one in which the content width is fixed, but the margins expand and shrink with the browser window.

  27. There are four values the position property can be set to: static, absolute, fixed, and relative.

  28. Static positioning is the default, and places an element in the normal flow of the page.

  29. Absolute positioning lets you place elements anywhere in the page.

  30. If an absolutely positioned element is nested within another positioned element, then its position is relative to the containing element that is positioning.

  31. Absolutely positioned elements can be layered on top of one another using the z-index property. A larger z-index value indicates it is higher in the stack (closer to you in the screen).

  32. Fixed position elements are always positioned relative to the browser window and do not move when the page is scrolled.

  33. Relatively positioned elements are first flowed into the page as normal, and then offset by the specified amount, leaving empty the space where they would normally sit.

  34. When using relative positioning, left, right, top, and bottom refer to the amount of offset from the element’s position in the normal flow.

  35. Float provides a flexible solution for multi-column layouts and allows elements to clear floated elements from their sides, something that can’t be done with absolute positioning.

 

Last modified on Monday, 17 October 2011 18:44