CSS中：style="background:url() no-repeat center 0;"?

Posted 2023-05-04

0是什么意思？

0是背景图片的位置，表示顶部对齐，到顶部距离为0，center表示居中

css中背景样式分别如下：

background-color：#999999； //元素的背景色

background-image : url("path/bgFile.gif"); //设置背景图像

background-repeat : repeat-x | repeat-y | repeat | no-repeat; //设置重复方式

background-attachment : fixed | scroll; //设置背景图片的固定方式

background-position : X轴坐标,Y轴坐标[top,bottom,center,left,right,20px,10%];  

//设置背景的左上角位置,坐标可以是以百分比或固定单位

background  可以用这个属性把前面几个综合起来进行简写,
background 各个值的次序依次如下：

background-color | background-image  | background-repeat | background-attachment | background-position

例如:
.bg01

background-color: #FFCC66;

background-image: url("path/bgFile.gif");

background-repeat: no-repeat;

background-attachment: fixed;

background-position: left top;

上面可以简写为:

.bg01background:#FFCC66  url("path/bgFile.gif")  no-repeat  fixed  left  top;

参考技术A background:0 0代表background-position的值，表示背景图的定位，前后两个分别是横向定位和纵向定位。
左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。
如果您仅规定了一个值，另一个值将是50%。 参考技术B

与center一起出现的话，应该是规定背景的定位，为距离顶部为0；

如果 0 在center前面的话是距离左边为0；

相当于下面的拆分开的代码

background-image: url();
//引入图片地址
background-repeat: no-repeat;
//设置是否循环
background-position: center 0;
//设置背景定位位置

当然还有几个属性

background-size: 50px 50px;
//设置背景尺寸，可以用百分比，相对于下面的规定boder-box;默认定位父级是padding-box;
background-origin: border-box;
//设置背景图片定位相对位置。

//还有几个，可以在网上自己找找。一个一个试试理解。

参考技术C background是一个简写属性，它包括background-color、background-image、background-repeat、background-position等等，其中省略某些属性也是可以的。所以整个语句的意思就是：元素以URL()括号内路径的图片为背景，背景图片不重复（no-repeat），背景图片水平居中，垂直靠上（center 0）. 参考技术D

您好，很高兴为您解答。

center 0 是一对坐标参数，表示背景图像横向位置（X轴）为居中，纵向位置（Y轴）为0（即紧靠上端）。下面是示意图：

Css03

   边框样式：border-width,边框的宽度    border-style,边框的外观    border-color,边框的颜色

   背景样式：background-color,背景颜色   background,定义背景图像的路径，这样图片才能显示  background-reper,显示方式，例如纵向平铺、横向平铺

 background-attachment,是否随内容而滚动(了解)

 超链接样式：a:link,定义a元素未访问时的样式  a:visited,定义a元素访问后的样式  a:hover,定义鼠标经过显示的样式  a:active,定义鼠标单击激活时的样式

 再有下划线时，我们可以使用text-decoration: none; 来去除超链接下划线。

 定义这4个伪类，必须按照(link、visited、hover、active)LVHA的顺序进行，不然浏览器可能无法正常显示这4种样式。请记住，这4种样式定义顺序不能改变!

   一般情况下，我们只用到两种状态:访问后状态和鼠标经过状态。hover伪类可以定义任何一个元素在鼠标经过时的样式