Bootstrap的粗体和斜体
适配器模式介绍
旧接口格式和使用者不兼容,中间加一个适配器转换接口
在生活中,我们有许多的适配器,例如iPhone7以后的耳机接口从3.5mm圆孔接口更改成为了苹果专属的 lightning接口。许多人以前的圆孔耳机就需要下面的一个适配器,才能够在自个儿新买的iPhone上面听歌。

在前端开发中,我们可能会遇见这样的场景:当我们试图调用某个模块或者对象的接口时,却发现这个接口的格式不符合我们的需求。这时有两种解决办法:
第一种办法:是修改原来的接口实现,但如果原来的代码很复杂,例如是一个库或框架,更改原代码就显得很不现实了
第二种办法:创建一个适配器,将原接口转换为客户希望的另一个接口,客户只需要使用适配器即可。
UML类图和代码示例
Client就是使用者,Target是使用者想要的接口,Adaptee是就的接口

class Adaptee {
specificRequest () {
return '德国标准插头'
}
}
class Target {
constructor () {
this.adaptee = new Adaptee()
}
request () {
let info = this.adaptee.specificRequest()
return `${info}—转换器—中国标准插头`
}
}
//测试
let target = new Target()
let res = target.request()
console.log(res)
设计原则验证
将旧接口和使用者进行分离,符合开放封闭原则
适配器模式的使用场景
在前端项目中,适配器模式的使用场景示例:封装旧接口,vue computed
封装旧接口


vue computed

Bootstrap的粗体和斜体的更多相关文章
- 使用FreeType实现矢量字体的粗体、斜体、描边、阴影效果
前言: Freetype是一个跨平台.开源的字体渲染器,网上很多文章介绍,本人就不啰嗦了.本文重点在于实现文章标题所属的各种效果,不是Freetype的基本使用方法介绍文档,所以对于Freetype不 ...
- 文字排版--粗体(font-weight)
我们还可以使用css样式来改变文字的样式:粗体.斜体.下划线.删除线,可以使用下面代码实现设置文字以粗体样式显示出来. p span{font-weight:bold;} 在这里大家可以看到,如果想为 ...
- openhtmltopdf 支持自定义字体、粗体
一.支持自定义字体 private static void renderPDF(String html, OutputStream outputStream) throws Exception { t ...
- 第十一篇 -- QMainWindow与QAction(斜体-粗体-下划线)
效果图: ui_mainWindow.py # -*- coding: utf-8 -*- # Form implementation generated from reading ui file ' ...
- idea 光标变成粗体且当前文件搜索功能无法使用的问题
今天安装了idea最新版,安装完成后发现光标变成了粗体,并且快捷键在使用时出现了问题,比如:ctrl+F搜索功能无法使用 经过反复修改配置也无法改善情况,后来一次重启看到下面小窗弹出有关vim的一个提 ...
- datagrid标题头粗体
//标题头粗体 //$("#R_datagrid .datagrid-header-row td div span").each(function (i, th) { ...
- chromium 34以后中文字体粗体渲染问题
估计不少人更新后都遇到这个情况了吧,粗体渲染如然变得很模糊,很奇怪,Google下说是字体实现方式变了,国内一些网站用的中文字体都是宋体,但是宋体本身没有粗体,Win下的粗体是微软自己通过某种方式实现 ...
- MathType编辑粗体空心字的技巧
在用MathType公式编辑器编辑公式时,由于不同的使用需要,会有不同的字体要求.如果是正式的论文中的公式,一般公式只要求数学的国际使用规定就可以了,而如果是用在ppt等这种演示的文稿中,所要用到的字 ...
- [修正] Firemonkey Android 文字斜粗体显示不全的问题
问题:Firemonkey Android 平台显示斜粗体文字时,文字右方会有显示不全的问题. 修正代码: 请将 FMX.FontGlyphs.Android.pas 复制到自己的工程目录下,再修改如 ...
随机推荐
- Unity-Animator深入系列---测试CrossFade和CrossFadeInFixedTime
回到 Animator深入系列总目录 CrossFade是按照动画的自身时间进行混合.如果动画10秒,混合持续时间0.2,会在2秒后混合完成 CrossFadeInFixedTime是按照实际时间进行 ...
- 测试-Unity修改权重
以下内容仅为猜想,只进行了初步验证 FBX骨骼中包含所绑定的顶点索引,导入Unity后,Unity会把层级树保存起来,然后实例化的时候映射过去 编辑器下权重信息本身不在fbx文件的meta里,不可修改 ...
- Poj(1220),hash
题目链接:http://poj.org/problem?id=1200 这个题,我真是无限MLE,RE,WA,太伤心了,还是写一下吧.题意很简单(英语很好读),最后看了一下金海峰的思路.果然,应该是我 ...
- JS 滚动效果
地址: https://github.com/aamirafridi/jQuery.Marquee <script language="JavaScript" src=&qu ...
- Acdream Chinese Girls' Amusement
A - Chinese Girls' Amusement Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Jav ...
- 推荐一款非常棒的谷歌插件---快速查看HTML页面元素的CSS样式
一.下载地址 http://chromecj.com/web-development/2015-05/456/download.html 二.简介 CssViewer是一款快速查看当前页面元素的CSS ...
- webkit和xcode
一.webkit下载地址:https://svn.webkit.org/repository/webkit/ 它的总大小为2.75G 二.xcode下载地址:http://adcdownload.ap ...
- C#实现ActiveX控件开发与部署
现在,我们手里已经有了这个控件包:QRCode.cab,下面我们编写一个测试的网页 <html> <head> <title>无标题页</title> ...
- jQuerySchool
jQUery
- CodeForces 508C Anya and Ghosts
Anya and Ghosts Time Limit:2000MS Memory Limit:262144KB 64bit IO Format:%I64d & %I64u S ...