收藏此页

校内网代码

校内网代码>校内网教程> 校内网css代码详细教程

校内代码

校内网css代码详细教程

关键词:校内网代码 收藏到书签】【添加到百度搜藏】【留言建议

 

CSS代码 到目前为止,你的涂鸦板应该有以下代码
  1. /*整体页面设置*/              
  2. body {          
  3. color:#9E988C;        
  4. padding:0;           
  5. margin:0;             
  6. background:url(upload/2007_12/071228043573731.gif) repeat;}             
  7.               
  8. /*隐藏版块*/                
  9. #logo#tagline, #copyrightlink, .announcement, #userBlog .more,  #utility, #permalink, #sidebar, #reportlink{            
  10.  display:none}           
  11.           
  12. /*头部图片设置*/            
  13. #container{            
  14. margin:0 auto;           
  15. width:880px;           
  16. background:url(http://fm231.img.xiaonei.com/blog/20071026/12/20/A240169491211OXC.jpg) no-repeat;}            
  17.             
  18. /*头部设置*/          
  19. #header {           
  20. height:400px;           
  21. background:none;}           
  22.           
  23. /*内容部分*/          
  24. #content {           
  25. border:0;           
  26. width:860px;           
  27. padding:20px 20px;           
  28. background:#fff;}           
  29.           
  30. #widebar {            
  31. width:880px;            
  32. padding:0;            
  33. border:0;            
  34. background:none;}    
  35.   
  36. /*我的状态样式*/  
  37. #userStatus {   
  38. margin:0;   
  39. padding:10px 0px 10px 10px;}           
  40.           
  41. /*账号信息列设置*/            
  42. #userUpdates{           
  43. width:640px;}           
  44.           
  45. /*底部设置*/      
  46. #footer {       
  47. width:880px;       
  48. background:#9E9986;}       
  49. /*底部文字样式*/      
  50. #footer p{       
  51. padding:0 10px;       
  52. color:#686357;}       
  53.       
  54. /*底部链接样式*/      
  55. #footer a:link,#footer a:visited,#footer a:hover{       
  56. color:#686357;}       
  57.       
  58.       
  59. /*整体链接样式*/          
  60.           
  61. /*未访问的链接和已访问的链接*/          
  62. a:link,a:visited{           
  63. color:#9E988C;}           
  64. /*鼠标在链接时的样式*/          
  65. a:hover{           
  66. color:#686357;}           
  67.       
  68. /*导航条样式*/          
  69. #navigation {           
  70. border-left:0;           
  71. background#9E988C;}           
  72.           
  73. #navigation ul li{           
  74. background-image:none !important;}             
  75.           
  76. #navigation a:link,#navigation a:visited {           
  77. color:#fff;           
  78. background:#9E988C;}           
  79.           
  80. #navigation a:hover {           
  81. background:#686357;}           
  82.           
  83. /*导航子列表样式*/          
  84. #navigation ul ul{           
  85. background:#9E988C;           
  86. border1px solid #686357;}           
  87.           
  88. #navigation ul ul a {           
  89. color:#fff;           
  90. border-bottom1px solid #686357;           
  91. background:#9E988C;}           
  92. #navigation ul ul a:hover {           
  93. color:#fff;           
  94. background#686357;}      

 

小节回顾:看到这里你应该要学会这些

  1. 知道可以使用margin-left,margin-right调整位置 
  2. 知道文字美化是分有链接和无链接的
  3. 链接有四种状态,而我们常用前三个,第一个和第二个的设置一般是一样的.  

 


收藏此页 | 推荐好友 | QQ空间代码 | 返回顶部 |