随笔分类 - 13.CSS
摘要：canvas 系列： Canvas 绘制图片不显示问题 Canvas 基础（一） Canvas 基础（二）—— 滚动条问题 一般在使用 canvas 的时候，都会设置为容器的宽高，这样可以撑满容器。 但是设置完成后总是会出现滚动条？怎么回事？ 复现问题 下面是 canvas 动态获取父级容器的宽高，
阅读全文
摘要：在一般的网站中都会有头部和页脚。 头部会一直固定在最上面位置。 页脚呢，当页面内容超出一屏时，页脚在内容最后，当不足一屏时，在页面最下面。 实现方式有很多。这里使用的是 position:sticky; sticky sticky 粘性定位。是css新增的一个position属性。 为什么说是粘性定
阅读全文
摘要：CSS 实现图片对比CSS 实现图片对比（二） 上一篇文章中，实现了图片的对比功能。按照设想是可以实现任意图片的对比（主要是指图片大小）。 后面找了几张 NSAS 历史影像图对比，发现有问题，图片太多的话，图片超出父容器。 下面是对代码进行了调整。 1、通过图片的宽高，和容器的最大宽高比较，设置图片
阅读全文
摘要：CSS 实现图片对比CSS 实现图片对比（二） 前言 要做的功能中有历史图片对比，查找后发现并没有可用的组件等。 通过查资料，实现的方式大体有两种： 1、使用 resize 2、通过设置遮盖的 width 在通过考量后，这里选择第二种方式实现。 实现 HTML 结构 这里包了多层，是想适应不同的大小
阅读全文
摘要：一、前言 最近的一个项目使用了新的框架，这个框架中使用了 Tailwind CSS。对这个 CSS 的框架不是很熟悉，所以在使用过程中会遇到一些问题。 对于这些问题记录下。 本文章主要介绍 Tailwind CSS 的安装、基本配置等。 二、安装 1、安装包 根据自己使用习惯是使用 npm 还是 y
阅读全文
