CSS样式中background-position：后的两个值代表什么？

最新推荐文章于 2021-12-22 10:24:30 发布
最新推荐文章于 2021-12-22 10:24:30 发布
阅读量3k 收藏 2
点赞数 3
分类专栏： web解疑 文章标签： css css3 前端 web 蓝桥杯
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_57382477/article/details/122001621
版权

如果提供了两个值，第一个会决定距离左边缘的偏移，即水平位置；第二个值会决定图片从上边缘向下的偏移，即竖直的位置。

例如：

background-position:-5px 10px

则代表：背景图片向左偏移5px，向下偏移 10px

森林树苗
关注
专栏目录
CSS background-position的使用说明详解
09-25
在实际应用中，例如在CSS样式表中定义背景图片时： ```css #container { width: 1000px; height: 500px; background: url('images/bg.jpg') no-repeat left top; } ``` 这段代码的含义是设置容器（#container）...
HTML/CSS题库
weixin_34242331的博客
11-14 8993
一、    填空题 使用文本编辑器编辑完HTML后，扩展名可以是__html___或___htm__。 表格的标签是____table______，单元格的标签是____td______。 在编辑table表格时，合并行使用 __rowspan_____合并列使用_____colspan____。 在CSS层叠样式表当中经常用到的三种选择器：___元素选择器___、__类选择器__...
background-position详细用法
weixin_30519071的博客
07-05 324
1、background-position：0 0；等于background-position:left top；（左上角） 2、background-position：100% 100%；等于background-position:right bottom；（右下角） 3、background-position：-70px -40px；(以左上角为0 0点坐标，向左偏移70px,向上偏移40...
Educoder Web练习题---CSS3背景样式
一只小鹿的博客
12-17 1460
CSS3背景样式 第1关：CSS背景相关的概念 通关知识 1、下列选项中，可用于设置背景颜色的属性是（D） A、bgcolor B、color C、back-color D、background-color 2、将背景的绘制区设置到内容区，应使用background-clip属性中的（A）值。 A、content-box B、border-box C、padding-box D、none-box 3、在CSS3背景图属性中，可以设置背景图的平铺是（C）。 A、bcckground-position B、
CSS之background-position属性
tian361zyc的博客
06-22 3453
css
css background-position 偏移的问题
weixin_34319999的博客
03-29 1520
　　今天有个界面调整的工作要做，美工设计了一个导航栏，其中的按钮是用了一张大图，然后用背景偏移来给每个按钮加上不同的图标，美工给切的CSS在 Chrome下显示的很正常，但是IE9下除了第一个显示正常外，其他都是显示的左上角的图标，我们来看css： .icon{background:url(imgs/homepage-icon.png)} .app1{background...
利用CSS定位背景图片 background-position
09-25
在Web前端开发中，CSS的background属性是一个非常强大的工具，它允许开发者在网页元素上添加背景样式。背景样式可以是纯色、渐变色、图片等，并且可以设置图片的显示方式和位置。标题“利用CSS定位背景图片...
CSS背景background、background-position使用详解
09-25
- `repeat`：默认值，图片在两个方向上平铺。 - `no-repeat`：图片只显示一次，不平铺。 - `repeat-x`：图片仅在水平方向平铺。 - `repeat-y`：图片仅在垂直方向平铺。 - `inherit`：继承父元素的`background-...
EduCoder-Web程序设计基础-html5— CSS3背景样式-（第1关：CSS背景相关的概念）（第2关：CSS-背景色的设置）（第3关：CSS-背景图的设置）
weixin_51402180的博客
12-22 2105
目录第1关：CSS背景相关的概念第2关：CSS-背景色的设置代码示例第3关：CSS-背景图的设置代码示例 第1关：CSS背景相关的概念 1、下列选项中，可用于设置背景颜色的属性是（ ） A、 bgcolor B、 color C、 back-color D、 background-color 答案：D 2、将背景的绘制区设置到内容区，应使用background-clip属性中的（ ）值。 A、 content-box B、 border-box C、 padding-box D、 none-bo
css距离顶部高度_提升布局能力！理解 CSS 的多种背景及使用场景和技巧
weixin_39806808的博客
11-21 522
CSS background是最常用的CSS属性之一。然而，并不是所有开发人员都知道使用多种背景。这段时间都在关注使用多种背景场景。在本文中，会详细介绍background-image`属性，并结合图形来解释多个背景使用方式以及其实际好处。如果你还了解 CSS background 属性，可以去先 MDN 查看相关的知识。介绍CSS background属性是以下属性的简写:background-...
CSS中background-position使用技巧
t_jll的专栏
03-14 1114
一.background-position:left top; 　　背景图片的左上角和容器(container)的左上角对齐，超出的部分隐藏。等同于 background-position:0,0;也等同于background-position:0%,0%; 　　二.background-position:right bottom; 　　背景图片的右下角和容器(container
css中background-position属性
aibai666的博客
12-09 1万+
background-position属性在css中用来设置背景图片的位置，它通过设置水平方向和垂直方向的取值来到达效果 background-position的常见三种定义方式 1.关键字取值 通过使用关键字来定义图片的位置。其中 水平方向的关键字有left(左) center(中) right(右) 垂直方向的关键字有top(上) center(中) bottom(下) 使用方法，一般情况下先定义水平方向的关键字 然后定义垂直方向的关键字 background-posi...
CSS background-position属性
小阳的博客
11-27 5936
一、坐标系及原点就像CSS的position属性是定位元素一样，background-position属性定位的是背景图片的。他定位的的是由background-image属性定义的背景图片（注意，这里并不是定位由background-color定义的背景颜色）。它的格式基础模型为：background-position：xpos ypos;其中xpos表示x轴（水平位置）方向的坐标，ypos表示y
css+图标偏移,css background-position 偏移的问题
weixin_28788777的博客
08-04 833
今天有个界面调整的工作要做，美工设计了一个导航栏，其中的按钮是用了一张大图，然后用背景偏移来给每个按钮加上不同的图标，美工给切的CSS在 Chrome下显示的很正常，但是IE9下除了第一个显示正常外，其他都是显示的左上角的图标，我们来看css：.icon{background:url(imgs/homepage-icon.png)}.app1{background-position:0 -120p...
background-position 用法详细介绍
热门推荐
JeamKing的专栏
05-22 12万+
语法：background-position : length || length background-position : position || position 取值：length  : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅 长度单位  position  : top | center | bottom | left | center |
CSS之background-position 用法详细介绍
chuoshenpi2512的博客
06-28 610
background-position 用法详细介绍 语法： background-position : length || length background-position : position || position 取值： length : 百分数 | 由浮点数...
CSS 背景位置 background-position属性
歪脖先生的博客
02-17 10万+
背景位置除了背景背景平铺外，CSS还提供了另一个强大的功能，即背景定位技术，能够精确控制背景在对象中的位置。默认情况下，背景图像都是从元素 padding 区域的左上角开始出现的，但设计师往往希望背景能够出现在任何位置。通过 background-position属性，可以很轻松的控制背景图像在对象的背景区域中的起始显示位置。其语法格式为：background-position: xpos ypo...
第二节点习题
晴天下的大头娃娃
11-25 9761
 HTML第2阶段实训前的测验 选择题 1. 实现背景平铺效果，对应的CSS为( A  )(选择一项)         A. div{backgroud-image:url
CSS背景属性详解：background-color与background-image
"简述CSS中的背景属性background" 在CSS中，背景属性是用于设置HTML元素背景样式的关键部分，它允许开发者对元素的背景颜色、图像、重复方式、位置等进行细致的控制。这些属性共同构建了丰富的背景视觉效果，使网页...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

森林树苗

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值