美文网首页
背景图片

背景图片

作者: xiadada | 来源:发表于2017-04-23 14:16 被阅读0次
给整体页面加背景色:background-color:blue

背景图与背景色都设置,优先显示背景图

用图片当做背景:

1.默认完全铺满:background-image:url(small.jpg)
2.水平方向铺满:background-repeat:repeat-x;
3.数值方向显示:background-repeat:repeat-y;
4.只显示一次:background-repeat:no-repeat;
5.定义背景图片随滚动轴的移动方式:background-attachment:
取值: scroll | fixed | inherit
scroll: 随着页面的滚动轴背景图片将移动
fixed: 随着页面的滚动轴背景图片不会移动
inherit: 继承

精确控制图片位置

background-position:水平,竖直;
background-position:center top;
background-position:right center ;
background-position:50px 50px;(像素精确控制)
计算机屏幕,左上角为原点, 往右为x正,往下为y正

利用div的盒子加上background-position,精准显示图片的某个位置
可以理解为背景图为一块幕布,div为一个小窗口

快速写入背景色与背景图

background: gray url(bg.png) no-repeat
先背景色,再背景图,再repeat,再attachment

相关文章

  • 设置背景图片及相关属性

    设置背景图片: 在CSS可以通过background-image: url();设置背景图片 控制背景图片的平铺方...

  • CSS(下篇

    background 是复合属性 背景颜色: 背景图片: 铺平的方式: 设置背景图片大小: 背景图片定位移动: 设...

  • uni-app 背景相关

    背景图片固定大小 :背景图片大小,背景图片资源路径,背景的平铺方式 background-size: 100% 1...

  • 小试牛刀

    background-repeat用于控制背景图片的 重复方式。 如果只设置背景图片默认背景图片将会使 用平铺的方...

  • CSS边框图片--跟着李南江学编程

    一、形成border背景图片的原理 边框不只可以设置颜色,还可以设置背景图片,当给边框设置背景图片后,backgr...

  • 背景

    background-color&background-image 背景颜色&背景图片 背景图片默认平铺显示,背景...

  • 2019-04-21

    背景图片:

  • CSS学习笔记(五)

    背景图片 1、backgroud-image:url()属性专门设置背景图片 2、backgroud-repeat...

  • CSS让背景图片居中显示的方法

    当我们的背景图片写成: 时,表示背景图片不重复,位置会默认为在div中居于左上角。例: 效果: 如果背景图片写成:...

  • 背景图片的使用

    设置背景图片

网友评论

      本文标题:背景图片

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