0

我正在尝试制作一个网页,其中包含三个具有相同背景的 div,一个在左上角(当您看起来像屏幕时),一个居中右下,一个左下角。我得到了左上角的工作并复制了相同的代码,只是改变了对齐方式。第二个只是将文本放在顶部,没有格式。这让我发疯了。

谢谢

  body {
   font-family:  Copperplate / Copperplate Gothic Light, sans-serif; 
  background-image: url(AAHbackground.jpg);
  background-size: cover;
}


    #welcome { 
    padding:   5px; 5px;5px; 5px;      
  padding-left:   10px;      
   margin:             10x 10x 10x 10x;
   text-align:  left;
   color: #191919;
  background-image:    url(Divbackgrounds.jpg);
  background-repeat:   no-repeat; 
  float: left;
  width: 350px;
 p style = "float: left;"
 color : #731D1D;
h1, h2 {
  color:               #FF0066;
 }

    #leed {
      padding:   5px; 5px;5px; 5px;      
  padding-right:   30px;      
   margin:   10x 10x 10x 10x;
   text-align:  center;
   color: #191919;
  background-image:    url(Divbackgrounds1.jpg);
  background-repeat:   no-repeat
  position: absolute; left: 100px; top: 100px;
  width: 350px;
   color : #731D1D;
   h1, h2 {
  color:               #FF0066;
 }

这就是问题所在。它似乎正在移动文本等,但没有将背景图像附加到它上面。这是HTML代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <link type="text/css" rel="stylesheet" href="AAHStylesheet.css"/>
<title>Appalachian </title>

</head>

<body>

 <div id ="welcome">
<h1> Title </h1>

 <p>text text text</p>


</div>

<div id ="leed">
  <h1>Header/h1>

 <p>text .</p>

</div>

 </body>
</html>

请帮忙 :)

4

1 回答 1

0

你可以看看CSS background-position 属性

于 2012-09-02T05:04:09.210 回答