CSS
ljw1412
这个作者很懒,什么都没留下…
展开
-
[ web前端 ] 使用 CSS Variables 实现主题切换
本文介绍了另一种实现主题功能的思路,简洁,使用原生Css实现。但是请注意兼容性! CSS Variables 变量声明使用两根连词线"--"表示变量,"$color"是属于Sass的语法,"@color"是属于Less的语法,为避免冲突css原生变量使用"--" // 声明变量 --color:#000; // 读取变量 var(--color) 兼容性 效果展示 源代码 <!DOCTYPE html> <html> <head>..原创 2020-07-10 18:35:32 · 1741 阅读 · 0 评论 -
[ scss | webpack ] 实现页面主题思路(2)
本文介绍了另一种实现主题功能的思路,是前一篇([ scss | webpack ] 实现页面主题思路)的扩展。 Demo源代码 此方法通过切换style的外部样式表链接实现。 效果图 Demo项目结构 |____src | |____styles # 页面样式 | | |____core.scss | |____themes # 主题变量 | | |____default.scss | | |____dark.scss | | |..原创 2020-07-10 18:12:44 · 586 阅读 · 0 评论 -
[ scss | webpack ] 实现页面主题思路
1. Demo文件结构 |____src | |____styles # 页面样式 | | |____core.scss | |____themes # 主题变量 | | |____default.scss | | |____dark.scss | | |____blue.scss | |____entry.js # 打包入口 |____webpack.config.js |____package.json 2. 页面样式与主题变量原创 2020-07-10 11:44:09 · 541 阅读 · 0 评论 -
[ sass/scss ] Sass 函数功能汇总
本文介绍Sass自备的字符串函数、数字函数、列表函数、Introspection函数、三元函数等等。 Sass函数1. 字符串函数unquote($string) 删除字符串中的引号quote($string) 给字符串添加引号to-upper-case($string) 将字符串小写字母转换为大写字母to-lower-case($string) 将字符串大写字母转换为小写字2. 数字函数percentage($value):将不带单位的数转换成百分比值round($value):将数值四舍五入,转换成.原创 2020-07-08 18:30:56 · 592 阅读 · 0 评论 -
[ css ] backdrop-filter 增加元素背后滤镜
backdrop-filter CSS 属性可以让你为一个元素后面区域添加图形效果(如模糊或颜色偏移)。 因为它适用于元素背后的所有元素,为了看到效果,必须使元素或其背景至少部分透明。 /* 关键词值 */ backdrop-filter: none; /* 指向 SVG 滤镜的 URL */ backdrop-filter: url(commonfilters.svg#filter); /* <filter-function> 滤镜函数值 */ backdrop-filter: bl.原创 2020-05-28 15:17:06 · 687 阅读 · 0 评论