bootstrap4中使用fontawesome5.6.3
先下载fontawesome5.6.3,选择free for web,下载完解压,丢在资源目录下
<form action="">
<div class="form-group">
<div class="input-group">
<input
type="text"
class="form-control"
placeholder="请输入用户名" />
<div class="input-group-append">
<div class="input-group-text">
<i class="fa fa-user" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
<div class="formgroup">
<div class="input-group">
<input
type="password"
class="form-control"
placeholder="请输入密码" />
<div class="input-group-append">
<div class="input-group-text">
<i class="fa fa-lock" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
</form>
bootstrap4中使用fontawesome5.6.3的更多相关文章
- bootstrap4中bootstrap_treeview不显示图标原因以及解决办法
1.bootstrap4中bootstrap_treeview不显示图标原因 查看过大神的博客,经过自己试验,插件依赖: bootstrap/3.3.7 jquery/3.3.1 <link h ...
- 在webpack开发中利用bootstrap4中的字体图标
在webpack项目开发中,难免会需要一些图标,如果用到bootstrap4的话,就会碰到一些问,因为bootstrap 4.x版本把icon分离出来作为一个单独的项目open-iconic,所以cn ...
- Bootstrap4中栅格系统CSS中 col-sm-* col-md-* col-lg-*的意义以及当其同时具有col-xs-* col-sm-* col-md-* col-lg-*的含义
根据Bootstrap--Grid 中 col-sm-* col-md-* col-lg-* col-xl-*的意义: .col-sm-* 小屏幕 手机 (≥ 576px) .col-md-* 中等屏 ...
- 在用vue-cli4创建的vue2.x项目中通过vue-fontawesome使用fontawesome5
前言 本文写于2020年1月11日,仅提供最基本的引用方法,参考fontawesome5英文官方文档和vue-fontawesome英文官方文档. 正文 在vue项目中使用fontawesome5图标 ...
- Bootstrap4 网格系统
学习注意事项 col-*-* 第一个*是设备类型,第二个*是控件宽度的占比 屏幕被等分为12,col-1宽度是1/12,col-6宽度是50%,col-12宽度是100% 给应用了class的elem ...
- CSS、bootstrap4等相关疑难杂症
说明 本篇博客仅用于个人随笔,所以内容比较随意. 在bootstrap4中,引入样式后,按钮.输入框等组件的选取状态会出现黑色加重边框,该如何解决? 解决示例: input:focus{outline ...
- Tensorflow 官方版教程中文版
2015年11月9日,Google发布人工智能系统TensorFlow并宣布开源,同日,极客学院组织在线TensorFlow中文文档翻译.一个月后,30章文档全部翻译校对完成,上线并提供电子书下载,该 ...
- React开发项目例子
一.需求 1.分析:用react开发一个类似bootstrap4中的card组件http://v4-alpha.getbootstrap.com/components/card/,界面类似如下: 2. ...
- JqGrid分页按钮图标不显示的bug
开发中遇到的一个小问题,记录一下,如果有朋友也遇到了相同的问题,可以少走些弯路少花点时间. 如图: 分页插件使用了JqGrid,但是分页栏里出现了问题,上一页.下一页这些按钮的图标都显示为空,记得以前 ...
随机推荐
- 七、【Docker笔记】Docker中网络基础配置
一个系统一般都包含多个服务组件,这些大量的服务组件不可能放在同一个容器中,这就需要多个容器之间可以互相通信.Docker提供了两种方式来实现网络服务:映射容器端口到宿主主机.容器互联机制. 一.端口映 ...
- Spring Web Flow 笔记
在Spring 中配置 Web Flow <?xml version="1.0" encoding="UTF-8"?> <beans xmln ...
- 2017蓝桥杯算式900(C++C组)
题目:算式900 小明的作业本上有道思考题: 看下面的算式: (□□□□-□□□□)*□□=900 其中的小方块代表0~9的数字,这10个方块刚好包含了0~9中的所有数字. 注意:0不能作为某 ...
- Flask 入门(四)
url反转 当我学习到url反转的时候,看了一个人写的例子,如下: from flask import Flask,url_for app = Flask(__name__) @app.route ...
- javascript 入门 之select2选择本地数据
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <meta lan ...
- TP3快速入门
一.查询 D方法实例化模型类的时候通常是实例化某个具体的模型类,如果你仅仅是对数据表进行基本的CURD操作的话,使用M方法实例化的话,由于不需要加载具体的模型类,所以性能会更高. $map = arr ...
- 28.5 Integer-- int的包装类
* 由于基本数据类型只能做一些简单的操作和运算,所以Java为我们封装了基本数据类型,为每种基本数据类型提供了包装类 * 包装类就是封装了基本数据类型的类,为我们提供了更多复杂的方法和一些变量 * * ...
- Git应用详解第五讲:远程仓库Github与Git图形化界面
前言 前情提要:Git应用详解第四讲:版本回退的三种方式与stash 这一节将会介绍本地仓库与远程仓库的一些简单互动以及几款常用的Git图形化界面,让你更加方便地使用git. 一.Git裸库 简单来说 ...
- template_showpost
使用<a href='...'>name<\a>实现点击"name"与转向'...'网址的超链接操作 from django.shortcut import ...
- 修改Sysvol复制方式
最近博主在做公司的AD系统升级,首先在做AD系统升级前,一定要认真的调研!!!!在调研是否可升级的过程中 博主发现我司SYSVOL的复制方式还是FRS(没升级前公司是Windows server 20 ...