eg-259:case-studies:1
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| eg-259:case-studies:1 [2012/02/05 13:15] – [Case Study 1: CSS for Layout] 82.20.153.71 | eg-259:case-studies:1 [2012/02/05 13:29] (current) – [Case Study 1: CSS for Layout] 82.20.153.71 | ||
|---|---|---|---|
| Line 15: | Line 15: | ||
| - | ===== Case Study 1: CSS for Layout ===== | + | ===== Case Study: CSS for Layout ===== |
| * Before you start you should have installed [[eg-259: | * Before you start you should have installed [[eg-259: | ||
| Line 61: | Line 61: | ||
| <code html> | <code html> | ||
| - | <p style = " | + | < |
| - | left: 50px; top: 100px;"> | + | |
| - | </ | + | |
| - | * Example 1: [[/ | + | |
| - | + | ||
| - | ---- | + | |
| - | + | ||
| - | <code html><? | + | |
| - | < | + | |
| - | " | + | |
| <!-- absPos.html | <!-- absPos.html | ||
| - | Illustrates absolute positioning of elements | + | Illustrates absolute positioning of elements |
| - | | + | --> |
| - | < | + | <html lang=" |
| < | < | ||
| + | <meta chaset=" | ||
| < | < | ||
| - | < | + | < |
| - | + | /* A style for a paragraph of text */ | |
| - | /* A style for a paragraph of text */ | + | |
| - | + | ||
| - | | + | |
| - | /* A style for the text to be absolutely positioned */ | + | .regtext { |
| + | font-family: | ||
| + | font-size: 14pt; | ||
| + | width: 600px | ||
| + | } | ||
| + | | ||
| - | .abstext {position: absolute; top: 25px; left: 50px; | + | |
| - | | + | |
| - | | + | |
| - | | + | |
| + | font-family: | ||
| + | | ||
| + | font-style: italic; | ||
| + | | ||
| + | color: rgb(102, | ||
| + | | ||
| + | | ||
| </ | </ | ||
| </ | </ | ||
| Line 104: | Line 104: | ||
| have been grown for many centuries. They are propagated by | have been grown for many centuries. They are propagated by | ||
| grafting because they do not reproduce themselves. | grafting because they do not reproduce themselves. | ||
| - | </ | + | |
| - | | + | <p class = " |
| - | | + | APPLES ARE GOOD FOR YOU |
| - | | + | </p> |
| </ | </ | ||
| </ | </ | ||
| Line 128: | Line 128: | ||
| <code html> | <code html> | ||
| - | <?xml version = " | + | < |
| - | < | + | |
| - | " | + | |
| <!-- relPos.html | <!-- relPos.html | ||
| - | Illustrates relative positioning of elements | + | Illustrates relative positioning of elements |
| --> | --> | ||
| - | < | + | <html lang=" |
| < | < | ||
| - | < | + | <meta charset=" |
| + | < | ||
| </ | </ | ||
| <body style = " | <body style = " | ||
| <p> | <p> | ||
| Apples are <span style = | Apples are <span style = | ||
| - | | + | |
| - | | + | font-family: |
| - | | + | font-style: italic; color: red;"> |
| - | GOOD </ | + | |
| </p> | </p> | ||
| </ | </ | ||
| </ | </ | ||
| + | |||
| </ | </ | ||
eg-259/case-studies/1.1328447734.txt.gz · Last modified: 2012/02/05 13:15 by 82.20.153.71