- 博客(269)
- 资源 (8)
- 收藏
- 关注
原创 【Flutter】文件选择器(file_picker)的用法
Flutter 没有提供内置的文件选择器,但社区内有人贡献了一个比较完整的解决方案——。的 API 简洁易用,支持全平台(Android / iOS / Mac / Linux / Windows),是我开发桌面应用时的首选。这边博客简单介绍它的基本用法并提供一个应用实例。
2024-03-20 23:56:07 2731
原创 【Flutter】导航组件 NavigationRail 的用法简介
以上就是可动态适配屏幕大小的 Scaffold 实现方案,完整代码可移步至 Flutter 官方示例代码。顶部还可以放置 Logo,但做设计时一定要注意,不要给用户造成「这是个按钮」的错觉。一起使用,为了让导航组件能够根据屏幕尺寸进行动态调整,我们来实现一个「自适应」的。如果超出最大数量,可以在顶部放一个菜单按钮,点击后弹出用模态对话框展示的二级导航。以上是我们从设计层面做出的解读,下面我们从代码层面看一下它的具体用法。从设计规范的角度来讲,导航数量最好控制在 3 到 7 个。用于展示页面的主要内容。
2024-03-19 23:36:24 1100
原创 如何用 Github Pages 免费部署静态站点
用 Jekyll 在 Github Pages 上免费部署一个静态网站,可用作个人博客、公司官网、产品宣传
2023-07-10 20:00:39 923
原创 Sass 基础教程——预处理器
这个版本的 Sass 语法一般称为 Sass,后来经过社区的不断努力,引入了新的语法,叫 SCSS,全称 Sassy CSS,预处理器也从 Ruby Sass,经过 LibSass,最终升级到了现在的 Dart Sass,也是我们本系列教程用到的版本。前面的教程已经介绍过,Sass 是 CSS 的扩展语言,也是一个预处理器,它可以将 Sass/SCSS 语法写成的脚本转化成 CSS 代码。但是这个脚本语言写成的样式表,并不能直接在浏览器中运行,必须转化成 CSS 才可以,实现这个转换的便是预处理器。
2022-10-20 11:45:36 601
原创 Sass 基础教程——语法
Sass 有两种语法,一种是缩进式,和 Ruby 有点像,另一种是大括号式,和 CSS 本身的语法很像。这两种语法要分开使用,不能混用,其中缩进式一般叫做 Sass,对应的文件后缀为,大括号式叫做 SCSS,对应的是。不过两种语法可以通过SCSS 的语法因为和 CSS 非常类似,学习成本比 Sass 低,目前已经成为主流。
2022-10-18 22:32:50 1218
原创 Sass 基础教程——安装
Sass 是一种 CSS 的扩展语言,也是一种脚本语言,需要转换成 CSS 才能在浏览器中使用。同时,Sass 还是一个预处理器(preprocessor),用于完成 Sass 代码到 CSS 代码的准换。所以,当我们谈论 Sass 时,除了指代它作为一门脚本语言的语法,还包括预处理器的概念。作为预处理器,它的安装方式有很多种,下面我们以目前最流行的 Dart Sass 为例,逐一介绍。
2022-10-18 20:54:57 2459
原创 CSS高级篇——变换 (transform)
本篇要介绍的属性是transform,它可以将 CSS 的盒子变换成另外的形状。我们知道,CSS 的盒子是方形的,从几何变换的角度来看,transform要做的是改变盒子在 x 轴和 y 轴上的坐标。
2022-10-04 09:27:12 1386
原创 CSS高级篇——过渡动画
CSS Transitions 让我们不写一行 JavaScript 代码也能实现过渡动画。当鼠标悬浮于某个链接时,它的颜色会从瞬间变化为。这个变化因为没有过渡,会显得特别生硬。有了transition动画效果就有了,当鼠标悬浮在链接上时,颜色会发生渐变,非常平滑。这里的transition表示所有的属性在半秒内完成线性过渡,没有延迟。注意,这么多渐变属性中,只有所以最简单的渐变可以写成。
2022-10-04 09:13:23 1611
原创 CSS高级篇——at规则 (at rules)
CSS 的 at 规则功能十分强大,有的可以引入(import)其它 CSS 文件,有的可以将 CSS 作用于特定媒体(media),有的可以加载字体(font)。at 规则以 “@” 开头。
2022-10-04 09:04:48 727
原创 CSS高级篇——HSL颜色
我们已经学习过——名称、RGB 以及 16 进制值。CSS3 又带来了另一种颜色定义方式——,三个字母分别表示色相(Hue)、饱和度(Saturation)和亮度(Lightness)。HSL 和 RGBa (“a” 表示 “alpha” 值) 适用于任何表示颜色的属性,例如color,,和box-shadow。
2022-10-04 09:02:05 1064
原创 CSS高级篇——更多选择器 (selectors)
前面我们学习过,,这几种选择器配合起来使用可以让我们精确定位 HTML 元素。本篇要介绍的几个功能更加强大。
2022-10-02 11:10:29 1168
原创 CSS进阶篇——伪元素 (pseudo elements)
伪元素(pseudo elements)和伪类(pseudo classes)非常相像,都是依附在选择器上使用。
2022-09-30 11:45:50 304
原创 CSS进阶篇——展示 (display)
HTML 元素最常用的展示方式有内联(inline)、区块(block)和不展示(none)。它们可以通过display属性来控制,对应的值分别为inline、block和none。
2022-09-30 11:42:09 719
原创 CSS进阶篇——具体性 (specificity)
如果同一个 HTML 元素上有多个 CSS 规则,当它们互相冲突时,浏览器会遵循一定的规则来找到最具体的那条规则,并舍弃与之冲突的其它规则。这个功能在 CSS 比较少的情况下,用处不大,因为几乎不会有冲突。但随着 CSS 越来越复杂,文件越来越多,发生冲突的可能性就会变大,这个功能就会变得很重要。
2022-09-30 11:36:02 330
原创 CSS进阶篇——背景图
还可以用于列表元素,甚至搜索框内展示图标也可以借此实现。属性可应用于绝大部分 HTML 元素,除了最常用的。CSS 的背景图片也有这个功能,但用法却截然不同。标签,可以用来展示图片,提高页面的丰富度。我们知道,html 有一个。
2022-09-30 11:33:25 151
原创 CSS进阶篇——伪类 (pseudo classes)
伪类(pseudo classes)要和选择器捆绑使用,用于表示某种状态(state)或关系(relation)。它的形式是「选择器:冒号:伪类」。
2022-09-29 18:17:04 623 1
原创 CSS进阶篇——类和ID选择器
在 CSS 基础教程中,我们学会了如何使用 HTML 选择器。这一篇我们继续讲解另外两种选择器 - class和 ID。有了它们,我们就可以为同一种 HTML 标签指定不同的样式。
2022-09-28 14:20:34 2339
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人