标签：1.5 src rem pad stylus 代码 box tom absolute
（1）先放出相应的代码，即：
1 <template> 2 <div class="search"> 3 <input class="search-input" type="text" placeholder="请输入..." /> 4 </div> 5 </template> 6 7 <script> 8 export default { 9 name: ‘hhh‘, 10 data () { 11 return { 12 value: ‘‘ 13 } 14 } 15 } 16 </script> 17 18 <style lang="stylus" scoped> 19 .search 20 background: #cccccc 21 height: 3rem 22 position: relative 23 .search-input 24 position: absolute 25 box-sizing: border-box 26 height: 1.5rem 27 line-height: 1.5rem 28 width: 100% 29 text-align: center //实现文字左右居中显示 30 border-radius: .36rem //出现圆角 31 padding: 0 .3rem 32 left: 0 33 top: 0 34 bottom: 0 35 right: 0 36 margin: auto 37 </style>
（2）将父元素设置为relative，子元素设置为absolute，同时让子元素的top、left等设置为0，最后将margin设置为auto，即可实现父元素方框中的input框上下对齐。
（3）将height和line-height设置为一样高，可以实现里面的文字上下对齐；
（4）同时设置box-sizing和padding可以实现input框中文字满了的时候不会溢出到边框
以下是效果图：
标签：1.5 src rem pad stylus 代码 box tom absolute
原文地址：https://www.cnblogs.com/lanyb009/p/9249438.html
