在css3中怎样使背景颜色缩放,而边框不动

 我来答
九头草鸡
2017-08-14 · TA获得超过239个赞
知道小有建树答主
回答量:259
采纳率:0%
帮助的人:171万
展开全部

不知道CSS3 的 background-clip 属性是否能满足你的需求。这个属性可以规定背景的绘制区域,代码如下 :

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <style>
            .rect {
                width:120px;
                height:120px;
                border:1px solid #999;
                padding:5px;
                background-color:green;
                background-clip:content-box;
            }
        </style>
    </head>
    <body>
        <div class="rect"></div> 
    </body>
</html>

结果如下:

将 background-clip 属性值设置为 content-box 将背景内容裁剪到内容框,这样只要改变 padding 值就可以实现边框不动,颜色变动。

博思aippt
2024-07-20 广告
博思AIPPT是基于ai制作PPT的智能在线工具,它提供了4种AI制作PPT的方式,包括AI生成大纲、AI直接生成PPT、文本生成PPT、AI提炼word文档生成PPT,一站式集成多种AI生成PPT的方式,可满足办公用户的不同需求和使用场景... 点击进入详情页
本回答由博思aippt提供
尼漠dt
2017-07-02 · TA获得超过2432个赞
知道大有可为答主
回答量:2272
采纳率:0%
帮助的人:604万
展开全部
有几个CSS的属性要提一下:background-size:cover,这个CSS3的属性作用是把背景图像扩展至足够大,以使背景图像完全覆盖背景区域,背景图像的某些部分也许无法显示在背景定位区域中,如果不使用这个属性,在IE11和FireFox中缩放浏览器,背景图片会随之缩小,同时使用-webkit-background-size: cover和-o-background-size: cover兼容webkit内核浏览器和Opera浏览器;background-attachment属性设置背景图像是否固定或者随着页面的其余部分滚动,当设置为fixed时页面的其余部分滚动时,背景图像不会移动。
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
574642407
2016-04-23 · TA获得超过258个赞
知道小有建树答主
回答量:292
采纳率:0%
帮助的人:186万
展开全部
background-size:百分比
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2017-08-14
展开全部
background-clip: content-box | padding-box | border-box
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
坑啊没小猴咋行
2016-04-28 · 超过14用户采纳过TA的回答
知道答主
回答量:111
采纳率:0%
帮助的人:12.2万
展开全部
能再详细一点吗,描述的
追答
再详细一点吗
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 2条折叠回答
收起 更多回答(4)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式