随笔分类 -  CSS

阿里字体图标使用方法详解
摘要：阿里团队是让人非常佩服的团队，不仅仅是技术，更是理念。 字体图标是开发web常用的元素，阿里为前端开发人员准备了大量的，而且免费的字体图标库。现在就记录下如何使用阿里字体图标库的详细步骤。 1.打开阿里字体图标官方网页 2.在首页的搜索框中输入你想找的字体图标的关键字 注意：阿里的搜索框既支持 输入 阅读全文
posted @ 2020-09-08 17:41 天天向上吧 阅读(3629) 评论(0) 推荐(0)
Less使用笔记
摘要：一、Less是什么 Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。 二、Less安装 使用less，需要先安装less的包，我们使用node的npm来下载包： npm i less -g 需要注意的是，一定要-g全局安装 阅读全文
posted @ 2020-08-15 21:34 天天向上吧 阅读(845) 评论(0) 推荐(1)
Bootstrap4元素显示和隐藏
摘要：众所周知的原因，Bootstrap4.X跟Bootstrap3.X有了巨大变化。其中元素的隐藏与显示也完全变化了。这里不说原理，只记录下具体用法。 用法非常简单，把下面的类名复制到自己要隐藏或者显示的html标签的class属性里就行了。具体的类和作用见下图表： That is all 阅读全文
posted @ 2020-08-11 22:42 天天向上吧 阅读(586) 评论(0) 推荐(0)
详解：cssrem插件 -- VS Code px转rem神器
摘要：在移动端开发时，我们常常要使用rem适配页面元素大小。那么如何把px转为rem单位就是必做的换算。我们有2种方式快速的解决这个问题： 1.使用less，因为less支持变量和运算。 2.使用VS Code的第三方插件：cssrem，它能自动帮我们把px为单位的数据，转换成rem单位的数据 接下来就介 阅读全文
posted @ 2020-08-03 00:41 天天向上吧 阅读(8002) 评论(0) 推荐(1)
关于position：fixed的注意点
摘要：position: fixed是CSS固定定位，一般用于导航栏吸顶效果。该属性使用的时候要注意一些细节： 1.固定定位的盒子必须有宽度 也就是必须设置width，如果没有设置宽度，那么该盒子的宽度就是内容撑开的宽度，如果没有内容那么会默认为0，从而无法在页面上看到。由于固定定位一般用于导航栏吸顶效果 阅读全文
posted @ 2020-07-30 20:06 天天向上吧 阅读(21721) 评论(1) 推荐(3)
详解animate.css动画插件用法
摘要：animate.css是一个以CSS3的animation制作的一个动画效果的CSS集合，里面预设了很多种常用的动画，且使用非常简单，本文用来介绍该插件如何使用。 第一步： 下载animate.css文件，这个非常容易获得，就不多说了。 第二步： 在你的HTML页面中导入这个文件，例如：<link 阅读全文
posted @ 2018-12-26 16:24 天天向上吧 阅读(2888) 评论(0) 推荐(0)
图片去除下间隙（图片3像素）的方法
摘要：一、提出问题 在浏览器中，图片有一个下间隙问题，有人也称之为图片3像素BUG。如下图： ，这是放大过的效果。我们可以清晰的看到，图片明显没有跟文字的最底部对齐，比如字母g，就比图片的底部更下探出一截。 这里需要澄清一下： 1.这并不是什么浏览器bug，而只是英文字母书写时有个基线的问题，基线决定了图 阅读全文
posted @ 2018-10-29 23:27 天天向上吧 阅读(3629) 评论(0) 推荐(0)