【问题标题】:Aligning background image for a div element in css在css中对齐div元素的背景图像
【发布时间】:2015-08-14 02:41:55
【问题描述】:

所以我是 css 新手,并且一直在尝试开发一个基本网站作为一个大学项目,但是我在将 div 的背景图像与类名 mainhead 对齐时遇到问题,它在屏幕左侧留下了一个空白. 无论我设置什么宽度,左边都有一个空白区域。

我不知道该怎么做,我没有设置任何填充或边距,还指定了左:0px,但没有快乐。 我遇到问题的课程是主课程 这是代码,请帮忙!

.loginbox
{
    position: fixed;
    top: 0px;
    margin: 0px;
    left: 0px;
    font-weight: bold;
    background-color: #2C2C2C;
    text-align: right;
    width: 1370px;
    height: 40px;
}
.loginbut
{
    background-color: #2C2C2C;
    font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
    font-size: 100%;
    color: #c9c9c9;
    text-align: right;
    margin-right: 50px;
    margin-top: 5px;
    border-color: #2C2C2C;
    border-radius: 8px;
    top: 10px;
    text-decoration: none;
    outline: none !important;
}
.loginbut:hover
{
    background-color: #000000;
}
.mainhead
{
    background-image: url("grey.jpg");
    background-repeat: none;
    border: 1px solid black;
    font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
    top: 40px;
    width: 1360px;
    height: 170px;
    color: #c9c9c9;
    text-align: center;
}
.mainhead h1
{
    font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
    font-size: 300%;
}

【问题讨论】:

  • 您能否编辑您的帖子以包含一些 HTML,以便我可以看到 CSS 是如何链接到您的网站的?
  • 您要删除正文的默认边距吗? body { margin: 0; }
  • 尝试将 background-size:100% 100% 用于主头类

标签: html css web background-image css-position


【解决方案1】:

使用 background-position: center center;和背景尺寸:封面;并从主头上删除宽度。希望它应该工作

http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-size&preval=cover

【讨论】:

    【解决方案2】:

    尝试使用 Eric Meyer enter link description here 的重置代码,并将 .mainhead div 设置为 100%。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多