求背景图片左边到#box盒子左边框外侧的距离

【求背景图片左边到#box盒子左边框外侧的距离】的更多相关文章

求背景图片左边到#box盒子左边框外侧的距离

box{ width: 100px; height: 200px; background: pink; padding: 100px; border: 80px solid; background-image: url("img/1.png"); //默认 background-origin: padding-box; 背景图将覆盖到padding background-repeat: no-repeat; background-origin: content-box; // 改变 b…

9.求背景图片左边到#box盒子左边外框侧的距离

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>求背景图片左边到#box盒子左边外框侧的距离</title> <style type="text/css"> * { margin: 0; padding: 0; } #box{ width: 100px; height: 2…

background 背景图片 --css3

background 1.设置背景平铺background-repeat round :图片会进行缩放后平铺space : 图片会进行平铺,中间留下空白空间注:当滚动行为设为fixed,round和space没有效果 2.设置滚动时的行为background-attachmentscroll:父元素滚动时,跟随滚动:子元素滚动时,不跟随滚动.背景图片跟随父元素滚动local:父元素滚动时,跟随滚动:子元素滚动时,跟随滚动.背景图片一直跟随滚动fixed:父元素滚动时,不跟随滚动:子元素滚动时,…

溢出处理、盒子模型、背景图片、float（浮动）

一.overflow:溢出内容的处理 overflow:hidden; 溢出内容隐藏(在父元素内使用,可以清除子元素浮动对父元素的影响) overflow:auto; 自动滚动(有溢出产生滚动,没有就不产生滚动条) overflow:scroll; 不管有没有溢出均产生滚动条二.盒子模型: margin(外边距).border(边框).padding(内间距).内容区域 1.w3c盒子模型(默认盒子模型-标准的盒子模型): a.w3c盒子模型设置的宽高为内容…

盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图

盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开设置了宽高一定采用设置的宽高显示宽高 border+padding+content 自身布局 margin-top | margin-left 兄弟布局 margin-bottom | margin-right 父级水平居中 margin:0 auto; 与inline相关的盒子 vertical-align ''' 文…

移动端适配之雪碧图(sprite)背景图片定位

为了减少网络请求个数量,提高网站的访问速度,我们一般都会把一些小的图片合并成一张sprite图,然后根据background-position来进行定位.在web端由于是固定的大小与left .top,所以定位起来会比较准确.简单.但是在移动端就不一样了,各种手机的屏幕大小不一样,很难做到使用sprite图然后根据background-position来定位.所以普遍的做法都是使用单张图片,然后使用background-size: cover|100%|contain来控制背景图的大小.其实这样…