APICloud学习笔记之div填充剩余
- 效果图
- html 代码
1 <header id="header"> 2 <div class="left" tapmode onclick="fnOpenCitySelectorFrame();"> 3 <div class="city" id="city">市北京市</div> 4 <div class="arrow" id="arrow"></div> 5 </div> 6 <div class="input-continer"> 7 <input class="search" type="text" > 8 </div> 9 10 </header>
- css 样式
1 header { 2 /*position: relative;*/ 3 width: 100%; 4 height:50px; 5 background-color: #e1017e; 6 clear: both; 7 display: flex; 8 }
1 .input-continer{ 2 float:right; 3 text-align:center; 4 margin-top:10px; 5 /*width:100%;*/ 6 background-color:#00897B; 7 flex: 1 1 0; 8 }
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步