今晚坑了我的background属性！

原本准备学习的是background在CSS3中跟新的三个属性： background-size， background-clip， background-origin. 谁知道特么的被background-attachment的fixed值给坑了一把。

先自我反省一番，其实在处理这个问题上我是有很大的问题的：

虽然基础没打好是一回事，但是主要的是思维太烂。

1. 没能静下来思考，以为这个是很熟悉的，随便改改就好，浮躁了。真是一个大问题。

2. 没有按原本准备的遇到问题的解决方法，说好的锻炼思维的。一遇到这种问题全忘了。

background-attachment：fixed，整个背景就会相对于浏览器窗口的可见部分定位，而不是包含块。

典型的例子是，如果设置为居中，收缩浏览器的窗口，图片的位置就会从以前的位置移动到另外一个位置以确保图片永远是相对于浏览器可见窗口居中的。（改变窗口后需要刷新）

接下来就该是讲讲正题啦！其实相当简单。

1. background-size：背景图片的大小。适合常规的表示大小的单位。

2. background-clip：与背景色backgr-color相关，而与背景图片background-image无关。

3. background-origin 与背景色backgr-image相关，而与背景图片background-color无关。

剩下的明天再更，室友睡觉

时间： 2024-10-17 03:21:53

今晚坑了我的background属性！的相关文章

background属性总结，background-image路径问题

(1)background属性总结 background 简写属性在一个声明中设置所有的背景属性. 可以设置如下属性:background-color规定要使用的背景颜色.background-position规定背景图像的位置.background-size规定背景图片的尺寸.background-repeat规定如何重复背景图像.background-origin规定背景图片的定位区域. background-origin: padding-box|border-box|content-bo

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属性

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

设置background属性使用selector的时候内置?attr报错的解决方案

当我们设置background属性的时候可以设置background="@color/black" 也可以设置 background="@drawable/selector" 然后selector我们可以这样设置 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk

css2和CSS3的background属性简写

1.css2:background:background-color || url("") || no-repeat || scroll || 0 0; css3: background: url("") || 0 0/cover || no-repeat || scroll || border-box || content-box || black; CSS2中的Background属性: background: background-color || bac

从零开始学 Web 之 CSS3（三）渐变，background属性

大家好,这里是「从零开始学 Web 系列教程」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅博客园:http://www.cnblogs.com/lvonve/ CSDN:https://blog.csdn.net/lvonve/ 在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目.现在就让我们一起进入 Web 前端学习的冒险之旅吧! 一.渐变渐变是C

2.10、background属性

属性解释 background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: background-color 设置背景颜色 background-image 设置背景图片地址 background-repeat 设置背景图片如何重复平铺 background-position 设置背景图片的位置 background-attachment 设置背景图片是固定还是随着页面滚动条滚动实际应用

RadioButton 的background属性表现特征

对于radiaoButton,应该很多人都用过.下面看一个场景上方时radiogroup,细致观察发现左1,文字开始位置和右1文字开始位置不同,这是为何呢? 查看布局: <RadioButton android:layout_width="0dp" android:layout_weight="1.0" android:layout_height="match_parent" android:button="@null&