界面设计

Skeleton.css源码解读，一个只有419行代码的CSS库

Vedu 发布于 2023-02-23

本文介绍 Skeleton 源码一共只有 419 行（加上注释和换行），非常适合用来学习。本文是根据我的学习过程来编写的，几乎每个章节都包含使用方法和源码分析。虽然现在大部分业务都不需要重复造轮子了，但对于小白来说，学习完 Skeleton 源码是能走出新手村的。本...

Vedu 发布于 2022-11-04

作为一名交互设计师，我经历过国内零售电商产品，后又从进口转战出口。用户群从国内用户变成欧美用户，一开始固执地保留着很多“中式”设计方式，导致我屡屡碰壁。其实中西方电商网站在体验设计上有很多显著差异，而造成这些差异的原因是非常值得讨论的。下面从几个区别点展开讨论，希望可以给大家带...

阅读(960)赞 (0)标签：电商网站

Vedu 发布于 2022-09-24

目前svelte.js框架已经受到越来越多的前端开发者的关注。但是基于svelte开发的UI组件库及后台管理系统却比较少。由于前段时间有开发一个svelte-ui组件库，所以趁着捣鼓了一个基础版的后台管理系统svelte-admin。 Svelte Ui Admin 基于 Sv...

Vedu 发布于 2022-09-21

本文分享一些非常好用的CSS代码片段，它们很短但功能强大。使用这些代码，我们可以立即提高网站的体验。下面是11个非常好用的CSS代码片段： 1. Scroll behavior平滑滚动 html { scroll-behavior: smooth; } 这行简单的代码可以避免编写...

阅读(3242)赞 (0)标签：CSS代码

Vedu 发布于 2021-10-11

一提起图标，大家可能第一个会想到PS、美工等词语，但很多小图标现在根本都不需要再打开PS了。 1、常见的括号（前进或后退“>” ） .arrow{ width:12rpx; height:12rpx; border-top:1px solid #999; border-r...

阅读(1285)赞 (0)标签：css

Vedu 发布于 2021-09-09

一个 CSS3 loading 动画库，简单易用，动画流畅，无论是学习还是使用，都很不错。关于 Loaders.css Loaders.css 是一个性能出色的 web 前端代码库，或者叫 CSS 库，因为它完全没有用到一行 js 代码或者图片，仅仅利用纯 CSS 就实现多种样...

阅读(1582)赞 (0)标签：Loaders.css

Vedu 发布于 2021-09-07

click的300ms延迟响应延迟是由双击缩放导致的，当用户点击一次屏幕之后，浏览器并不能立刻判断用户是确实要打开这个链接，还是想要双击操作。因此，移动端浏览器就等待了300ms，以判断用户是否再次点击了屏幕。问题：300ms的延迟无法接受！怎么解决？「禁止缩放」和「 ...

Vedu 发布于 2021-09-05

图像延迟加载想要得到更好的性能体验，只靠资源压缩与恰当的文件格式选型，是很难满足期望的。我们还需要针对资源加载过程进行优化。什么是延迟加载？下图是京东商城的手机端首页，当元素没有滑动到视线内时，图片src属性放置了一个很小的图片，init_src属性放置了真正的图片，只要当...

Vedu 发布于 2021-08-28

在前段时间的开发需求中，有一项uniapp H5和APP端接入支付宝功能的需求，虽然这项功能前端的工作并不多，但还是根据这次的开发经验和踩过的坑做一个分享。首先在对项目开启支付功能，在项目的manifest.json文件中勾选APP模块配置中的Payment支付模块，并且勾选支...

Vedu 发布于 2021-08-27

1、文字超出部分显示省略号单行文本的溢出显示省略号（一定要有宽度） p{ width:200rpx; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } 多行文本溢出显示省略号 p { display...

阅读(1265)赞 (0)标签：CSS样式