java设计模式 Wendy iphone pdf 如何做网络营销推广 虚拟机 bitmap controller stream swiper vue响应式布局 java并发编程视频 ppt视频教程下载 seo计费系统 判断bigdecimal是否为空 python环境 destoon模板 python集合 python打开文件 python定义变量 java环境 java删除数组元素 java多态 java使用mysql java的包 java基础编程 java正则匹配数字 java网页 rewritebase 雪地求生 音频频谱分析软件 小米5c拆机 图片链接生成器 tftpd64 oxm c语言编程实例 0x00000057 spss22安装教程 微信小程序源代码 小米9截图
当前位置: 首页 > 学习教程  > 

bootstrap的两种在input框后面增加一个图标的方式

2020/10/16 17:43:27 文章标签: bootstrap文本框

第一种&#xff1a; <div class"input-group"><div class"input-icon-group"><div class"input-group" style"width:100%"><input type"text" class"form-control" placeholder""…

第一种:

<div class="input-group">
    <div class="input-icon-group">
        <div class="input-group" style="width:100%">
                <input type="text" class="form-control" placeholder="" value="${batchid}" data-clearbtn="true"/>
               <span class="input-group-addon"><i class="md md-center-focus-weak fa-lg"> </i></span> 
        </div>
    </div>
    <span class="input-group-btn">
         <button class="btn btn-primary" type="button">批号</button>
    </span>
</div>

 

第二种:

<div class="input-group">
    <div class="input-icon-group">
        <div class="input-group" style="width:100%">
           <input type="text" class="form-control" placeholder="" value="${batchid}" data-clearbtn="true">
               <span class="input-group-addon"><i class="md md-center-focus-weak fa-lg"> </i></span> 
           </input>
        </div>
   </div>
   <span class="input-group-btn">
            <button class="btn btn-primary" type="button">批号</button>
   </span>
</div>

最后结果都是:


本文链接: http://www.dtmao.cc/news_show_300042.shtml

附件下载

相关教程

    暂无相关的数据...

共有条评论 网友评论

验证码: 看不清楚?