css背景- 简写属性

已于 2022-02-28 13:49:24 修改
阅读量386 收藏
点赞数
分类专栏： css 文章标签： css css3 html
于 2022-01-04 17:31:57 首次发布
原文链接：https://www.runoob.com/css/css-background.html
版权

https://www.runoob.com/css/css-background.html

背景颜色的简写属性为 “background”:

background:#ffffff url('https://static.runoob.com/images/mix/img_tree.png') no-repeat right top;

当使用简写属性时，属性值的顺序为：:

background-color
background-image
background-repeat
background-attachment
background-position
以上属性无需全部使用，你可以按照页面的实际需要使用.

qq_42318977
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
背景background 7种样式及简写
m0_48462345的博客
11-30 2080
background相关标签，代码
【CSS】css的background属性用法详解，background常用缩写形式
余浩的博客
06-24 3738
//指定背景颜色 //设置背景图像, 可以是真实的图片路径, 也可以是创建的渐变背景;//设置背景图像的位置//设置背景图像的大小 //指定背景图像的铺排方式//设置背景图像显示的原点[background-position相对定位的原点];//设置背景图像向外剪裁的区域;//指定背景图像是滚动还是固定; 默认滚动；...
background简写属性的书写顺序，以及各个属性的含义
柑橘乌云_
08-23 2314
是background-color，background-image，background-repeat，background-attachment，background-position,background-size。注意：如果用background-size,一定要用/分隔接下来。
CSS 基础：设置背景的 5 个属性及简写 background 注意点
最新发布
u013179804的博客
04-08 1453
你好，我是云桃桃。一个希望帮助更多朋友快速入门 WEB 前端的程序媛。回复 “前端基础题”，可免费获得前端基础 100 题汇总，回复 “前端工具”，可获取 Web 开发工具合集263篇原创内容-gzh后台回复“”可获取开发工具，持续更新中后台回复“”可得到前端基础100题汇总，持续更新中CSS 中的background背景属性是前端开发中常用的一个属性，它用于控制元素的背景样式，包括背景颜色、背景图片、背景位置等。本文将详细探讨 CSS 中的background。
background简写
大白兔
05-07 5620
background是一个简写属性 background: color image position/size repeat origin clip attachment initial | inherit; 它的展开式属性为： background-color/*背景颜色（CSS1）*/ background-image/*背景图片（CSS1）*/ background-position/...
CSS背景缩写、简写详细
weixin_45820444的博客
08-23 6367
CSS背景缩写、简写 不太会这个，到网上搜了下，发现写的都不中意，就想到自己写一个出来 背景共有8个属性： background-color    背景颜色 background-position    背景图像的位置 background-size     背景图片的尺寸 background-repeat    如何重复背景图像 background-origin     背景图片的定位区域 background-clip      背景的绘制区域  /* 底部详细说明 */
简述CSS中的背景属性background
12-10
此背景层由8个CSS属性（加上1个简写的属性）控制。 background-color background-color属性设置元素的背景颜色。它的值可以是任意合法的颜色值或者是transparent关键字。   .left { background-color: #ffdb3a; } ...
21.3 CSS 背景属性
09-01
下面将详细介绍CSS背景属性的相关知识点。 1. **背景颜色 (background-color)** - `background-color`属性用于设置元素的背景颜色。可以使用颜色名称、RGB、RGBA、HSL、HSLA或者透明度（transparent）来定义。例如...
css3属性选择器,背景缩写
06-19
在CSS3中，属性选择器和背景缩写是两个重要的概念，它们极大地提高了CSS的效率和可维护性。本文将详细探讨这两个主题。 首先，让我们来看看CSS3的属性选择器。属性选择器允许我们根据HTML元素的特定属性来选择和...
css 之 background-position-x
10-30
这个属性是 background-position 属性的简写形式，专门用于设置背景图片的水平位置。 背景图片的水平位置是指背景图片左上角相对于元素左上角的水平距离。background-position-x 属性的取值可以是长度单位（如 px、...
CSS属性简写和选择器的优先级问题
09-24
在CSS（层叠样式表）中，属性简写和选择器的优先级是两个关键概念，对于编写高效、简洁的CSS代码至关重要。属性简写允许开发者用更少的代码来设置多个相关的样式属性，而选择器优先级则决定了当多个规则应用于同一个...
CSS的background简写方式
Pan Fengshan的博客
07-26 9878
在CSS2.1里，background属性的简写方式包含五种属性值，从CSS3开始，又增加了3个新的属性值，加起来一共8个。 CSS2.1 background-color 使用的背景颜色。 background-image 使用的背景图像。 background-repeat 如何重复背景图像。 background-attachment 背景图像是否固定或者随着页面的其余部分滚动。 ...
css3 backgroud 的缩写形式
小哈力----一个小前端工程师
05-02 377
css3 backgroud的缩小形式 background: #d3d4d5 url(bg.png) 100% 0 / 50% 80% no-repeat; 注意：/ 不能丢，/前面表示background-position； /后面表示background-size <!DOCTYPE html> <html lang="en"> <head> ...
css background用法详解
bamboozjy的博客
12-24 1360
语法:  background:bg-color bg-image bg-position/bg-size bg-repeat bg-origin bg-clip bg-attachment ;            背景：背景色 背景图 背景图定位/背景图大小 背景图重复 背景图定位位置 绘制区域边缘 是否固定   常用举例（缩写版）： background:#fff; backgro...
html中背景简写,css中background简写属性
weixin_33657090的博客
06-27 700
在CSS2.1里，background属性的简写方式包含五种属性值，从CSS3开始，又增加了3个新的属性值，加起来一共8个。CSS2.1background-color使用的背景颜色。background-image使用的背景图像。background-repeat如何重复背景图像。background-attachment背景图像是否固定或者随着页面的其余部分滚动。background-posi...
background简写属性
zhuyunhe的专栏
05-15 3774
CSS-background
background 是一种 CSS 简写属性，用于一次性集中定义各种背景属性，包括 color, image, origin 与 size, repeat 方式等等。
GoodIdea
02-25 412
此属性是一个 简写属性，可以在一次声明中定义一个或多个属性：background-clip、background-color、background-image、background-origin、background-position、background-repeat、background-size，和 background-attachment。 对于所有简写属性，任何没有被指定的值都会被设...
css学习-background背景缩写
疯狂的草儿
09-16 446
背景缩写用于针对背景控制的相关属性进行缩写，其语法格式如下： background:background-color | background-image | background-repeat  background-attachment | background-position 这个没什么好讲的，请看实例： #content {          background-col...
background-image:url();url中怎么写；以及区分background属性；
热门推荐
rmkloveme
10-26 14万+
background-image:用于设置需要显示背景图片；  例如-->background-image:url(demo.jpg); 大家知道ulr()中是填写路径：（现在假设背景图片名字叫做demo.jpg） 1、如果该css文件和背景图片在同一文件夹存在且并不包含于其他文件夹 那么直接填写demo.jpg； -->background-image:ur
css背景图属性简写
09-09
CSS背景图属性可以使用简写形式来设置，简写形式包括以下几个属性： 1. background-image：设置背景图片的URL。 2. background-position：设置背景图片的位置。 3. background-size：设置背景图片的尺寸。 4. background-repeat：设置背景图片的重复方式。 5. background-attachment：设置背景图片的滚动方式。 6. background-origin：设置背景图片的起始位置。 7. background-clip：设置背景图片的绘制区域。 8. background-color：设置背景颜色。 使用简写形式时，这些属性可以按照上述顺序依次书写，并用空格分隔。例如： ```css background: url('example.jpg') center / cover no-repeat fixed content-box #f1f1f1; ``` 这个简写的示例代码将设置背景图片为'example.jpg'，居中对齐，覆盖整个元素，不重复，固定在视口中，绘制在内容区域，并且背景颜色为#f1f1f1。 需要注意的是，当使用简写形式时，某些属性是可选的，如果不需要设置某个属性，可以省略该属性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值