CarsonIT

今天写一个效果，其中用到Canvas，但是总有一个4像素在其中作怪，实在不知道啥原因，最后一搜索，发现有人和我一样，这里做个记录。

我目的是写个效果，其中用到了canvas画个动画，大致结构如下：

<body>
    <div>
        <canvas width="500" height="150"></canvas>
    </div>
</body>

最后发现div老是比canvas高出4像素，导致这个div下方留出4像素空白区域。

以至于加了如下样式也不行

        * {
            margin: 0px;
            padding: 0px;
        }

开始没在意，多出4像素，那么直接加一个负4像素来搞定。

div{
    margin-bottom:-4px;
}

但是我发现到其他浏览器之后，这负4像素又把下方的dom给挡住了，看来不是这么搞的。

面向百度编程一搜发现下方的文章：

https://segmentfault.com/q/1010000009638782

微信截图_20201121214812.png

主要原因如下：

解决方案有两种方法：

canvas{
         display: block;
       }

div{
      font-size: 0;
    }

CarsonIT 微信扫码关注公众号策略、创意、技术

留下您的脚步

最近评论

站点统计

总文章数：276 总分类数：18 总评论数：91 总浏览数：232.08万

精选推荐

阅读排行

新版微信JsSdk自定义分享的js调用

自定义微信分享还是很有必要，可以让你的分享样式更符合业务需要。也能统计大概分享了多少次，这个分享成功回调的bug，不知道微信啥时候解决，只需要进入到好友列表页面，这次分享就算是成功的了，难道不是发出去才算成功吗，肯定是那个技术人员偷懒了。

GDI+将图片以圆形画到背景上

我遇到多次需要将图片以圆形的方式画到背景图上，比如头像、图标等，本文就记录了完整的解决方案。

jquery判断checkbox是否选中及改变checkbox状态

前端开发过程中的技巧收藏，备忘，没事来翻一翻！

霸气侧漏的壁纸

老夫PC壁纸，就是觉得好看，胜美被骂扭曲

.NET C# 检查网络文件是否存在

检查本地文件就不说了，每个语言都有，这篇文章记录下，如何用C#语言判断远程文件是否存在。

Xml序列化和反序列化

在电子计算机中，标记指计算机所能理解的信息符号，通过此种标记，计算机之间可以处理包含各种的信息比如文章等。它可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。它非常适合万维网传输，提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。是Internet环境中跨平台的、依赖于内容的技术，也是当今处理分布式结构信息的有效工具。早在1998年，W3C就发布了XML1.0规范，使用它来简化Internet的文档信息传输。

SqlServer批量替换字段字符

SqlServer批量替换字段字符，有时候一张表的某个字段中集体出现某个字符或者错误，需要修正的时候，可以利用本文介绍的方式直接一键修改。

.NetCore静态文件

静态文件就是web服务器允许直接访问或者下载的文件，一般常用的有javascript文件、css文件、image图片、其他下载的文档或者文件等，本文主要介绍一下.netCore中，如何操作和使用静态文件。

数据库查询实现匹配度排序，最匹配的在第一条（MYSQL为例）

平时需求中，搜索数据，只要求存在关键字搜出来即可，如果需要让你把匹配度按顺序返回呢，你打算怎么实现呢？本文记录了我的实践，如果你有更好方案可以评论给我

坚果 Pro 细红线特别版 · 产品视频

你不懂我，我不怪你

每个人都有一个死角，自己走不出来，别人也闯不进去。我把最深沉的秘密放在那里。你不懂我，我不怪你。

配置中心-Apollo安装（CentOS 7.5 ）

Apollo（阿波罗）是携程框架部门研发的分布式配置中心，能够集中化管理应用不同环境、不同集群的配置，配置修改后能够实时推送到应用端，并且具备规范的权限、流程治理等特性，适用于微服务配置管理场景。服务端基于Spring Boot和Spring Cloud开发，打包后可以直接运行，不需要额外安装Tomcat等应用容器。Java客户端不依赖任何框架，能够运行于所有Java运行时环境，同时对Spring/Spring Boot环境也有较好的支持。

利用WinRAR自解压功能打包exe文件

WinRAR是我们电脑上常用的解压缩软件，功能强大，体积小巧，我们平时用的最多的就是压缩成zip和rar文件，实际上还支持很多种格式，今天说一下exe格式

七牛云对象存储JS SDK使用录

本文介绍一下七牛云jssdk的对象存储，上传token由后端服务提供，可以实现进度条效果。

首次发布网站IIS注册

首次发布网站IIS注册，IIS必须注册才可以使用，否则会出现找不到文件的错误提示，本文主要记录了注册的命令

PDF转图片，支持多种图片格式，可选清晰度

有时候会用到展示PDF文件，其中一种解决方案就是将其转换为图片，这次我把它抽离出来，做成了工具。支持多种图片格式，支持多种清晰度

MemCached与Redis的区别

MemCached与Redis都是缓存组件，但是他们俩还是有很多差别，那么我们什么时候选择MemCached?什么时候选择Redis？希望这篇文章可以帮你了解一下

微信开发准备，内网穿透

微信开发准备，内网穿透，可以让我们直接外网操作程序，本地调试程序，微信开发的神器。内网穿透无非端口转发，仅可用用于测试，生成环境不稳定，肯定会出幺蛾子

NPOI导出Excel，包含一个或者多个sheet表

NPOI是指构建在POI 3.x版本之上的一个程序，NPOI可以在没有安装Office的情况下对Word或Excel文档进行读写操作。NPOI是一个开源的C#读写Excel、WORD等微软OLE2组件文档的项目。他导出的文件和你电脑右键创建的office文件一样原生，不会提示格式不符，重要的是不依赖office组件。

MYSQL版本的四级联动省市区街道数据

网上这类数据很多，大多数都不是很全，特别是新疆、南海相关的地区和区，基本上都有问题，本文主要分享相对而言，比较全面的省市区街道四级数据。

疫情数据关注工具-支持全平台版本(12月15停止更新，一个时代的结束)

疫情形式严峻，我十分关心每天的疫情动态，但是我发现无论是百度的疫情动态，还是腾讯的动态，数据都不完整，而且腾讯的风险地区更新不及时，导致经常看到错误数据。

.NET WebApi配置Swagger详细教程

Swagger可以根据xml文件生成api接口文档，前后端节约沟通时间，减少对接成本，是一个非常好的解决方案；本文主要记录一下，Vs2019从0开始，搭建一个WebApi最终利用Swagger看到相关接口，并解决Swagger汉化的问题，解决Swagger在.net Webapi中控制器名称标注问题。

《灵笼》白月魁壁纸

国漫《灵笼》特别篇播出，作为第一季的大结局剧情，灵笼在最后一话的特别篇中终于把地面神秘人物白月魁的身份信息给揭露了出来，原来之前马克队长猜得没有错，当时在下到地面采集物资的时候，看到的女子其实就是白月魁小队，她们是生活在地面的人类，但是从本质而言，似乎已经和人类有所区别。

Resharper 2021.3.2-VS2022可用的扩展插件

ReSharper是一个JetBrains公司出品的著名的代码生成工具。其能帮助Microsoft Visual Studio成为一个更佳的IDE，它包括一系列丰富的能大大增加C#和Visual Basic .net开发者生产力的特征。使用ReSharper，你可以进行深度代码分析，智能代码协助，实时错误代码高亮显示，解决方案范围内代码分析，快速代码更正，一步完成代码格式化和清理，业界领先的自动代码重构，高级的集成单元测试方案，和强大的解决方案内导航和搜索。实质上，ReSharper特征可用于C#，VB.NET，XML，ASP.NET，XAML，和构建脚本。ReSharper还为C#和VB.NET提供了增强的交叉语言功能，它使开发者可以有效的控制.net混合项目。

Hangfire任务调度从入门到实践

Hangfire是一个任务调度的组件，自带面板，可以操作正在运作的任务，可以看到执行情况，而且使用起来简单，Hangfire不受特定.NET应用程序类型的限制，只要是.NET Framework 4.5以上，Newtonsoft.Json library ≥ 5.0.1，有一个mysql或者mssql数据库即可。而且最新的支持.NET Core,这篇文章主要记录一下如何在.NET Core 3.1中用mysql来帮助Hangfire实现持久化。

EFcore+MySql 数据迁移的时候，怎么给表结构加注释？

Microsoft.EntityFrameworkCore是一个非常不错的设计，当一套系统里面出现太多的SQL，其实已经不合理了，所以EF让开发者不再接触SQL，而是直接以对象形式操作数据库，EF来负责Sql代码生成和执行，通常在开发中，有根据数据表结构来生成实体的，也有根据实体生成数据库的，就是所谓的DbFirst和CodeFirst，这篇文章主要说一下CodeFirst的应用，用的是MySql数据库。

可能是最简单的控制台输出二维码

二维码使用场景很广泛，最近遇到需要在控制台输出二维码，但是其中遇到一些问题，导致代码正常，但是显示确不正常，本文给出的代码已经完全解决了这些问题，而且非常简洁。

.NET5 WebApi 实现JWT及其验证实战

Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于JSON的开放标准（(RFC 7519).该token被设计为紧凑且安全的，特别适用于分布式站点的单点登录（SSO）场景。JWT的声明一般被用来在身份提供者和服务提供者间传递被认证的用户身份信息，以便于从资源服务器获取资源，也可以增加一些额外的其它业务逻辑所必须的声明信息，该token也可直接被用于认证，也可被加密。本文只是举个例子，可以这么整，如果要用于生产环境，可能得再封装一下，注释都加的齐全，没用过的可以看看。

m3u8视频下载器3.8.1

之所以推荐这个下载器，不光是因为他能下载大多数场景下的m3u8的视频，主要是还支持http接口进行新增任务。

阿里云对象存储OSS使用STS临时授权给Browser.js

阿里云对象存储OSS（Object Storage Service）是阿里云提供的海量、安全、低成本、高可靠的云存储服务。其数据设计持久性不低于99.9999999999%（12个9），服务可用性（或业务连续性）不低于99.995%。OSS具有与平台无关的RESTful API接口，您可以在任何应用、任何时间、任何地点存储和访问任意类型的数据。如果你的应用场景仅仅是网站上传个图片、视频这些，那么阿里云OSS和七牛云的作用是一样的。

Visual Studio生成注释的插件GhostDoc，支持2022

GhostDoc为Visual Studio中的C#代码编辑器安装了一个新的命令。在编辑源文件时，只需将光标置于要添加文档的方法或属性内部，然后通过热键（默认为Ctrl+Shift+D）或右键菜单中的Document this菜单项调用命令，GhostDoc就会插入一段XML格式的注释。你也许会想到在方法或属性前面键入"///"时的类似效果，但是后者只能创建一段空的注释构造，而GhostDoc则能够生成大部分实用的注释。