Premessa

Sto copiando pedissequamente dalla fonte, ma arriverò sollecitamente a fare mio ogni esempio gentilmente e fortunatamente proposto. L'aver messo online tutti i seguenti esempi innanzitutto corrisponde all'insicurezza d un neofita, non intende venir meno ad alcun diritto di terzi, dell'Autore o dell'Editore, e al contrario corrisponde all'esigenza di "vedere subito" e di "capire meglio" di chi si muove senza una base di preparazione. Nell'intento ogni esempio dovrebbe essere studiato e "fatto proprio" ma questo non si improvvisa. Nota del 23 maggio 2006 09:05

Esempi e note

  1. ca01/figura1.1.html pagina normale, senz css
  2. ca02/2.2.html prima linea evidenziata
  3. ca02/2.3.html prima lettera grande
  4. ca02/2.4.html carattere e fondo, basi per
  1. ca03/3.1.html pagina con bordo, div e p annidato
  2. ca03/3.10.html testo con immagine allineata in alto
  3. ca03/3.11.html testo con immagine in un blocco a sinistra
  4. ca03/3.12.htnl testo che avvolge e include immagine allineata a sinistra
  5. ca03/3.13.htnl testo su sfondo rappresentato da immagine che si ripete
  6. ca03/3.14.htnl testo su sfondo rappresentato da immagine che NON si ripete
  7. ca03/3.15.htnl testo su sfondo rappresentato da immagine che NON si ripete, posizionata a destra
  8. ca03/3.16.htnl testo in boxmodel, con bordo spesso
  9. ca03/3.18.htnl testo in box
  10. ca03/3.19.htnl testo in due box soprapposti e diversi, carattere bianco
  11. ca03/3.2.htnl  assunto a modello per questa pagina, e aggiustato; "Copiare e imparare"
  12. ca03/3.2a.htnl due pagine sovrapposte per costituire un modello per questa sezione; creata il 4 marzo 2010
  13. ca03/3.20.htnl testo in due box soprapposti e con bordi diversi
  14. ca03/3.21.htnl variazione sul precedente
  15. ca03/3.22.htnl testo con bordo e immagine di testa che trasborda
  16. ca03/3.24.htnl variazione sul precedente
  17. ca03/3.25.htnl variazione sul precedente, con scroll
  18. ca03/3.26.htnl variazione sul precedente, con scroll autodeterminante
  19. ca03/3.27.htnl testo in due box soprapposti e p con strong e em
  20. ca03/3.28.htnl testo in due box soprapposti e p con strong e em e tabella alla base
  21. ca03/3.29.htnl testo con paragrafi (p), uno con posizione relativa
  22. ca03/3.3.htnl  testo con titolo
  23. ca03/3.30.htnl testo con paragrafi (p), DUE con posizione relativa
  24. ca03/3.31.htnl testo con giochi di posizioni assolute e relatve
  25. ca03/3.32.htnl testo in due box, senza p
  26. ca03/3.33.htnl come sopra con regole per evidenziare i blocchi
  27. ca03/3.34.htnl come sopra, ma forse esempio incompleto (manca box 2?)
  28. ca03/3.35.htnl variante sul precedente
  29. ca03/3.36.htnl da considerare se migliorabile
  30. ca03/3.37.htnl variante migliorata sul precedente con id float a sinistra
  31. ca03/3.38.htnl paragrafi bordati di cui uno float a destra
  32. ca03/3.39.htnl idem con clear a destra
  33. ca03/3.4.htnl  corpo titoli
  34. ca03/3.40.htnl div class="float", ovvero quattro corpo accostati in orrizontale
  35. ca03/3.41.htnl contenitore con div id="float"
  36. ca03/3.42.htnl paragrafi con immagine flutuante a sinistra
  37. ca03/3.43.htnl contenitore da 500 px con div id="float"
  38. ca03/3.44.htnl idem ?
  39. ca03/3.45.htnl due corpi sovrapposti, con immagine incorporata
  40. ca03/3.46.htnl due corpi affiancati, il terzo sotto, fondi diversi
  41. ca03/3.47.htnl due box accostati
  42. ca03/3.48.htnl due box accostati, con bordo e paragrafi
  43. ca03/3.49.htnl idem con margini
  44. ca03/3.50.htnl due colonne con ul, ol, dl
  45. ca03/3.51.htnl idem, senza bordo
  46. ca03/3.52.htnl class="nascosto"
  47. ca03/3.53.htnl tabella di prova
  48. ca03/3.54.htnl idem con diverso sfondo
  49. ca03/3.55.htnl idem senza righe
  50. ca03/3.56.htnl idem con righe su sfondi alterni; applicazione in tinahasit
  51. ca03/3.6.htnl  corpo con paragrafi, uno con immagine
  52. ca03/3.7.htnl idem con immagine sul primo paragrafo e al 100%
  53. ca03/3.8.htnl parafrafi con immagine sul primo, bordada e a sinistra
  54. ca03/3.9.htnl immagine non regolata in corpo di paragrafo
  1. ca04/4.1.html div id="centrato" su sfondo con immagine
  2. ca04/4.10.html div id diversi: intestazione, corpo con colonna 1 e 2, piè di pagina
  3. ca04/4.11.html idem su diversi sfondi tramite immagine
  4. ca04/4.12.html idem ?
  5. ca04/4.13.html idem
  6. ca04/4.14.html idem
  7. ca04/4.15.html idem
  8. ca04/4.16.html idem
  9. ca04/4.17.html idem con colonna stretta a destra
  10. ca04/4.18.html idem con colonna stretta a sinistra
  11. ca04/4.19.html idem
  12. ca04/4.2.html
  13. ca04/4.20.html
  14. ca04/4.21.html
  15. ca04/4.22.html
  16. ca04/4.23.html
  17. ca04/4.24.html
  18. ca04/4.25.html
  19. ca04/4.26.html
  20. ca04/4.27.html
  21. ca04/4.28.html
  22. ca04/4.29.html
  23. ca04/4.3.html
  24. ca04/4.30.html
  25. ca04/4.31.html
  26. ca04/4.32.html
  27. ca04/4.33.html
  28. ca04/4.34.html
  29. ca04/4.35.html
  30. ca04/4.36.html
  31. ca04/4.37.html
  32. ca04/4.38.html
  33. ca04/4.39.html
  34. ca04/4.4.html
  35. ca04/4.40.html
  36. ca04/4.41.html
  37. ca04/4.42.html
  38. ca04/4.43.html
  39. ca04/4.44.html
  40. ca04/4.45.html
  41. ca04/4.5.html
  42. ca04/4.6.html
  43. ca04/4.7.html
  44. ca04/4.8.html
  45. ca04/4.8aistom.html
  46. ca04/4.9.html
  1. ca05/5.1.html
  2. ca05/5.10.html
  3. ca05/5.11.html
  4. ca05/5.12.html
  5. ca05/5.13.html
  6. ca05/5.14.html
  7. ca05/5.15.html
  8. ca05/5.16.html
  9. ca05/5.17.html
  10. ca05/5.18.html
  11. ca05/5.19.html
  12. ca05/5.2.html
  13. ca05/5.20.html
  14. ca05/5.21.html
  15. ca05/5.22.html indice con sottovoci
  16. ca05/5.22a.html indice con sottovoci studiato
  17. ca05/5.23.html
  18. ca05/5.3.html
  19. ca05/5.4.html
  20. ca05/5.5.html
  21. ca05/5.6.html
  22. ca05/5.7.html
  23. ca05/5.8.html
  24. ca05/5.9.html
  1. ca06/6.11.html
  2. ca06/6.12.html
  3. ca06/6.13.html acronimo e abbreviazione
  4. ca06/6.14.html
  5. ca06/6.15.html
  6. ca06/6.16.html simbolo sito esterno e e-mail
  7. ca06/6.17.html
  8. ca06/6.18.html
  9. ca06/6.22.html
  10. ca06/6.23.html
  11. ca06/6.24.html
  12. ca06/6.25.html
  13. ca06/6.27.html
  14. ca06/6.28.html
  15. ca06/6.30.html
  16. ca06/6.31.html
  17. ca06/6.32.html
  18. ca06/6.33.html
  19. ca06/6.35.html
  20. ca06/6.6.html
  21. ca06/6.7.html
  22. ca06/6.8.html
  23. ca06/6.9.html
  1. ca07/7.01.html
  2. ca07/7.02.html
  3. ca07/7.03.html
  4. ca07/7.04.html
  5. ca07/7.05.html
  6. ca07/7.06.html
  7. ca07/7.07.html
  8. ca07/7.08.html
  9. ca07/7.09.html
  10. ca07/7.10.html
  11. ca07/7.11.html
  12. ca07/7.12.html
  13. ca07/7.13.html
  14. ca07/7.14.html
  15. ca07/7.15.html
  1. bigben-bg.css
  2. demo.html
  3. demo2.html
  4. flower-bg.css
  5. glassy.html
  6. lightning-bg.css
  7. shell2-bg.css
  8. shell-bg.css
  9. shuttle-bg.css
  10. abbr.html
  11. active.css
  12. active.html
  13. active.xml
  14. adjacent.css
  15. adjacent.html
  16. adjacent.xml
  17. after.html
  18. attr.css
  19. attr.html
  20. attr.xml
  21. attr-begin.html
  22. attr-contains.html
  23. attr-dash-list.css
  24. attr-dash-list.html
  25. attr-dash-list.xml
  26. attr-end.html
  27. attr-list.css
  28. attr-list.html
  29. attr-list.xml
  30. attr-value.css
  31. attr-value.html
  32. attr-value.xml
  33. background-fixed.html
  34. before.html
  35. blue.css
  36. box-sizing.html
  37. button.html
  38. child.css
  39. child.html
  40. child.xml
  41. comment-bug.htm
  42. content.html
  43. empty.css
  44. empty.html
  45. empty.xml
  46. first-child.css
  47. first-child.html
  48. first-child.xml
  49. fixed.html
  50. float.html
  51. focus.css
  52. focus.html
  53. focus.xml
  54. form.html
  55. green.css
  56. hower.css
  57. hower.html
  58. hower.xml
  59. ie7-demo.js
  60. imports.css
  61. imports.html
  62. indirect.css
  63. indirect.html
  64. indirect.xml
  65. label.html
  66. lang.html
  67. last-child.css
  68. last-child.html
  69. last-child.xml
  70. left-right.html
  71. max-width.html
  72. min-height.html
  73. min-width.html
  74. multiple-classes.css
  75. multiple-classes.html
  76. multiple-classes.xml
  77. multiple-classes-bug.html
  78. multiple-pseudo-classes.html
  79. nth-child.html
  80. nth-last-child.html
  81. only-child.html
  82. png.css
  83. png.html
  84. png.xml
  85. png-backgraund.html
  86. Pure CSS Menus (nearly).html
  87. Pure CSS Menus.html
  88. red.css
  89. root.html
  90. root.xml
  91. suite.html
  92. super.css
  93. super.xml
  94. super-dynamic.html
  95. test.css
  96. top-bottom.html
  97. unscrollable.html
  1. src/ie7-content.htm inco
  2. configure.html
  3. ie7-content.htm
  4. ie7-server.css
  5. index.html
  6. install.html
  7. test.html
  8. usage.html
  1. da html.it 2 colonne dx
  2. da html.it 2 colonne sx
  1. dall'italiano all'inglese
  2. dall'inglese all'italiano
  1. ca09/ESEMPIO_COMPLETO.html modello applicato in due studi: già http://www.alsol.org/esempio.html - title: accesso alla pagina esempio.html primo e già http://www.alsol.org/index.html - title: accesso alla pagina index.html secondo incompleto
  2. ca10/esempio_1/index.html modelo applicato per l'aggiornamento della pagina lincata qui
  3. ca10/esempio_2/index.html modelo applicato per l'aggiornamento della pagina lincata qui

Result: Passed validation - File: sviluppo copimpa index.html - Encoding: iso-8859-1 Doctype: XHTML 1.0 Strict - Root Namespace: http://www.w3.org/1999/xhtml - This Page Is Valid XHTML 1.0 Strict! and Valid CSS - Brewed on 21/05/2006 11.38.39 - Last updated Sunday, April 11, 2010 08:50 am