Question

我正在尝试使用背景图像的div，右端的注册表单和左侧带有h1标记的div。

HTML code：

<html>
<title> GoToMy PC </title>
<head> <link rel="stylesheet" type="text/css" href="blah.css" /> </head>
<body>


<section class="imageform">

<div>
<h1> Heading text goes here </h1>
<h2> Sub text goes here </h2> 
</div>

 <form class="signup_form">


<label class="holder-text"> Your Name </label><br/><input class="field_height" type="text"   name="firstname" placeholder="First Name">  <input class="lastname" type="text" name="lastname" placeholder="Last Name"><br/>
<label class="holder-text">E-mail address</label><br/><input class="field_width_height" type="email" name="user_email"> <br/>
<label class="holder-text">Password</label><br/><input class="field_width_height" type="password" name="password" ><br/>
<label class="holder-text"> At least 8 characters with both letters and numbers </label><br/>


 </form>

</section>  <!--End of imageform section -->

表单显示在页面中但不浮动，带有h1标签的div位于页面底部，只有当屏幕宽度太小时，才会显示背景图像。

非常感谢任何帮助解决这个问题。

JSfiddle链接：http://jsfiddle.net/fwkqos0c/

Answer 1

我修复了你的代码。你正在实施很多垃圾css。如height: auto，则无需调用它。你也在调整利润而不是浮动。

我在div中添加了一个类，以便于阅读标题：

.title{
 float: left;
 display: block;
 width: 50%;
 color: white;
}

查看代码，如果您对我特别使用某些东西有任何疑问，请告诉我。

也可以使用渐变而不是图像轻松完成背景。

http://jsfiddle.net/fwkqos0c/2/

div与英雄形象，html形式和文本

1 个答案: