- 博客(94)
- 收藏
- 关注
原创 深入探讨 SVG 技巧和高级技术
在当今前端技术蓬勃发展的背景下,SVG 技术日益受到关注。深入浅出 SVG(https://s.juejin.cn/ds/ijDLa8J8/),探索其技巧与高级应用,就像漫步于一座神奇的数字王国,其中蕴藏着无限的创意和潜力。在这个动态的数字世界中,SVG 不仅是静态图像的集合,更是一种交互式、多功能的数字工具,可以为用户带来沉浸式的体验和令人惊叹的视觉效果。让我们一起深入了解 SVG,探索其中的奥...
2024-06-06 08:30:16 710
原创 来啦,来啦,这次我真的来啦!!!
来啦,来啦,这次真的来啦!历时半年之久的呕心力作来啦!《深入浅出 SVG》小册终于与大家见面了!在这个数字化时代,每个像素都承载着无限的可能性,而 SVG(Scalable Vector Graphics)作为矢量图形的代表,正是展现创意、提升用户体验的利器。无需担心,无论你是初学者还是已经有一定经验的开发者,这本小册都将为你打开 SVG 技术的奥秘之门。从基础概念到高级技巧,我们将手把手地引导你...
2024-05-31 08:30:39 879
原创 2023 年开始写 CSS 会与众不同(Part1)
CSS 的发展速度比以往任何时候都要快。在 Flexbox 和 Grid(https://s.juejin.cn/ds/i8TmVYNt/)之后,CSS 的发展似乎经历了一段漫长的停滞期,但在近几年,CSS 已经新增了许多新功能可用(https://s.juejin.cn/ds/i8Tmg379/),而且还会有更多新功能即将推出。这个发展速度是令人兴奋的,同时也有些压倒性。虽然 CSS 新增了很...
2024-01-08 12:50:31 1218
原创 图解CSS:揭开CSS的面纱
这是第二次重编《图解 CSS》,如果你对 CSS 最新特性感兴趣,请移步阅读《现代 CSS》(https://s.juejin.cn/ds/i8cbuotr/)!如果您对前端方面有所关注,那么对CSS一定不会陌生,你也肯定听说过一些CSS的新特性。在使用CSS新特性之前,你应该对这个新一代样式表语言的来龙去脉有个基本了解。在本章节中,你将知道一个CSS属性的制定将会经历哪些过程,为什么会有浏览器的...
2024-01-04 08:30:44 1086
原创 2023 年我与掘金小册结缘
2023 年就快结束了,大家都在为自己的一年做总结。在此之前我也有这样的习惯,比如我曾在自己的网站 w3cplus 为自己写过一些成长经历与总结,例如:我和W3cplus的故事走过的2013年辞旧迎新,更上一层前端路上的旅行码农的自留地七年之痒我在阿里的三年自此就只对 CSS 领域的会做一些总结:2020 年 CSS 有哪些新特性应用于下一代 Web 的样式2021 年你可能不知道的 CSS 特性...
2023-12-29 08:30:51 974
原创 现代 CSS 你知道多少
写在前面现代 CSS (Modern CSS)应该是 2023 年前端圈热门话题之一,在最近的 CSS Day 活动上也有这个话题。另外在社区中也不乏现代 CSS 的讨论以及如何使用现代 CSS 特性来编写和组织 CSS 代码,以及如何使用现代 CSS 技术更好的构建出可扩展,未来更友好的 Web 项目。我在还没有完成《现代 Web 布局》和 《防御式 CSS》小册的时候,就已经准备编写一本有关于...
2023-08-09 17:01:04 214
原创 CSS 颜色设置透明度的新姿势
在 CSS 中,我们有很多种方式为元素设置透明度,常见的是给元素设置透明度和给颜色设置透明度,不同的方式将会带来不一样的效果。那么今天,我们就一起来聊聊 CSS 中的不透明度。感兴趣的同学,请继续往下阅读。设计中的透明度我们先从设计中开始。就拿 Figma 这样的设计软件来举例。设计师在给一个对象设置透明度,往往会有以下几种方式:这两种方式中,第一种就是给整个对象(或图层)设置opacity,...
2023-06-05 11:30:51 1692
转载 防御式 CSS 精讲
直通链接!https://s.juejin.cn/ds/DEHQUMj/小册简介稍微老一点的前端工程师都应该知道,过去并没有“前端”的说法,而是叫重构(有的公司称为重构工程师,有些人自嘲是“切图仔”)。大多数的时候,重构工程师的主要工作内容是还原 UI 界面 ,即编写 HTML 结构(具有语义化的 HTML 结构)、编写 CSS(具有扩展性,可维护性)和切图等。 随着时代变迁,技术不断的革新,开发...
2023-05-11 09:36:22 189
转载 小册上新|CSS 高手大漠带你精通 Web 布局
随着 CSS 技术不断发展,尤其是这几年,可用于 Web 布局的特性明显增多。像多列布局(Multi-column)和 Flexbox, 已经是很成熟的技术。还有像 CSS 自定义属性、CSS 网格(它也很早就有了)、宽高比(aspect-ratio)、CSS 比较函数(min()、max()和clamp())、CSS 逻辑属性、CSS 书写模式 和 CSS 视窗单位等,近两年得到了主流浏览器...
2022-11-30 09:54:03 474
转载 W3cplus开启会员阅读
喜欢W3cplus网站的同学估计最近发现站上有一些文章需要付费阅读。是的,小站自从2019年05月10日开启了付费阅读。如果开启付费阅读给大家带来不便或不爽烦请谅解。为了...
2019-05-19 22:05:56 1032
转载 VueConf上海 还有26天,快手前端架构师将讲什么?
VueConf 2019上海(第三届VueConf)将于2019年6月8日在上海交通大学(徐汇校区)举办。大会网站:https://vue.w3ctech.com快手...
2019-05-13 20:55:32 384
转载 尤雨溪 视频讲解 VUE 3.0 新特性
2018 VUECONF 在杭州的举行,大会上邀请了 尤雨溪,蒋豪群,Andrey Sitnik,程劭非, 天翔,勾三股四,韦元悦,唐金州,卓凌,旷旭卿...
2019-01-04 08:30:00 1360
转载 FEDAY与React大会将于今天下午6点停止售票
中国首届React大会与第四届FEDAY将于2018年8月18日至19日在广州金逸影城太阳城店举办。离活动开始仅有5天,购票将于今天下午6点停止售票,如果您还在观望或犹豫...
2018-08-13 13:59:14 461
原创 聊聊CSS中的层叠相关概念
最近在纠结程序语言和设计语言中的一些概念,整到层叠上下文和图层相关的事情,然后发现自己对于CSS中的层叠相关的知识并没有自己想象中那样理解的透彻。因此花了一段时间重新梳理...
2018-08-07 23:44:44 743 1
转载 第七届iWeb峰会(HTML5峰会)议程曝光
由HTML5梦工场主办的第七届iWeb峰会(HTML5峰会)暨攻城师嘉年华,将于8月12日在北京国际会议中心隆重召开,为有效交流,今年限额2000人规模。本届峰会围绕“拥...
2018-08-07 23:44:44 894 1
转载 推荐几个前端学习号
如今前端技术更新迭代如此之快,想要在这个浪潮中保持有利地位、成为弄潮儿,就要持续不断的学习,下面搜罗了一些公众号供大家关注学习:hi-laser姬小光,作者从 2003 ...
2018-07-13 00:01:24 1599 1
原创 DOM系列:DOM操作小结
DOM是JavaScript的基础之一,自己学习DOM的操作也有一段时间了,到今天为止DOM系列的教程刚好有十篇了,这部分都主要是围绕DOM操作的笔记。主要围绕DOM元素...
2018-07-09 22:09:08 568
原创 DOM系列:动态添加CSS样式规则
在上一节中学习了如何通过JavaScript来修改CSS样式。简单地说:查询CSS样式(即计算样式),设置单个样式(设置的是行内样式),设置多个样式(通过类来设置样式)。...
2018-06-26 22:14:34 4288 1
原创 一个制作Web图案的组件:css-doodle
Web中使用一些图案做为背景图案是一种时常可见的,早期一般都是通过图片来完成。直至CSS一些新特性更趋成熟和稳定的时候,会通过CSS的相关技术,比如CSS的渐变属性配合b...
2018-06-22 00:00:27 1806
原创 制作Loading组件
最近项目中使用到一个Loading效果,其实是一个很简单的效果,主要是因为这个Loading出现在不同的场景之中,而且大小也不一致。对于这样的效果,往往都会想通过组件的方...
2018-06-21 00:36:13 1733
原创 DOM系列:样式和类
对于任何一位Web开发者而言,处理CSS样式很多时候还是会借助JavaScript。简单的说,我们会碰到一些交互(或UI效果的变化)都会通过JavaScript来处理st...
2018-06-08 00:49:57 956
转载 我在阿里的三年
时光如梭,转眼一逝,已经在阿里呆了三年了。在阿里有句话 —— 一年香,三年醇,五年陈。另外还有一句话就是说在阿里,要呆完三年才算是阿里人。自己非常的荣幸,有幸在阿里成功的...
2018-06-05 00:23:49 4768 2
转载 DOM系列:修改DOM
通过前面的学习,我们都知道,DOM并不一定要由存在于HTML中的元素组成。我们仅需要使用几行JavaScript代码就可以将HTML元素添加到你的DOM中。而且你也有能力...
2018-06-02 20:31:01 653
转载 DOM系列:Attribute和Property
这两天一直在看DOM元素的attribute和property,简单让人晕。从直译上,我一开始都理解为“属性”,而且对于我这样的新手,将两者混淆在一起,傻傻的分不清楚。后...
2018-05-29 23:23:36 810
转载 DOM系列:DOM节点属性
经过前几篇文章的学习,对DOM有一定的了解。但这仅仅是DOM一些基础性的知识,如果要对DOM更了解,需要更深入地了解DOM节点。在这一节中,咱们将围绕DOM的节点属性、标...
2018-05-26 01:11:25 655
转载 DOM系列:getElement* 和 querySelector*
在上一节中,我们学习了DOM树和遍历DOM相关的知识。可以通过firstChild(或firstElementChild)、lastChild(或lastElementC...
2018-05-24 21:40:18 910
转载 DOM系列:DOM树和遍历DOM
上一节,咱们整理了DOM系列中的第一篇,主要介绍浏览器与DOM相关的知识。从标题中我们可以看出来,今...
2018-05-22 23:47:36 2492 1
转载 DOM系列:浏览器与DOM 主标签
最近回过头来在学习JavaScript中的DOM知识,随着学习进度的向前推移,越发感觉DOM知识点较...
2018-05-17 22:34:38 1070
原创 querySelectorAll 和 getElementsByTagName区别
在《DOM的操作》一节中知道querySelectorAll()和getElementsByTagName()两个方法都是用来查找DOM元素的。通过上一节的学习,知道qu...
2018-05-04 00:00:00 6483 3
原创 JavaScript学习笔记:动态集合
DOM是JavaScript中重要部分之一,在DOM中有一个动态集合。这个动态集合包含节点的集合(NodeList)、元素属性的集合(NamedNodeMap)和HTML...
2018-05-03 00:00:00 814
原创 一个HTML元素和五个CSS属性的魔力
特别声明:此篇文章内容来源于@ANA TUDOR的《1 HTML Element + 5 CSS Properties = Magic!》一文。假设我告诉你,我可以使用一...
2018-04-21 00:00:00 486
原创 CSS如何实现内凹角效果
特别声明:此篇文章内容来源于@ANA TUDOR翻译的《Scooped Corners in 2018》一文。记得@Lea Verou的《CSS Secrets》一书和前...
2018-04-19 00:00:00 14845 1
原创 你应该掌握的CSS自定义属性技术点
特别声明:此篇文章内容来源于@Ohans Emmanuel的《Everything you need to know about CSS Variables》一文。大多数...
2018-04-18 15:36:25 701
原创 使用Vue构建视频播放列表
这周有关于CSSConf Australia大会的视频已经放出来了。花了一天的时间看了一下视频,有些话题还是很有意思的。不过咱们今天要聊的不是这个大会中的事情。这不是在学...
2018-04-18 15:36:23 4490
原创 CSS Grid Layout一些有趣的事情(1)
几周前,我举办了一个有关于CSS Grid Layout的研讨会。我和大多数人一样,对这个话题也很陌生,我在准备PPT和DEMO的时候学到了很多东西。我决定和大家一起分享...
2018-04-18 15:36:21 479
原创 CSS Grid Layout一些有趣的事情(2)
特别声明:此篇文章内容来源于@MANUEL MATUZOVIC的《Another Collection of Interesting Facts About CSS Gr...
2018-04-18 15:36:20 244
转载 使用圆锥渐变和CSS自定义属性创建一个Range Input控制的环形图
特别声明:此篇文章内容来源于@Vicky.Ye翻译的《使用圆锥渐变和CSS变量创建一个Range Input控制的环形图》一文。英文原文来自于@Ana Tudor的《Us...
2018-04-18 15:36:16 883
原创 CSS Grid Layout一些有趣的事情(2)
特别声明:此篇文章内容来源于@MANUEL MATUZOVIC的《Another Collection of Interesting Facts About CSS Grid》一文。去年,我做了一个研讨会之后收集了一些关于CSS Grid布局有趣的东西。今天年,我在另一个工作室工作,我学到了一些更令人兴奋的事情,那就是我们都喜欢布局规范。当然,我不会把这些有趣的东西独享。我很高兴能和大家一起分享这
2018-04-14 00:00:00 229
原创 CSS Grid Layout一些有趣的事情(1)
几周前,我举办了一个有关于CSS Grid Layout的研讨会。我和大多数人一样,对这个话题也很陌生,我在准备PPT和DEMO的时候学到了很多东西。我决定和大家一起分享一些我觉得其中特别感兴趣的东西。希望大家对这些也会感兴趣。可能grid-row-end和grid-column-end会使用小于-1的负值在许多代码示例和教程中,您可能看到过可以使用grid-column-start:1;和gri
2018-04-14 00:00:00 259
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人