好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

利用table实现页面实现移动端页面自适应表单_html/css_WEB-ITnose

为了实现如图所示的效果:

设置table的宽度为百分比的值,让其宽度随页面的宽度而改变。input占据整个td的宽度。
主要html代码如下:

 

主要的scss样式如下:

.form{  width: 96%;  margin: 0.3rem auto;  font-size: 0.7rem;  td{    height: 2.5rem;  }  input{    font-family: "Microsoft Yahei";    outline: none;    color: #d8d8d8;  }  input[type=text],input[type=phone],input[type=email]{    border: 1px solid #e10000;    height: 1.55rem;    line-height: 1.55rem;    padding-left: 0.4rem;    width: 100%;    box-sizing: border-box;    background: transparent;  } 

查看更多关于利用table实现页面实现移动端页面自适应表单_html/css_WEB-ITnose的详细内容...

  阅读:27次