摘要：
介绍 IntersectionObserver 的作用是监听某个元素是否出现在框内 (比如 viewport). 它可以实现 lazy load image, 一开始图片是没有加载的, 当图片出现在 viewport 时才去加载. 也可以用来做 tracking, 比如某个商品 (card 元素), 阅读全文
posted @ 2022-03-11 15:13
兴杰
阅读(442)
评论(0)
推荐(0)
摘要：
介绍 counter 有点像 JS 的 for loop index. 最常用到的地方就是做 ol > li. 参考: W3Schools – CSS Counters 默认 ol > li <ol> <li> Lorem ipsum dolor sit amet. Lorem ipsum dolo 阅读全文
posted @ 2022-03-10 23:21
兴杰
阅读(128)
评论(0)
推荐(0)
摘要：
效果 参考: Youtube – Responsive FAQ accordion dropdown | HTML and CSS Tutorial 几个难点 1. 如何 align left for +- icon. 2. 如何实现点击 3. 如何实现 slide down 一步一步做 Seman 阅读全文
posted @ 2022-03-10 14:49
兴杰
阅读(138)
评论(0)
推荐(0)
摘要：
效果 参考: Youtube – Responsive Navigation Menu Bar + Hamburger Menu Toggle - Only with CSS Youtube – Making an animated hamburger button and a challenge 阅读全文
posted @ 2022-03-08 22:20
兴杰
阅读(117)
评论(0)
推荐(0)
摘要：
前言 在网站嵌套 Facebook 专页是很好的推广方式哦. 虽然网站还是需要做 Blog, 但是通常被订阅的都是 Facebook 专页而不是网站 Blog. 开通账号 它的 setup 很简单, 去 developers.facebook.com 注册一个开发者账号, 然后做一个 App 给网站 阅读全文
posted @ 2022-03-06 15:08
兴杰
阅读(159)
评论(0)
推荐(0)
摘要：
前言 ul > li 经常会用到, 它原本的 style 很丑, 这篇介绍如果修改它. 以前学 W3Schools 的时候也有记入过: HTML – W3Schools 学习笔记 参考: Youtube – HTML & CSS for Beginners Part 17: How to Creat 阅读全文
posted @ 2022-03-05 18:17
兴杰
阅读(311)
评论(0)
推荐(0)
摘要：
前言 续上一篇介绍了各种语言的阅读方向. 这一篇来讲一下 Logical Properties. 它与 left to right, right to left, horizontal, vertical 息息相关. 参考: Youtube – Write better CSS using logi 阅读全文
posted @ 2022-03-05 14:10
兴杰
阅读(256)
评论(0)
推荐(0)
摘要：
前言 世界上有很多语言的阅读方向是不同的. 英文 中文 (以前才有竖排文字, 现在中文和英语一样了) 阿拉伯文 (Arabic) 面对不同的语言, HTML 和 CSS 就需要不同的写法. 虽然我没有做过类似的项目, 但是知识还是要有的, 正所谓 "没吃过猪肉，也见过猪跑" 嘛. 参考: HTML 阅读全文
posted @ 2022-03-05 10:33
兴杰
阅读(529)
评论(0)
推荐(0)
摘要：
前言 CSS 很早就有 build-in 方案 for 省略号 ellipsis 了. 但是只能 one line, 遇到多行的时候只能用 JS. 后来出了 line-clamp 终于把 multiple line ellipsis 解决了. 参考: stackoverflow – Limit te 阅读全文
posted @ 2022-03-03 15:42
兴杰
阅读(403)
评论(0)
推荐(0)
摘要：
前言 要让一个元素 "消失"，有 4 种做法。它们有一点点的不同，在实战时要清楚什么时候用什么哦。 例子说明 <div class="abc"> <div class="xyz"></div> </div> CSS Style .abc { border: 1px solid red; width: 阅读全文
posted @ 2022-03-02 18:22
兴杰
阅读(467)
评论(0)
推荐(0)
浙公网安备 33010602011771号