background简写方式

background有以下属性：

css1:

background-color：背景色
background-image：背景图片
background-repeat：背景图片重复规则

background-position：背景图片起始位置，默认值0% 0%；
可选值：top/center/bottom left/center/right ；只写一个第二个默认center
或者：x% y% ；只写一个第二个默认50%
或者：xpos ypos

background-attachment：背景图片是否固定或者是随页面其他部分滚动
可选值：fixed/scroller/inherit

css3:

background-size：背景图片的尺寸

background-origin：规定background-position属性相对于什么来定位，默认值paddding-box；
可选值：content-box/padding-box/border-box

background-clip：规定图片绘制区域，默认值border-box，在border为非固实（solid）、dashed等时可看出区别。
可选值：content-box/border-box/padding-box

background简写方式

background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [background-size] [background-origin] [background-clip]

注意：

[background-position] / [background-size] 中：background-size只能紧跟着background-position出现，以 / 分割
如果 xxx-box出现两次，则第一次设置background-origin 第二次设hibackground-clip;出现一次是两个属性都设置成xxx-box
其他属性顺序任意,不设置取默认值

举个栗子

    background: #ffffff url(../images/g_dengBg.png) center center/cover no-repeat;

    background: url(../images/PC.jpg) fixed no-repeat 0% / cover content-box content-box;

background简写方式相关推荐

七、CSS背景（background简写）
CSS 背景属性用于定义 HTML 元素的背景,通过背景属性我们可以定义元素的背景颜色.背景图片.背景图片的平铺方式和显示位置等. 1.background-color background-colo ...
state的简写方式
<!DOCTYPE html> <html> <head> <meat charset="UTF-8"> <title> ...
css3 background简写,background-size简写背景属性（CSS3）
background-size简写背景属性(CSS3) 我正在尝试在短手background属性中混合background-image和background-size属性. 基于W3C文档 backg ...
React之props的简写方式和报错示范
1.修改name值,这里可以直接改 1)这样写报错,因为props是只读的 2.修改age值 1)这样写没问题,age+1 2)这样写报错,因为props是只读的 3.简写,将这两个放入clas ...
1.22 Lambda表达式的3种简写方式
使用 Lambda 表达式是为了简化程序代码,Lambda 表达式本身也提供了多种简化形式,这些简化形式虽然简化了代码,但客观上使得代码可读性变差.本节介绍 Lambda 表达式的几种简化形式. 省略 ...
前端学习（3220）：props的简写方式
前端学习（3121）：react-hello-react的state的简写方式
一些常被你忽略的CSS小知识
1.CSS的color属性并不是仅仅能用于文本显示对于CSS的color属性,相信全部Web开发者都使用过.假设你并不是一个特别有经验的程序猿,我相信你未必知道color属性除了能用在文本显示,还 ...
W3school：CSS基础：CSS注释、颜色（颜色、RGB、HEX、HSL）、背景（背景、背景图像、背景重复、背景附着、简写背景属性）
W3school:CSS基础:CSS注释.颜色(颜色.RGB.HEX.HSL).背景(背景.背景图像.背景重复.背景附着.简写背景属性) 一.CSS注释 1.注释用于解释代码,以后在您编辑源代码时可能 ...
双18期|CSS揭秘之简写属性
theme: channing-cyan highlight: a11y-dark 双18期|CSS揭秘之简写属性 tips:每个技术点都值得优学优写:18期一.写在前面 css 简写属性了解吗?前 ...

background简写方式

background有以下属性：

css1:

css3:

background简写方式

举个栗子

background简写方式相关推荐

最新文章

热门文章