Question

这是我的两个输入字段，当我运行代码时，它显示它们之间的空格。谁能告诉我如何去除它们之间的空间？谢谢。

这是我写的全部代码，如果有任何帮助可以做，请告诉我，我会很感激再次感谢你。

    <!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

<style>

h6 {
     text-align: center;
   color:   #A7A7AF;
}
h5 {

    color: #A7A7AF;

}
.input {
  display: block;
    width: 100%;
}


.ui-bar-f {
    color: red;
    background-color: #476296;
}

.ui-body-f {
    font-weight: bold;
    color: white;
    background-color:#476296;
}


.ui-page-theme-f {
    background-color: #EBF0F3;
}
.create {
    opacity: 1;
    color: white;
    background-color: #5A9239;
}
.btn1 {
    opacity: 1;
    color: white;
    background-color: #476296;
}

</style>
</head>


<body>

<div data-role="page" data-theme="f">

  <div data-role="header" data-theme="f" class="ui-body-f">
    <h1>facebook</h1>
  </div>


  <h5 style=" margin:0px; color: #8C812F; background-color: #FFFFBE;">You must login first</h5>


<div data-role="main"  class="ui-content"  >
    <h4  style=" text-align: center; color: #476296; background-color: #FFFFBE;">Get Facebook for Android and browse faster</h4>
<h5>Already have an account ?</h5>


        <input type="text"  name="fullname" placeholder="Email" ><input type="text"  id="Password" placeholder="Password" >

         <a href="#"  type="button" style="input: margin: 0;" class="ui-btn btn1 ui-corner-all"   >Log In</a>

          <h5>New to facebook ?</h5>


          <a href="#" type="button"  style="input: margin: 0;" class="ui-btn create ui-corner-all"  >Create New Account</a>

          <h6 >Forget password    Help Centre</h6>
          <h6>Trouble login ?</h6>

</div>





  <div data-role="footer" style=" text-align: center; color: #A7A7AF;">
    <p> <i> <b><font color="#000000">English(US)</font> </b></i>  <font>.Espanol .portugese(Brazil) more..</font>  </p>
    <h3>Facebook©2003</h3>
  </div>
</div> 

</body>
</html>

you can see the input types are still not joined

谢谢。

Answer 1

喜欢这个......

<input type="text"  name="fullname" placeholder="Email" ><!--   
--><input type="text"  id="Password" placeholder="Password" >

（注意HTML评论）

或者这......

<input type="text"  name="fullname" placeholder="Email" ><input type="text"  id="Password" placeholder="Password" >

...例

<input type="text"  name="fullname" placeholder="Email" ><!--
--><input type="text"  id="Password" placeholder="Password" >  

<br>

<input type="text"  name="fullname" placeholder="Email" ><input type="text"  id="Password" placeholder="Password" >

修改

在新添加的代码中，空间来自这个Jquery移动CSS ......

.ui-input-text, .ui-input-search { margin: .5em 0; border-width: 1px; border-style: solid; }

您可以通过将此更具体的规则添加到您自己的CSS中来删除空间...

.ui-content .ui-input-text { margin: 0; }

EXAMPLE

Answer 2

<强>水平

<input type="text"  name="fullname" placeholder="Email">
<input type="text"  id="Password" placeholder="Password">

<强>垂直

<input type="text"  name="fullname" placeholder="Email"><br>
<input type="text"  id="Password" placeholder="Password">

我有两个输入字段，我不想在它们之间显示空格

2 个答案: