摘要：
前言 学平面设计有 2 种路线图 第 1 种: 平面设计 > 网页设计 > 交互设计 > UI/UX 设计 > 网页开发 (HTML/CSS/JS) > CMS (PHP/C#) > 数据库 > 服务器. 第 2 种: 上面的反过来. 我就属于第 2 种. 每次做网站就是等 designer Fig 阅读全文
posted @ 2022-02-13 12:19
兴杰
阅读(130)
评论(0)
推荐(0)
摘要：
前言 定位是 CSS 里蛮重要的一课. 图片黑影 (overlay), back to top button, header, footer 紧贴在屏幕上下方等效果都是靠 position 完成的. 参考: Youtube – #CSS 認識 Position 粤语 阮一峰 – CSS 定位详解 S 阅读全文
posted @ 2022-02-12 14:18
兴杰
阅读(180)
评论(0)
推荐(0)
摘要：
前言 HTML tag 有 100 多个, 有些是功能形的, 非用不可, 有些是为了语义化对 screen reader 友好 (给眼睛有残缺的人也可以获取清晰的网站信息). 语义化是很重要的, 有些人写 HTML 满满都是 div, 出来的效果用眼睛看确实没有区别. 但是用 screen read 阅读全文
posted @ 2022-02-11 15:42
兴杰
阅读(384)
评论(0)
推荐(0)
摘要：
介绍 它们类似 calc(). 用来通过 formula 输出一个值. 用于 font-size, width, height 之类的, 这些地方. 非常适合用来做 RWD 哦 (特别是 font-size). 参考: CSS中 min() max() clamp()函数及使用场景详解 Kevin 阅读全文
posted @ 2022-02-10 21:28
兴杰
阅读(251)
评论(0)
推荐(0)
摘要：
前言 之前就有写过关于 Retina 和 Responsive Image 响应式图片 (responsive image) Retina 显示屏 但写的太烂了, 所以有了后来的 屏幕, 打印, 分辨率, 物理像素, 逻辑像素, Retina, DPI, PPI 是什么? 和这一篇. 参考: 阮一峰 阅读全文
posted @ 2022-02-10 11:34
兴杰
阅读(1472)
评论(0)
推荐(0)
摘要：
前言 Media Query 是用来做 RWD 的, 类似 JS 的 if else. 写的多有伤管理, 所以要谨慎使用哦. 参考: Learn CSS Media Query In 7 Minutes https://css-tricks.com/logic-in-css-media-querie 阅读全文
posted @ 2022-02-10 10:23
兴杰
阅读(136)
评论(0)
推荐(0)
摘要：
前言 有一种布局方式叫 Layout Grid 网格布局. 在 Figma – Layout Grid 有介绍过. 在 RWD 概念篇 也有讲到过 要实现这种布局, 可以用 Flex 也可以用 Grid. Bootstrap 用的方法就是 Flex. Grid 出生在 Flex 之后, 所以先掌握 阅读全文
posted @ 2022-02-08 14:33
兴杰
阅读(512)
评论(0)
推荐(0)
摘要：
介绍 这篇 Tailwind CSS 的教程:Translating a Custom Design System to Tailwind CSS 充分的体现了什么是 Design System. 设计讲求原则, 一致性, 规律, 所以它需要对很多元素做规则, 这些就可以称为 Design Syst 阅读全文
posted @ 2022-02-07 10:00
兴杰
阅读(180)
评论(0)
推荐(0)
摘要：
前言 Web Design 很广很深. 我记得许多年前第一次想介入设计工作 (我是后端工程师), 我就上网搜索了一下. 就看见了乔布斯著名的一句话: Design is not just what it looks like and feels like. Design is how it work 阅读全文
posted @ 2022-02-06 22:35
兴杰
阅读(290)
评论(0)
推荐(0)
摘要：
前言 很多时候 CSS 未必是需要管理的, 比如做网站, Landing Page (类似宣传单). 很多时候做了 > 用了 > 丢 > 再做新的. 它没有 "维护" 的必要. 所以也就不需要搞什么 Sass 去做代码管理之类的. 反而需要的是快速开发. 而快速开发最快的方式就是只写 HTML 不写 阅读全文
posted @ 2022-02-06 22:27
兴杰
阅读(1105)
评论(0)
推荐(0)
浙公网安备 33010602011771号