index.html

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

      <link href="style.css" type="text/css" rel="stylesheet">

 </head>

 <body>

       <p>测试一下背景是否可以继承（不能）</p>

 </body>

 </html>

css

 body{

     background-color:gray; /*设置背景颜色 */

 }

 p{

     padding: 10px;  /*设置内边框 */

     width: 150px;  /*设置宽度 */

     background-color: red;

 }

效果：

2、设置图片背景

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

body{

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

}

设置单个标签的背景图片

p{

    width:200px;

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

}

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

 body{

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

     background-repeat: no-repeat;  /*设置图片是否重复*/

     background-position: right top;  /*设置图片的起始位置*/

                         /*right代表从页面的right和从图片的center开始显示*/

                         /*还可指定具体的数值如0px，0px*/

                         /*还可指定百分数*/

 }

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

 body{

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

     background-repeat: no-repeat;  /*设置图片是否重复*/

     background-attachment: fixed;/*设置图片是否随着内容滚动*/

 }

CSS3背景：

设置图片的大小

 body{

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

     background-repeat: no-repeat;  /*设置图片是否重复*/

     background-size:1000px 1000px;/*设置图片的大小*/

 }

Css背景的更多相关文章

  1. CSS背景background、background-position使用详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  2. 你不知道的CSS背景—css背景属性全解

    CSS背景在网页设计中使用频率非常高,然而对于这个开发人员很熟悉的CSS属性,却隐藏着许多不为初级开发人员熟知的细节,这篇文章尝试扒开这层不为人知的面纱. 首先列举一下CSS中关于元素背景的所有属性并 ...

  3. CSS背景background详解，background-position详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  4. CSS背景100%平铺 浏览器缩小背景显示不全解决办法

    本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺 ...

  5. Bootstrap css背景图片的设置

    一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...

  6. CSS背景样式

    CSS是级联样式表,用来表现HTML等文件样式的语言,CSS能够真正做到网页的表现与内容分离的设计语言,也就是说,做好了一款网页,可以通过另一个后缀名是css的文件进行修改其中的样式,不过在html的 ...

  7. CSS背景图拉伸自适应尺寸，全浏览器兼容

    突然有人问我这个问题,说网上CSS filter的方法在非IE浏览器下不奏效.思考之后,问题之外让我感慨万千啊,很多我们所谓的难题,都会随着时代的发展迎刃而解,或被新的问题所取代. 当CSS背景图片拉 ...

  8. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  9. CSS 背景-CSS background

    这里有个很好的样式学习网站:http://www.divcss5.com/rumen/r125.shtml 一.Css background背景语法   -   TOP CSS背景基础知识 CSS 背 ...

  10. CSS背景属性

    CSS背景属性 1.background-attachment 属性 scroll:默认值.背景图像会随着页面其余部分的滚动而移动. fixed:当页面的其余部分滚动时,背景图像不会移动. inher ...

随机推荐

  1. C#获取文件夹下指定格式的所有文件

    C#获取文件夹下指定格式的所有文件的方法,虽然很简单,但还是分享一下吧,用到时可以稍加修改和优化就可以使用. 获取指定目录下所有文件 //最要使用 System.IO.Directory.GetFil ...

  2. Linux 字符集

    摘抄自网络--/etc/sysconfig/i18n 文件:LANG="zh_CN.GB18030"SUPPORTED="zh_CN.GB18030:zh_CN:zh:e ...

  3. 小学生之Java中迭代器实现的原理

    一. 引言 迭代这个名词对于熟悉Java的人来说绝对不陌生.我们常常使用JDK提供的迭代接口进行java collection的遍历: Iterator it = list.iterator();wh ...

  4. hdu 5108

    //题意是给一个数N,然后让你求M,使得N/M为素数,并且M的值最小 //思路呢,大概有两种,一个是遍历素数求解的,不过数据太大不现实 //另外一种就是质因数求解,for循环是遍历质因数,然后whil ...

  5. asp.net微信开发第三篇----自定义会话管理

    和微信用户的沟通少不了,总觉得看起来微信官网后台管理中的会话回复消息有点呆板,所以我这里就自定义了一个会话管理功能,最终效果图如下: 因为我试使用富文本文件CKEDITOR来进行编写,你看到稳中可能会 ...

  6. OpenXml2.0 - 找不到类型或命名空间名称“DocumentFormat”

    在使用 OpenXml SDK2.0的过程中,很是郁闷的是总是报 '找不到类型或命名空间名称“SpreadsheetDocument”(是否缺少 using 指令或程序集引用?)'的错误,命名已经添加 ...

  7. mysql 自带全文检索

    对于一些简单的检索可以通过mysql自带的全文索引及 MATCH AGAINST 查询语句实现.实验步骤如下.1.建表DROP table IF exists con_video_file_des_t ...

  8. 如何通过Request.ServerVariables["HTTP_USER_AGENT"]获取客户端操作系统信息

    http://www.useragentstring.com/pages/api.php

  9. oracle where与having

    where与having可以过滤,一般来说尽量使用where ,但是如果过滤条件中有组函数,只能使用having SQL> select deptno,avg(sal) from emp gro ...

  10. 在Activity之间如何传递数据，请尽可能说出你所知道的传递数据的方法，并详细描述其实现过程。

    在Activity之间如何传递数据,请尽可能说出你所知道的传递数据的方法,并详细描述其实现过程. 答案:可以通过Intent对象.静态变量.剪切板和全局对象进行数据传递,具体的数据传递方法如下. 1. ...