Advanced Search

Stylesheet Template

/ Published in: CSS

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /* 
  2.     Document   : ${name}
  3.     Created on : ${date}, ${time}
  4.     Author     : ${user}
  5.     Description:
  6.         Purpose of the stylesheet follows.
  7. */
  8.  
  9. /* html5doctor.com Reset Stylesheet
  10. v1.6.1
  11. Last Updated: 2010-09-17
  12. Author: Richard Clark - http://richclarkdesign.com Twitter: @rich_clark
  13. */
  14. html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
  15.  
  16. /* ------------------------- Backgrounds */
  17. /*body {background:url("../images/im_bg.gif") left top repeat;}*/
  18.  
  19. /* ------------------------- Generic */
  20. body {
  21.     /*color:#ffffff;*/
  22. }
  23. .clear {clear:both;}
  24. img { /* Needed for mobile */
  25.     display:block;
  26.     margin-left:auto;
  27.     margin-right:auto;
  28.     width:100%;
  29. }
  30.  
  31. /* ------------------------- Typography */
  32. strong {font-weight:bold;}
  33. p {}
  34. h1 {}
  35. h2 {}
  36. h3 {}
  37. h4 {}
  38. h5 {}
  39. h6 {}
  40. address {}
  41. pre, code {font-family: monospace;}
  42.  
  43. /* Links */
  44. a, a:visited, a:active {}
  45. a:hover {}
  46.  
  47. /* ------------------------- Forms */
  48. input {}
  49. select {}
  50. label {}
  51.  
  52. /* ------------------------- Lists */
  53.  
  54. /* ------------------------- Layout */
  55.  
  56. /* ------------------------- Popups */
  57.  
  58. /* ------------------------- Media Queries */
  59.  
  60. /* ---------------------------------------------------------------------------- */
  61. /* MEDIA QUERIES -------------------------------------------------------------- */
  62. /* ---------------------------------------------------------------------------- */
  63.  
  64. /* Smartphones (portrait) ----------- */
  65. @media only screen 
  66. and (max-width : 320px) {
  67.     /* Styles */
  68.  
  69. }
  70.  
  71. /* Smartphones (landscape) ----------- */
  72. @media only screen 
  73. and (min-width : 321px)
  74. and (max-width : 480px) {
  75.     /* Styles */
  76.  
  77. }
  78.  
  79. /* iPads (portrait) ----------- */
  80. @media only screen 
  81. and (min-width : 481px)
  82. and (max-width : 768px) {
  83.     /* Styles */
  84.  
  85. }
  86.  
  87. /* iPads (landscape) ----------- */
  88. @media only screen 
  89. and (min-width : 769px) 
  90. and (max-width : 1024px) {
  91.     /* Styles */
  92.  
  93. }
  94.  
  95. /* Larger screens ----------- */
  96. @media only screen 
  97. and (min-width : 1024px) {
  98.     /* Styles */
  99.  
  100. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.