CSS
20篇文章 · 0订阅
  • 网络字体的使用流程与原理✨
    认识Web字体、Web Fonts（网络字体）的工作原理、Web Fonts（网络字体）的使用过程、网络字体的兼容性、认识字体图标、字体图标的使用过程
    CSS
  • 巧妙实现带圆角的渐变边框
    这个问题本身不难，实现的方法也有一些，主要是有一些细节需要注意。 border-image 是 CSS 规范 CSS Backgrounds and Borders Module Level 3 (最新一版的关于 background 和 border 的官方规范) 新增的一个…
    CSS 前端
    巧妙实现带圆角的渐变边框
  • 【CSS进阶】巧用伪元素before和after制作绚丽效果
    所谓‘伪元素’，就是本身不存在的页面元素，HTML代码里并没有这样的元素，但在页面显示时，你却能看到这些本来不存在的元素发挥着作用。本文主要探究伪元素beforce和after的常用使用场景。 :before 选择器向选定的元素前插入内容。 使用content 属性来指定要插入…
    CSS
  • 兼容iphone x刘海的正确姿势
    ，我的天，等了这么久你给我看这个？码农慌得一批满地找新 iphone 的逻辑像素，然后想着怎么兼容这刘海和胡子。 其实对于 web 前端来说，刘海在绝大多数的场景下是可以不用处理的，因为 safari 或客户端（微信，手Q等）的 statusBar 已经替我们抹平了顶部刘海，我…
    CSS 安全 前端
  • 移动端1px的误差的原因及解决方案
    这句话说明viewport（视口）的宽度等于设备的宽度，初始缩放设为1，最大缩放设为1，不允许用户缩放。 手机适配存在一个完美viewport，分辨率相差很大的手机的viewport可能是相同的，这样是为了一套css可以在多个手机尺寸下显示同样的效果，viewport的好处就在…
    JavaScript
  • vue中的css深度选择器 :deep(<inner-selector>)、/deep/、>>>、::v-deep 到底是什么？
    如果你希望 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用深度选择器。
    Vue.js 前端
    vue中的css深度选择器 :deep(<inner-selector>)、/deep/、>>>、::v-deep 到底是什么？
  • 你真的理解@import和link引入样式的区别吗
    最近在做知识体系的复盘，在复盘的时候尽可能的查漏补缺。关于@import和link引入样式的区别网上有很多种说法。大致有如下几种，不过这其中会有我存疑的地方，我们可以一起来探讨一下。 @import是 CSS 提供的语法规则，只有导入样式表的作用；link是HTML提供的标签，…
    CSS
    你真的理解@import和link引入样式的区别吗
  • 如何理解data URL？
    canvas有一个非常常用的方法canvas.toDataURL()，它会将canvas转化为data URL的格式。 通常情况下这个data URL的类型为image。 现代浏览器将data url视作唯一的不透明来源，而不是负责导航的url。 data URL与传统的url…
    Canvas
    如何理解data URL？
  • css3 pointer-events 介绍
    css3 pointer-events pointer-events 是什么？ 顾名思义，pointer-events 是一个用于 HTML 指针事件的属性。 pointer-events 可以禁用 HTML 元素的 hover/focus/active 等动态效果。 默认值为 …
    前端 SVG CSS
  • 你知道雪碧图吗？有哪些优缺点？
    这道题实际上考的是前端性能优化的一个点。 雪碧图的英文是CSS Sprites。 其目的是将多张比较小的图片，合并到一张大的图片上面，大的图片背景透明，使用的时候，通过把该张图片当做背景图片，通过不同的 background-position定位来展示的那部分图片。 降低服务器…
    CSS