zoukankan      html  css  js  c++  java
  • 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>
     
     
  • 相关阅读:
    JavaScript过滤除连续的数字
    Intellij IDEA 配置Subversion插件
    匹配优先存在的问题,以及解决办法
    回溯
    Linux 启动流程
    tasklist、taskkill、taskmgr
    Mysql分区表
    Linux ${} 变量内容的提取和替换功能等
    Linux shell 提取文件名和目录名
    Mysql计划任务
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/9211631.html
Copyright © 2011-2022 走看看