My Ramblings & Random Thoughts
feed
by James Strickland  November 8, 2007 5:49 pm

Here's some CSS that I used to make a pretend "Terminal Screen:"

You can see an example here.

  1.  
  2. /* my [typed] Piece of Paper CSS */
  3.  
  4. html{height: 100%;}
  5.  
  6. body {
  7. font-family: terminal, sans-serif;
  8. color: #00FF33;
  9. padding: 20px 20px 20px 20px;
  10. margin: 0px;
  11. background-color: #4682B4;
  12.  
  13. }
  14.  
  15. /* The Terminal Window */
  16. #main
  17. { width: 640px;
  18. height: 480px;
  19. padding: 10px 10px 10px 10px;
  20. margin-left: auto;
  21. margin-right: auto;
  22. background: #000000;
  23. color: #00FF33;
  24. }
  25.  
  26. #top {
  27. position:absolute;
  28. padding: 50px 50px 50px 50px;
  29. margin-left: 3cm;
  30. margin-right: auto;
  31. background: #FFFFFF;
  32. color: #000000;
  33. width: 780px;
  34. height: 150px;
  35. top: 50px;
  36. bottom: 100px;
  37.  
  38. }
  39.  
  40. a:link {color: #ffffff} /* unvisited link */
  41. a:visited {color: #ffffff} /* visited link */
  42. a:hover { /* mouse over link */
  43. color: #FFf0FF
  44.  
  45. }
  46. a:active {color: #0000FF} /* selected link */
  47.  
  48. /* positioning - left, right and center */
  49. .left
  50. { float: left;
  51. padding: 0px 8px 0px 0px;
  52. }
  53.  
  54. .right
  55. { float: right;
  56. padding: 0px 0px 0px 8px;
  57. }
  58.  
  59. .center
  60. { display: block;
  61. text-align: center;
  62. margin: 0 auto;
  63. }

Trackback URL

Be the first to respond!

Leave a Reply

You must be logged in to post a comment.

© Strick's Ramblings 2012.
Powered by WordPress | Theme by tarimon-notse