PaddleHub golang爬虫 vim canal安装 反射 bam tsql kubernetes tcp pip xsd vue论坛 vue代码规范 后台管理ui 后台界面模板 android实战项目 git视频教程 广告投放系统源码 ceb转换成pdf在线转换 matlab中axis matlab自然对数 python数据库 python课程 java编译 java介绍 java使用正则表达式 java时间类 java判断文件是否存在 java数组排序 java删除 java文件输入输出 linux镜像安装 java游戏制作 php开发教程 网页游戏开发入门 allowoverride 灼热峡谷 神剪辑教程 fireworks8序列号 云管家
当前位置: 首页 > 学习教程  > 

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_300041.shtml

附件下载

相关教程

    暂无相关的数据...

共有条评论 网友评论

验证码: 看不清楚?