微信扫一扫打赏支持

css3-3 css3背景样式

css3-3 css3背景样式

一、总结

一句话总结:网站页面上的小图标集成在一张大图上面,是因为降低服务器负载,网站上的那些图片都可以下载下来,源码那里,或者工具那里。

 

1、background:#ccc url('xs.png') no-repeat fixed 50% 50%;中的最后两个参数是什么意思?

背景图片的偏移位置,表示距上和距左各百分之五十

 

2、为什么各种网站设置的时候把所有的小图标集成在一张图上面?

降低服务器请求次数,降低负载,当然这样也会导致必须下载了这张图页面才能正常显示。

 

3、各种网站设置的时候把所有的小图标集成在一张图上面,怎么访问单一的图?

百度:背景,然后偏移

 

4、百度页面将css和js写在页面内部而不是外部的原因?

降低服务器请求次数,降低负载

 

5、background缩写的各个参数是什么意思?

12             background:#ccc url('xs.png') no-repeat fixed 50% 50%;

 

 

二、css3背景样式

1、相关资料

背景:
1.background-color
2.background-image
3.background-repeat
4.background-attachment
5.background-position

 

2、代码

background缩写形式

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>index</title>
 6     <style>
 7         *{
 8             font-family:微软雅黑;
 9         }
10 
11         body{
12             background:#ccc url('xs.png') no-repeat fixed 50% 50%;
13         }
14     </style>
15 </head>
16 <body>
17     <div>
18         <h1>linux is very much!linux is very much!</h1>    
19         <h1>linux is very much!linux is very much!</h1>    
20         <h1>linux is very much!linux is very much!</h1>    
21         <h1>linux is very much!linux is very much!</h1>    
22         <h1>linux is very much!linux is very much!</h1>    
23         <h1>linux is very much!linux is very much!</h1>    
24         <h1>linux is very much!linux is very much!</h1>    
25         <h1>linux is very much!linux is very much!</h1>    
26         <h1>linux is very much!linux is very much!</h1>    
27         <h1>linux is very much!linux is very much!</h1>    
28         <h1>linux is very much!linux is very much!</h1>    
29         <h1>linux is very much!linux is very much!</h1>    
30         <h1>linux is very much!linux is very much!</h1>    
31         <h1>linux is very much!linux is very much!</h1>    
32         <h1>linux is very much!linux is very much!</h1>    
33     </div>
34 </body>
35 </html>

 

 

 

 

 

 

 
 
posted @ 2018-06-22 02:28  范仁义  阅读(825)  评论(0编辑  收藏  举报