css 简单使用1

定义了 msg div 的位置。

 CSS手册：http://htmlhelp.com/zh/reference/css/structure.html

 1. 选择符：

1) html 元素选择符，如               

css 代码

1. P { color:red }   
2. A { color: #666666; }   
3. < p >< /p >   
4. < a href = '#' />   

2)类选择符，html 对应 class 属性 ，如                   

css 代码

1. .smalltext  { color:red }   
2. < div  class = ' smalltext ' / >   

3)关联选择符，如

css 代码

1. P EM { background: yellow }  

4)id 选择符，不方便，应少使用，如                   

css 代码

1. #smalltext                                < div id=' smalltext ' />    

 2. Background url 位置定位：

0px  -13px 为该图片left  , top 的位置

css 代码:             

1. .my-shell-close {   
2.   cursor: pointer;   
3.   background: url(images/default/shell/btn-sprite.gif) no-repeat left 0px;   
4.   width: 15px;   
5.   height: 13px;   
6. }   
7.   
8. .my-shell-min {   
9.   cursor: pointer;   
10.   background: url(images/default/shell/btn-sprite.gif) no-repeat 0px -13px;   
11.   width: 13px;   
12.   height: 13px;   
13. }   
14.   
15. .my-shell-max {   
16.   cursor: pointer;   
17.   background: url(images/default/shell/btn-sprite.gif) no-repeat 0px -26px;   
18.   width: 15px;   
19.   height: 13px;   
20. }   
21.   
22. .my-shell-min-over {   
23.   background: url(images/default/shell/btn-sprite.gif) no-repeat 0px -52px;   
24. }   
25.   
26. .my-shell-close-over {   
27.   background: url(images/default/shell/btn-sprite.gif) no-repeat 0px -39px;   
28. }   
29.   
30. .my-shell-max-over {   
31.   background: url(images/default/shell/btn-sprite.gif) no-repeat 0px -65px;   
32. }