zoukankan      html  css  js  c++  java
  • Css背景

    index.html

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4 <meta charset="UTF-8">
     5 <title>Insert title here</title>
     6      <link href="style.css" type="text/css" rel="stylesheet">
     7 </head>
     8 <body>
     9       <p>测试一下背景是否可以继承(不能)</p>
    10 </body>
    11 </html>

    css

    1 body{
    2     background-color:gray; /*设置背景颜色 */
    3 }
    4 p{
    5     
    6     padding: 10px;  /*设置内边框 */
    7      150px;  /*设置宽度 */
    8     background-color: red;
    9 }

    效果:

    2、设置图片背景

    css代码:设置body的背景图片

    body{
        background-image: url("img.jpg");
    }

    设置单个标签的背景图片

    p{
        200px;
        background-image: url("img.jpg");
    }

    设置图片是否重复和起始位置:

    1 body{
    2     background-image: url("img.jpg");
    3     background-repeat: no-repeat;  /*设置图片是否重复*/
    4     background-position: right top;  /*设置图片的起始位置*/
    5                         /*right代表从页面的right和从图片的center开始显示*/
    6                         /*还可指定具体的数值如0px,0px*/
    7                         /*还可指定百分数*/
    8 }

    设置图片是否随着内容滚动

    1 body{
    2     background-image: url("img.jpg");
    3     background-repeat: no-repeat;  /*设置图片是否重复*/
    4     background-attachment: fixed;/*设置图片是否随着内容滚动*/
    5 }

    CSS3背景:

        设置图片的大小

    1 body{
    2     background-image: url("img.jpg");
    3     background-repeat: no-repeat;  /*设置图片是否重复*/
    4     background-size:1000px 1000px;/*设置图片的大小*/
    5 }
  • 相关阅读:
    [转]VS2013自带SQL Server 的启用方法
    [转]CryptographyHelper.cs
    [转]Oracle 经验集
    程序的健壮性和鲁棒性
    死理性派恋爱法:拒绝掉前面37%的人
    Asp.net页面间传值方式汇总
    【操作系统】总结五(I/O管理)
    Windows编程
    【操作系统】磁盘
    【操作系统】文件系统
  • 原文地址:https://www.cnblogs.com/UniqueColor/p/5748514.html
Copyright © 2011-2022 走看看