精通css——background属性

一：概念

1. background-color(1)：规定要使用的背景的颜色

2. background-position(1)：规定背景图片的位置

　　top left

　　top center

　　top right

　　center left

　　center center

　　center right

　　bottom left

　　bottom center

　　bottom right

　　------------------

　　x% y%

　　------------------

　　xpos ypos

3. background-size(3)：规定背景图片的尺寸

　　length

　　------------------

　　percentage

　　------------------

　　cover

　　------------------

　　contain

4. background-repeat(1)：规定如何重复背景图片

　　repeat

　　repeat-x

　　repeat-y

　　no-repeat

　　inherit

5. background-origin(3)：规定背景图片的定位区域

　　*padding-box

　　border-box

　　content-box

6. background-clip(3)：规定背景的绘制区域

　　*border-box

　　padding-box

　　content-box

7. background-attachment(1)：规定背景是否固定或者随着页面的其他部分滚动

　　*scroll

　　fixed

　　inherit

8. background-image(1)：规定要使用的背景图片

二：使用

原文地址：https://www.cnblogs.com/happylich/p/9926457.html

时间： 2024-11-06 03:36:10

精通css——background属性的相关文章

CSS background 属性

一.background属性可以设置一个元素的背景样式,当然前提是这个元素有具体的宽高值. 先来一个简单的背景设置: 1 #show-box { 2 width: 800px; 3 height: 500px; 4 background: #000; 5 background-image: url(image url); 6 } 7 </style> 这里只是简单的设置了颜色和背景贴图. 下面让我们来看一下官方的background的属性: 语法格式: background: color po

css background属性

background 简写属性在一个声明中设置所有的背景属性. 所有浏览器都支持 background 属性. 注释:IE8 以及更早的浏览器不支持一个元素多个背景图像. 注释:IE7 以及更早的浏览器不支持 "inherit".IE8 需要 !DOCTYPE.IE9 支持 "inherit". 可以设置如下属性: ?background-color ?background-position ?background-size ?background-repeat ?

CSS background 属性详解

CSS background Property 语法: background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit; Note: If one of the properties in the shorthand declaration is the bg-size property, you must use a / (slash) to sep

css background属性了解

CSS 允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果. 纯色背景背景图像 body{ background: #ff0000 url(/i/eg_bg_03.gif) no-repeat fixed center; } 1,纯色背景:background-color body { background-color:yellow; } h1 { background-color:#00ff00; } p { background-color:rgb(255,0,255); }

CSS中background属性详解

CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-color:#色码; 背景色彩 Exp: background-image:url(背景图案.jpg,gif,bmp); background-color:#FFFFFF; background-color : tra CSS背景属性 background css 说明 background-imag

CSS背景属性Background详解

本文详解了CSS的背景属性Background,包括CSS3中新增的背景属性.如果你是个CSS初学者,还可以查看之前介绍的CSS浮动属性和CSS透明属性详解. css2 中的背景(background) CSS2 中有5个主要的背景(background)属性,它们是: background-color: 指定填充背景的颜色. background-image: 引用图片作为背景. background-position: 指定元素背景图片的位置. background-repeat: 决定是否

CSS背景属性background

background属性是所有背景属性的缩写: 以下是这些背景属性: background-color:背景颜色你可以通过颜色名称(red/green/blue)来设置也可以用十六进制(#fff/#000/#bcbcbc) 还可以用到rgb(x,x,x) x取值(0~255) background-position:背景开始位置也是三种取值方式,第一种是用方位词(top/right/bottom/left)组合,如left top 百分比x% x%,如0% 0%表示左上角用像素表示,

CSS学习笔记-background属性

平常总是使用background的缩写形式,忽视了各属性的细节在此进行总结. background-attachment W3C:属性设置背景图像是否固定或者随着页面的其余部分滚动. 属性值: scroll 默认值.背景图像会随着页面其余部分的滚动而移动. fixed 当页面的其余部分滚动时,背景图像不会移动. inherit 规定应该从父元素继承 background-attachment 属性的设置. background-position W3C:属性设置背景图像的起始位置.其

《精通CSS：高级Web标准解决方案》学习笔记01

对我来说,CSS算得上是一个很难的东西.因为它不像JavaScript那么有趣,对记忆的要求太高,而我对浏览器兼容性.各种CSS Hack真的一点都不感冒.琐碎的.非理论化的知识,真的很烦人呐~ 鉴于国产CSS书籍基本都是辣鸡的现状,我在半年前动用某工作室的购书资金采购了一些技术书籍,这本广受好评的<精通CSS>也在其中.但是在阅读过后我深深的感觉到,如果说CSS本来已经是一种很琐碎的布局知识集合的话,那这本书只能说是更加琐碎了,因为这只是一本纯纯的经验分享.而且随着前端技术的快速发展,明显能