将页面分为两部分

我想将页面横向分为两部分。在上半部分，我想要一个形式，在下半部分我想要一个图像。但它不起作用。请帮帮我。将页面分为两部分

<!DOCTYPE html> 
<html> 
    <head> 
     <title>JN DIAMONDS</title> 
    </head> 
     <style>  
      #upper { 
       height:50%; 
      } 

      #lower { 
       height: 50%; 
       background-image: r1.jpg; 
      } 
     </style> 
    <body> 
     <div id="upper"> 

      <form align="center" method="POST" action="insert_rough.php"> 
       <fieldset> 
        <legend>JN Patel <b>Rough Diamond</b> Information</legend> 
        <br> 
        <input type="text" name="fname" placeholder="Name" required><br><br> 
        <input type="text" name="twait" placeholder="Total Rough Weight"><br><br> 
        <input type="text" name="cprice" placeholder="1 Carat Price"><br><br> 
        <input type="text" name="dprice" placeholder="Dollar Rate"><br><br> 
        <input type="text" name="date" placeholder="Payment Days" required><br><br> 
        <input type="image" src="submit.jpg" alt="Submit" width="90" height="35"><br> 
       </fieldset> 
     </div> 
     <body> 
      <div id="lower"></div> 
     </body> 
      </form> 
    </body> 
</html>

来源

2015-10-17 John

我编辑了您的文章以使其可以被人类阅读（这就是您将在这里找到的主要内容）。我很确定把一个'body'标签嵌入另一个标签是一个坏主意。 – sodawillow

我没有得到backgrund img..will你请帮助 – John

这两个身体标签？为什么？ –

所以我拿出额外的身体标签，并在窗体下添加一个图像。这是我认为你想要的一个工作代码。

http://codepen.io/anon/pen/epeWYQ?editors=100

<!DOCTYPE html> 
<html> 
    <head> 
     <title>JN DIAMONDS</title> 
    </head> 
     <style>  
      #upper { 
       height:50%; 
      } 

      #lower { 
       height: 50%; 
       background-image: r1.jpg; 
      } 
     </style> 
    <body> 
     <div id="upper"> 

      <form align="center" method="POST" action="insert_rough.php"> 
       <fieldset> 
        <legend>JN Patel <b>Rough Diamond</b> Information</legend> 
        <br> 
        <input type="text" name="fname" placeholder="Name" required><br><br> 
        <input type="text" name="twait" placeholder="Total Rough Weight"><br><br> 
        <input type="text" name="cprice" placeholder="1 Carat Price"><br><br> 
        <input type="text" name="dprice" placeholder="Dollar Rate"><br><br> 
        <input type="text" name="date" placeholder="Payment Days" required><br><br> 
        <input type="image" src="submit.jpg" alt="Submit" width="90" height="35"><br> 
       </fieldset> 
     </div> 

      <div id="lower"></div> 
      <img src="http://i.cdn.turner.com/asfix/repository//8a250ba13f865824013fc9db8b6b0400/thumbnail_8234390180613999969.jpg" alt="" /> 

      </form> 
    </body> 
</html>

您需要这就是为什么它不是，如果你将其链接到CSS的使用后台工作的图像标签：URL（./ IMG/r1.jpg）不重复;您需要将img文件夹名称更改为您要保存图像的文件夹名称。

来源

2015-10-17 13:25:57 GClinton

将页面分为两部分

回答

相关问题