在IE4开始微软就已经开始支持在线字体，不过没有流行起来，直到CSS3新增加了font-face模块，正式纳入了web开发的标准。也渐渐流行起来而且发掘了很多其他应用。 1. 为什么要用在线字体 问题 精灵图（雪碧图）用作背景的时候不能轻易的放大缩小。 低质量的位图在高清设备上放大后会有难看的锯齿，无法满足响应式页面的开发需求 在线字体带来的革命： 在线字体本质就是文字，但是也可是像图形的文字。节省了带宽（相比图片）字体文件大小也不大（一般几百k）。 在线字体本身是矢量的，放大缩小都不会失真 可以灵活的通过
前言：Bootstrap 简洁、直观、强悍、移动设备优先的前端开发框架,让web开发更迅速、简单 ，深入了解 Bootstrap 底层结构的关键部分,包括我们让 web 开发变得更好、更快， 组件无数可复用的组件,包括字体图标，在网页制作中我们经常用到小图标(icon),在Bootstrap中提供了很多这种小图标,在这篇内容中,我们把这套框架上的免费字体图标做了个小整合(当然,以后还会不断的更新) Font Awesome 官方网址 ：http://fontawesome.io/ http://font
本文主要介绍了在移动端网页开发中，如何利用web font和自定义字体实现字体图标。首先介绍了字体图标的原理和分类，然后介绍了如何在移动端网页中使用字体图标。最后列举了几个常用的字体图标工具，以及如何在这些工具中使用自定义字体。
在前面的一篇随笔《基于Metronic的Bootstrap开发框架经验总结（1）-框架总览及菜单模块的处理》介绍了菜单模块的处理，主要介绍如何动态从数据库里面获取记录并构建菜单列表。其中菜单信息的图标样式，也是从数据库里面获取的，因此要求我们能够动态取得Bootstrap里面的各种图标定义了。本篇主要介绍如何提取Bootstrap的图标信息，存储到数据库里面为我所用。 1、菜单的显示及各种Bootstrap图标 我们从下图可以看到，为了菜单的美观，每个菜单项（这里分了三级菜单）都有一个图标，虽然大小不同，我
如何在字体前面加图标？可以使用Bootstrap 框架的 glyphicon 类，可以基于项目的 Bootstrap 来免费使用Glyphicons Halflings 提供的图标库。 查看可以使用的图标列表https://www.runoob.com/try/demo_source/bootstrap3-glyph-icons.htm
我们已经在 环境安装 章节下载了 Bootstrap 3.x 版本，并理解了它的目录结构。在 fonts 文件夹内可以找到字体图标，它包含了下列这些文件：
Bootstrap 是由 Twitter 公司开发维护的简洁、直观、强悍的前端开发 UI 框架，它提供了大量编写好的 CSS 样式，允许开发者结合一定HTML 结构及JavaScript，快速编写功能完善的网页及常见交互效果，让web开发更迅速、简单。
bootstrap/ ├── less/ ├── js/ ├── fonts/ ├── dist/ │ ├── css/ │ ├── js/ │ └── fonts/ └── docs/ └── examples/
先上学习地址：http://www.htmleaf.com/Demo/201610234136.html 作者对轮播图左右按钮的处理方法一改往常，不是简单地用btn.prev+btn.next的图片代替，而是用纯css制作。 第一个是left按钮，即prev： .vmc-arrow-left:after { content: "\e079"; } 第二个是right按钮的，也就是next下一张的按钮： .vmc-arrow-right:after { content: "\e080"; }
Bootstrap ，基于 HTML 、 CSS 、 JAVASCRIPT 的 前端框架 。
*bootstrap.css 是完整的bootstrap样式表，未经压缩过的，可供开发的时候进行调试用 *bootstrap.min.css 是经过压缩后的bootstrap样式表，内容和bootstrap.css完全一样，但是把中间不必要的空格之类的东西都删掉了，所以文件大小会比bootstrap.css小，可以在部署网站的时候引用，如果引用了这个文件，就没必要引用bootstrap.css了，下面的文件同样。
图标列表：https://www.runoob.com/try/demo_source/bootstrap3-glyph-icons.htm
以前写过一篇 collapse 的简单应用： Bootstrap.Collapse
作为一名Web开发者而言，如果不借助任何前端框架，从零开始使用HTML和CSS来构建友好的页面是非常困难的。特别是对于Windows Form的开发者而言，更是难上加难。 正是由于这样的原因，Bootstrap诞生了。Twitter Bootstrap为开发者提供了丰富的CSS样式、组件、插件、响应式布局等。同时微软已经完全集成在ASP.NET MVC 模板中。 Bootstrap结构介绍 你可以通过http://getbootstrap.com.来下载最新版本的Bootstrap。 解压文件夹后，可以
Bootstrap是Twitter开源的基于HTML、CSS、JavaScript的前端框架。
Flask是python编写的， Web应用框架；微内核的web框架，适用于小型网站
响应式布局就是一个网站能够兼容多个终端，而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。
安装react-bootstrap（react-bootstrap标签自定义，属性和bootstrap相同）
图片是有诸多优点的，但是缺点很明显，比如图片不但增加了总文件的大小，还增加了很多额外的"http请求"，这都会大大降低网页的性能的。更重要的是图片不能很好的进行“缩放”，因为图片放大和缩小会失真。 我们后面会学习移动端响应式，很多情况下希望我们的图标是可以缩放的。此时，一个非常重要的技术出现了， 这就是字体图标（iconfont).
一直想着用bootstrap搭建网站，它的自适应、元素封装完善、现成的Glyphicons字体图标，省去很多的css、js、ui的工作，可以快速搭建一个客户需要的站点。ytkah自己有一些div+css的基础知识，所以上手bootstrap相对会比较快一些，从入手到完成项目只用了两周“学会”bootstrap搭建一个企业站，中间还有其他的一些事需要处理。当然做得比较粗糙，效果图在文章尾部。 国内的企业站一般都喜欢这样的版式：头部导航、幻灯片banner、次导航、文章列表、tag标签、转化引导、主业分
Bootstrap前端框架确实方便很多，比如需要实现简单的重点文字说明可以使用内置的样式即可。这几天老蒋中午休息的时候把官方的文档打开看看，有些之前不是特别常用的有些忘记，且有些好的功能和应用还是需要用到笔记记录下来，这样以后翻阅的时候容易找到。
Copying '/opt/jumpserver/apps/static/fonts/FontAwesome.otf' Copying '/opt/jumpserver/apps/static/fonts/fontawesome-webfont.eot' Copying '/opt/jumpserver/apps/static/fonts/fontawesome-webfont.svg' Copying '/opt/jumpserver/apps/static/fonts/fontawesome-webfont.ttf' Copying '/opt/jumpserver/apps/static/fonts/fontawesome-webfont.woff' Copying '/opt/jumpserver/apps/static/fonts/fontawesome-webfont.woff2' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.eot' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.svg' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.ttf' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.woff' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.woff2' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.css' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.eot' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.js' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.svg' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.ttf' Copying '/opt/jumpserver/apps/static/fonts/font_otp/iconfont.woff' Copying '/opt/jumpserver/apps/static/img/authenticator_android.png' Copying '/opt/jumpserver/apps/static/img/authenticator_iphone.png' Copying '/opt/jumpserver/apps/static/img/facio.ico' Copying '/opt/jumpserver/apps/static/img/logo-text.png' Copying '/opt/jumpserver/apps/static/img/logo.png' Copying '/opt/jumpserver/apps/static/img/otp_auth.png' Copying '/opt/jumpserver/apps/static/img/root.png' Copying '/opt/jumpserver/apps/static/img/avatar/admin.png' Copying '/opt/jumpserver/apps/static/img/avatar/user.png' Copying '/opt/jumpserver/apps/static/js/angular-route.min.js' Copying '/opt/jumpserver/apps/static/js/angular.min.js' Copying '/opt/jumpserver/apps/static/js/bootstrap-dialog.js' Copying '/opt/jumpserver/apps/static/js/bootstrap.min.js' Copying '/opt/jumpserver/apps/static/js/inspinia.js' Copying '/opt/jumpserver/apps/static/js/jquery-2.1.1.j
我是一个程序员，不是设计师。我没有受过设计师的训练。我也没有读过关于设计的书籍。尽管如此，在数年的开发过程中，我学会了让自己的网站和应用看起来很专业。
标签具有默认样式，由浏览器所决定的，为了达到在各个主流内核的浏览器页面样式显示一致，会重置具有默认样式的标签，得到样式表，就是 reset.css / base.css
Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/css/font-awesome-4.0.3.css' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/css/highlight.css' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/css/jquery.json-view.min.css' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/fontawesome-webfont.eot' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/fontawesome-webfont.svg' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/fontawesome-webfont.ttf' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/fontawesome-webfont.woff' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/glyphicons-halflings-regular.eot' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/glyphicons-halflings-regular.svg' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/glyphicons-halflings-regular.ttf' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/glyphicons-halflings-regular.woff' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/fonts/glyphicons-halflings-regular.woff2' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/img/favicon.ico' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/img/grid.png' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/js/api.js' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/js/bootstrap.min.js' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/docs/js/highlight.pack.js' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/s
<meta http-equiv="x-ua-compatible" content="IE=edge">
今天写作时间太短，稍微探讨一下bower和brunch这两个web前端assets management的利器。 Bower 管理dependency一直是程序员的心病，从c语言一路走到现在，dependency hell一直存在，只不过工具的进步让程序员不用再困扰纠结这个问题。我们看各种语言的dependency management工具： go: go get ruby: gems / bundle python: pip / eggs java: maven haskell: cabel (我是装pa
前言 在写基于Spring Boot的高并发秒杀Demo的时候，遇到了一点问题，因此记录下来。 遇到的问题 1.当我们在resources目录下，创建fonts文件夹，把Bootstrap所需要的glyphicons-halflings-regular.ttf、glyphicons-halflings-regular.woff、glyphicons-halflings-regular.woff2字体格式文件拷贝进来。然后我们把项目通过maven打包成war包部署到tomcat中，浏览网页的时候会出现Fail
iconfont的使用：https://www.cnblogs.com/changxin7/p/11479216.html
display: none 为 无，隐藏元素 display: block 为 显示元素 转换为块级元素
Bootstrap 3 与 4 差别很大，目录文件结构、所引入的内容也不同，这里说说一下 Bootstrap 引入的文件、网页模板和兼容性问题。本网站刚刚搭建好，正好发一下文章原来测试网站。
相当于C#UI里面的容器系统，bootstrap对css进行扩展，使用了类似less文件中的变量定义，sacc不仅增加了变量还多了继承、混合、嵌套等功能
近期正在探索前端、后端、系统端各类常用组件与工具，对其一些常见的组件进行再次整理一下，形成标准化组件专题，后续该专题将包含各类语言中的一些常用组件。欢迎大家进行持续关注。
对于开发人员来说，终端是最重要的工具之一。掌握终端，能够有效的提升开发人员的工作流程。使用终端，许多日常任务都被简化为了编写简单的命令并按下 Enter 按钮。
本文将会比较其中五个最佳的框架。每个框架都有自己的优点和缺点，以及具体的应用领域，你可以根据自己的具体项目需求进行选择。此外，许多选项都是模块化的，允许你仅使用所需的组件，甚至可以混合使用来自不同框架的组件。
一、表单（Form） 源码文件： _form.scss mixins/_form.scss 1、按层次结构分：form-group -> form-control/input-group/form-static-control -> 各类标签 2、Form-group/form-control/input-group/form-static-control之类的容器，分为两种显示方式：block、inline-block。而实现input-group水平用的是table-cell。 .input-gr
Visual Studio Code 是由微软开发的一款免费、跨平台的文本编辑器。由于其卓越的性能和丰富的功能，它很快就受到了大家的喜爱。
Bootstrap介绍 Bootstrap是Twitter开源的基于HTML、CSS、JavaScript的前端框架。 它是为实现快速开发Web应用程序而设计的一套前端工具包。 它支持响应式布局，并且在V3版本之后坚持移动设备优先。 为什么要使用Bootstrap？ 在Bootstrap出现之前： 命名：重复、复杂、无意义（想个名字费劲） 样式：重复、冗余、不规范、不和谐 页面：错乱、不规范、不和谐 在使用Bootstrap之后： 各种命名都统一并且规范化。 页面风格统一，画面和谐。 Bootstrap下载
什么是字体图标？ 答:字体图标是在 Web 项目中使用的图标字体,可以通过基于项目的 Bootstrap 来免费使用这些图标。
在开发者的弹药箱里，命令行是最具生产力的工具之一。掌握它们可以给你的工作流程带来非常积极的影响。因为，许多日常任务都可以用一条命令然后按回车来解决。
终端CMD 是开发人员工具中最重要的提高生产力工具之一。掌握它可以对你的工作流程产生非常有用的帮助。
☑ 简单灵活可用于架构流行的用户界面和交互接口的html、css、javascript工具集。
1.语言设置 Windows、Linux 快捷键是：ctrl+shift+p macOS 快捷键是：command + shift + p 搜索:Configore Display Language 修改"locale":"en"为"locale":"zh-CN" 然后安装中文插件,重启vscode 即可
``` ├─ /weijinsuo/ ··················· 项目所在目录 └─┬─ /css/ ······················· 我们自己的CSS文件 ├─ /font/ ······················ 使用到的字体文件 ├─ /img/ ······················· 使用到的图片文件 ├─ /js/ ························ 自己写的JS脚步 ├─ /lib/ ······················· 从第三方下载回来的库【只用不改】 ├─ /favicon.ico ················ 站点图标 └─ /index.html ················· 入口文件
在前端开发中，有一个非常好用的工具，Visual Studio Code，简称VS code。
综上所述，.string属性用于提取单个元素的文本内容，而.text属性用于提取包括所有子元素的文本内容。
注意： 如果你设置了自定义字体，需要将上述代码中的 font-family: 定义为你的字体名称或删除，也就是直接使用下边的代码
在这一章，我们将开始使用Bootstrap的一些非常有用的HTML组件。诸如按钮、标题(headers)、导航菜单和评论系统的组件经常被用在网站上。通过组件，Bootstrap可以简单和快速的帮我们在网站上添加这些功能。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
