【问题标题】:Size the background color using使用大小调整背景颜色
【发布时间】:2014-07-01 05:19:28
【问题描述】:

我正在尝试缩放背景颜色。我有导航栏,我希望颜色从导航栏到底部。

我尝试过使用:

background-size: 80px 60px;

这不起作用,因为它仍在 100% 填充页面。也让每个人都知道我正在使用引导程序。

这是来自引导程序的 css:

body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color: #F5F5F5;
}

这些是我的 css 规则,它们覆盖引导 css 文件。

body {
    background-size: 80px 60px;
    background-repeat: no-repeat;
}

导航栏的左右边距始终为 15%,因此背景颜色的宽度必须为 70%。上边距为 0,因为它跟随顶部的图像。

如果我忘记提供信息,我会道歉,我会尽快添加所需的信息。

【问题讨论】:

标签: html css background background-color


【解决方案1】:

您无法调整背景颜色的大小,但您可以为渐变指定特定大小,该渐变被视为背景图像。

您可以这样做: http://jsfiddle.net/JkhCs/

body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color:transparent;
    background-image: -webkit-linear-gradient(red, red);
    background-image: linear-gradient(red, red);
    background-size:80px 80px;
    background-repeat:no-repeat;
}

【讨论】:

  • 还有没有办法把这个对齐到中间?还是调整左右边距?
  • 当然,背景位置:你的价值观;
  • 我正在尝试这个:背景大小:70% 100%;但是 100% 似乎不能正常工作,因为它没有从上到下填充它。我可以使用 10000px 但这不是一个很好的方法。
  • 非常感谢您的努力
【解决方案2】:

你知道backgroud-size:coverbackgroud-size:contain吗?

css3.infoW3Schools 上查看,太棒了。

【讨论】:

  • 我很清楚“W3Fools”,但谴责任何平淡的东西是愚蠢的。 “W3Fools”从来没有帮过我什么,“W3Schools”帮了我。你能说出这个特定的参考有什么问题吗?
猜你喜欢
  • 2013-06-08
  • 2016-03-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-11-23
相关资源
最近更新 更多