He元素

Don't be shy just try!

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

 先写全局的样式

body { margin:0 auto; font-size:12px; font-family:Verdana; line-height:1.5;}
ul,dl,dd,h1,h2,h3,h4,h5,h6,form,p { padding:0; margin:0;}
ul { list-style:none;}
img { border:0px;}
a { color:#05a; text-decoration:none;}
a:hover { color:#f00;}

全局的样式定义完后,下面定义以上几大块的样式,先设置下#containerr的样式如下:

#container { width:900px; margin:0 auto;}

 

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td { margin:0; padding: 0; }
fieldset, img { border: 0; }
:focus { outline: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }
input, button, textarea, select { *font-size: 100%;}
textarea { overflow:auto; }
body { line-height: 1.5; }
ol, ul { list-style: none; }
:link, :visited, ins { text-decoration: none; }
body {
  font: 14px/1.5 "Microsoft Yahei", "Hiragino Sans GB", Helvetica, "Helvetica Neue", "微软雅黑", Tahoma, Arial, sans-serif;
  color: #14191e;
}

 

a链接样式

a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */

 

a { display: block; height: 30px; width: 100px; line-height: 30px; text-align: center; background: #CCC; }


a:hover { color: #FFF; text-decoration: none; background: #333; }

 

posted on 2016-05-23 14:04  He元素  阅读(120)  评论(0编辑  收藏  举报