用CSS设置图片效果



、图片样式

  

1

，图片边框

  

Java

代码

 

 

 

1.

 

img.test1 {    

2.

 

  border-style: dotted;     /*

点划线

*/   

3.

 

  border-color: #FF9900;    /*

边框颜色

*/   

4.

 

  border-width: 5px;        /*

边框粗细

*/   

5.

 

}    

6.

 

img.test2 {    

7.

 

  border-style: dashed;     /*

虚线

*/   

8.

 

  border-color: blue;    /*

边框颜色

*/   

9.

 

  border-width: 2px;        /*

边框粗细

*/   

10.}    

11.img.test3 {    

12.  border-style: dotted;         /*

左边框点划线

*/   

13.  border-left-color: #FF9900;   /*

左边框颜色

*/   

14.  border-left-width: 5px;       /*

左边框粗细

*/   

15.  border-right-style: dashed;   /*

右边框虚线

*/   

16.  border-right-color: #33CC33;  /*

右边框颜色

*/   

17.  border-right-width: 2px;      /*

右边框粗细

*/   

18.  border-top-style: solid;      /*

上边框实线

*/   

19.  border-top-color: #CC00FF;    /*

上边框颜色

*/   

20.  border-top-width: 10px;       /*

上边框粗细

*/   

21.  border-bottom-style: groove;  /*

下边框

3D

凹槽

*/   

22.  border-bottom-color: #

666666

; /*

下边框颜色

*/   

23.  border-bottom-width: 15px;    /*

下边框粗细

*/   

24.}    

25.img.test4 {    

26.  border: 5px double #FF00FF    

27.}   

 

第

4

种就是将各个属性值合并