美文网首页
CSS的背景

CSS的背景

作者: 社会主义顶梁鹿 | 来源:发表于2020-06-17 17:26 被阅读0次

一、背景颜色

background-color     一般默认是透明色(transparent)

二、背景图片

background-image : url(URL)   常用于logo或者按钮,而不是使用插入图片,背景图片优点是便于控制位置

1、背景平铺

background-repeat  : repeat    |    no-repeat    |    repeat-x    |    repeat-y  

2、背景图片的位置

background-position :x y ;       改变图片在背景中的位置

参数是方位名词

(1)如果指定的两个值都是方位名次,则两个值前后顺序无关,如left top和top left效果一致。

(2)如果只指定了一个方位名词,另一个值省略,则第二个值默认居中对齐。

参数是精确单位 ——background-position :20px 50px 

(1)如果参数是精确单位,那么第一个肯定是x坐标,第二个一定是y坐标。

(2)如果只指定一个数值,那该数值一定是x坐标,另一个默认垂直居中。

参数是混合单位——background-position :20px center 

(1)如果指定的两个参数是混合单位,则第一个值是x坐标,第二个值是y坐标

3、背景图像固定(背景附着)

background-attachment : scroll  |  fixed     属性设置背景图像是否固定或者随着页面的其余部分滚动。后期制作视差滚动的效果。

4、背景复合写法

类似与font,但是没有顺序,一般习惯约定顺序为:

background: 背景颜色 背景图片地址 背景平铺 背景图像滚动 背景图片位置

background: red url(URL) no-repeat fixed center top;

5、背景色半透明

background: rgba(0,0,0,0.3)     属性中的a代表透明度alpha,取值范围0~1,可以把0.3的0省略,也就是.3

相关文章

  • CSS样式

    CSS背景 CSS字体 CSS链接 CSS 列表 CSS 表格 CSS轮廓 CSS背景 1、背景色 ba...

  • Html-CSS 背景设置

    CSS 背景 CSS 背景属性用于定义HTML元素的背景。CSS 属性定义背景效果: background-col...

  • CSS3 背景

    知识点: CSS3 背景图像区域CSS3 背景图像定位CSS3 背景图像大小CSS3 多重背景图像CSS3 背景属...

  • CSS背景

    CSS背景(background) 目标 理解背景的语法和作用CSS背景图片和插入图片的区别 应用通过CSS背景属...

  • 整理常用CSS

    字体属性:(font) CSS文字属性: CSS边框空白 CSS符号属性: CSS背景样式: 指定背景位置 CSS...

  • CSS样式-背景(background)

    CSS样式 css背景(background) CSS 可以添加背景颜色和背景图片, 以及来进行图片设置。 背景图...

  • CSS常用的属性和值

    CSS文本 CSS字体 CSS背景

  • CSS背景、文本、字体、链接、列表、轮廓

    CSS背景 CSS文本 CSS字体 CSS链接 CSS列表 CSS轮廓

  • CSS background背景

    CSS背景属性 CSS背景属性用于设置HTML元素的背景(填充),复合属性 background 可以用来设置背景...

  • HTML与CSS之CSS的常用属性设置

    CSS常用属性设置 背景 ​ CSS 背景属性用于定义HTML元素的背景效果 background-color ​...

网友评论

      本文标题:CSS的背景

      本文链接:https://www.haomeiwen.com/subject/ycysxktx.html