温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

CSS中怎么设置背景属性

发布时间:2022-03-02 11:15:22 来源:亿速云 阅读:144 作者:小新 栏目:web开发

这篇文章主要为大家展示了“CSS中怎么设置背景属性”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“CSS中怎么设置背景属性”这篇文章吧。

    背景相关属性主要有:

    background-color背景颜色

    background-image背景图片

    background-repeat是否平铺repeat(默认平铺)|repeat-x(水平平铺)|repeat-y(垂直平铺)|no-repeat(不平铺)

    background-position背景位置length(百分数)|position(topcenterbuttonleftright)一般两个一起用,如果至指定一个方向另一个方向默认为center,两种方法也可以混搭。方位名词没有顺序区分,而使用百分数时时有顺序的,先是水平后是垂直

    background-attachment背景固定还是滚动scroll|fixed

    background:背景颜色背景图片是否平铺背景固定还是滚动背景位置

    #p1{

    width:300px;

    height:300px;

    background-color:blue;/*默认是transparent透明的*/

    /*background-color:transparent;*/

    background-image:url(Images/2.jpg);

    background-repeat:no-repeat;/*不平铺,默认是水平垂直平铺*/

    /*background-repeat:repeat-y;*/

    /*background-repeat:repeat-x;*/

    /*background-position:rightbottom;*/

    background-position:10%center;

    background-attachment:fixed;

    }

    想要背景半透明在指定颜色时使用rgba(r,gb,a),a就是指明透明度

    p{

    width:100%;

    height:300px;

    background-color:rgba(0,0,0,0.6);

    }

    当要使用多张背景图片时使用background来指定多个url,每组之间用‘,’逗号隔开,若图片有重叠,则前一张覆盖后一张图片,但是整体背景颜色必须在最后一个url后指定。

    p{

    width:100%;

    height:300px;

    background:url(Images/2.jpg)no-repeatlefttop,url(Images/3.jpg)no-repeatrightbottomblue;

    }

以上是“CSS中怎么设置背景属性”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css
AI