SegmentFault 社区访谈 | Linxz:只会写 CSS 不会写 JS 的“伪”前端

clipboard.png

上周没和你们见面,是去邀请大佬来访谈了(///▽///)社区访谈以来,清蒸邀请都是些你们相对熟悉的面孔,好比公子,好比边城大大,此次的访谈嘉宾,你们可能有些陌生,他主要出没在 css 标签下,有请专一 css 三十年不会 js 的林小志 - @林小志css

破冰环节

小志,和以前的小伙伴同样,和你们简单地打个招呼吧( ̄∇ ̄)从简就好前端

(长篇大论的开场)自我介绍是我最不擅长的,一直以来都不知道本身应该如何介绍本身比较好。想来想去,我就随便说一下吧。工年已经有一些年头了,可是能力却一直都是通常般,在 2009 年的时候曾“无知”挂名在某人的一本书中,写了最后一页内容,过后看到书中内容跟本身写 CSS 的方式、思路有所出路,因而年少轻狂的我就出口要本身写一本。最后用了半年多的时间在晚上、在周末写完了《CSS那些事儿》这本书。css3

有朋友问我为何用这个书名,其实这个书名并非我起的,我也没去考虑书名的问题,可是我很认真很严肃地表态,书名中不准出现“div+css”、“X 日精通”以及“精通”等字眼。最后这本书知足了个人虚荣心以后,由于销量不佳,被出版社收回销毁(听说)。git

一个不当心从要介绍本身扯到了本身曾经的一本书,思绪又飘了。其实认识个人朋友都知道我一直以来都是在写 CSS,大概何时开始写呢,应该是从 07 年或者 08 年吧,具体我也不记得了。虽然以前有过接触 CSS,但并未以为用 CSS 布局有什么好的,也没在乎,后来无心间加入一个 QQ 群,在群里各位老师的带动下,我开始认真接触。遇到问题不断摸索,而后跟你们讨论交流,最后也就这样混下来了。
接下来几年的工做中,虽然一直都是偏重于 CSS 方面,但其余的偶尔仍是会接触一下,去玩一下。因此,如今的我是一个只会 CSS 不会写 JS 的“伪”前端。然而,可怕的是,当如今的 flex 以及 rem 等一系列新的 CSS 属性出现以后,我发现,我其实连 CSS 都不会写了。程序员

【“爱·花苑”花店卖花、送花的】是你某个社交平台的简介,爱·花苑 是你本身开的花店吗?为何要想开个花店呢?github

“爱·花苑”是我老婆开的花店,而我只是在利用网络以及平时周末的时间帮忙一下。开一家花店,天天身处在花丛中,给人的感受彷佛是很向往的生活。但,身为切图仔的我在花店里打工的那段时间感觉来讲,开一家花店,经营一家花店比打工要累太多了。json

都说互联网的工做是常常要加班,通宵加班的。其实,作实体行业,开花店也是常常要加班的,有时候还要通宵,最后赚不了几块钱。说了可能不少人都不相信,但事实就是这样。就不说逢年过节什么的,平时一个不当心接到作开业花篮这样的单子,从准备花材、篮子、花泥,而后处处理花材,最后花篮成型,绝对是一个体力活。小程序

最后想说,有时候真的不要认为花店很赚你的钱,尤为是像咱们“爱·花苑”这样的,尽量作小清新,漂亮的花束是很累的,花材根据时间的不一样,进货价格也不一样,可是咱们又不高价出售,最后只能赚个吃饭的钱。segmentfault

别问花店在哪里,本来是在杭州滨江,如今已经不开了。缘由不少,就很少说了。微信

若是要你帮程序员选鲜花给对象的话,你推荐哪一个花种呢?

不推荐任何花种。这个就跟有时候有人找我推荐书籍同样,这个我真没法推荐。每一个人都有各自的喜爱和追求,我所推荐的只是本身的想法而已。若是必定要推荐什么花送给对象的话,那么首先你要了解你的对象,是一个什么性格的人,喜欢什么颜色,平时有没有特别喜好的花,对于包装有没有什么要求

这些问题,都是以前在花店里我所听到所记录的。当一位顾客要送花给朋友的时候,我老婆就会很细心的询问对方一系列问题,而后针对性地用心包一束花。在我印象中,基本上来买过花束的人,满意的居多,我不敢说百分百,这年头百分百的东西还存在吗?若是有,那就是咱们的花店是百分百实惠。

技术升华环节

如何理解你的微博简介:一个只会写CSS不会写JS的“伪”前端工程师?你以为 JS 和 CSS 学习起来各有什么难点呢?

微博我很久没去碰了,其实如今应该是写一个连 CSS 都不会写,更不会写 JS 的“伪”前端工程师

为何说本身是前端工程师呢,其实就是为了让本身以为本身仍是在前端行列中的,跟你们在一个行业中的;至于说只会写 CSS,那是由于个人工做从几年前开始就一直只是围绕着 CSS 在转,拿着设计师给的设计稿,实现最终的页面效果,空余时间作一些 CSS 方面的 demo 玩玩,总之就是各类围着 CSS 转;至于 JS 方面的话,我真不知道说什么,可能我会用一点,但我真不会写,因此,我在学。

就像前面所说的,如今 CSS 发展太快了,各类新的属性出现,感受本身如今连 CSS 都不会写了。不过其实不少属性跟几年前 IE 中使用的滤镜效果太类似了,就连 box-sizing 这个属性跟以前 IE 的怪异模式下盒模型计算方式是那么的类似。

至于要说 JS 和 CSS 学习起来有什么难点的话,我能够确定地说:JS 我根本不知道有什么难点啊,我连门都还没入呢;至于 CSS 的话,写来写去就那么几个属性,不难,而难的是怎么去思考一个布局用什么方式来实现。因此,写 CSS 不难,入门也就简单不少了。也就是由于这样,不少人都以为 CSS 很简单,但事实并非这样,CSS 其实挺难的。难点在于如何思考,如何巧妙运用每一个 CSS 属性的特性。
可能这样说的比较虚,举个简单的例子?:隐藏文字的几种方法(用的都是之前老的方法,没有用新的 CSS 属性)。

clipboard.png

在 CSS 中一直以来我就不以为有绝对惟一这种说法,换个思路换个想法,结果可能仍是同样的。或许这个就是那句话所说的:条条道路通罗马……

你的书籍【CSS那些事儿】以 CSS 技巧实例讲解为主,能够举个经典布局例子,分析下实现思路和过程吗?

这本书已经估计目前只是存在于部分人的硬盘中吧,一个盗版的 PDF。从当时开始写的时候我就是计划着用实例的方式来一点点讲解(只是针对当时的技术状况来讲),因此,书中会从最简单的盒模型、单列布局慢慢延伸到三列布局,而且会对每种布局可能有的几种方式加点说明。

至于经典布局例子,这个有点难,由于我不知道什么是经典布局例子。布局从大到小去分析,把一个大的模块拆分中 N 个小模块,而后 N 个小模块可能还能够继续拆分,最后就是一个页面。好比左右两列布局,根据不一样的 HTML 写法可使用不一样的 CSS 方式实现,但最终无非就是对布局属性的了解和掌握。

这里列一个几年前,又是一个几年前的东西,发觉本身真的没有新东西了,哎?。我是例子页面 ,这个页面是在很早以前看了国外的一个例子后本身尝试去学习整理的,同一个 HTML 结构,而后根据 CSS 的不一样,最终展示不一样的页面效果。而修改的 CSS 部分无非也就是 floatmargin 之类的属性,有兴趣的能够看看代码。固然,我也不知道这个域名会存在多久,毕竟没有那个什么什么案来着。

对于问题【关于CSS核心技术关键字都有哪些?】下的回答里的导图,你怎么看?

clipboard.png

这,怎么说呢,我没见解。不得不愿定这张图包含了不少知识点。但就我我的感受,整理这张图的做者是最受益的。由于他从整理到最后发出来,确定不是随随便便就完事了。

用心去整理,概括的过程是一我的最好的学习过程,而他人去看这个整理的图,并不必定会彻底理解里面全部的东西,有些甚至也只是蜻蜓点水似得看过,脑壳中有一个印象而已,并不会真正去理解其中每一个词所表明的含义。最大的可能性应该是看到感兴趣的词,而后去挖掘一下。

可能有人会说,那我就每一个词都挖掘一下咯。是啊,这样当然好,但我只想说,你有这个时间?不敢保证这张图的做者能完彻底全把图中每一个词都所深刻的含义都理解透,若是所有都理解透了,我真心佩服。至少我知道其中几个词就已经能够写一大篇文章了。

若是不信的话,能够看看 doyoe 之前整理的有关 margin 的文章:阅读传送门

clipboard.png

那么其余的一些每一个都深刻去研究的话,真的不知道是须要多少时间啊。因此,如今 CSS 都是按照模块来升级研究开发,而不是一个总体来操做的。

前段时间,小志你也开发了本身的小程序 -- caniuse简化版,你是出于怎么样的考虑开发的这个小程序呢?开发过程当中有遇到什么坑吗?

若是我说由于我无聊,因此我去折腾这个 caniuse 简化版,不知道会有多少人信。但我至少能够确定,最开始的想法,我真的是无聊。当时一直在想玩点什么,就是不知道玩什么好,然而一个不当心在 github 上看到 caniuse 网站开源 的 json 文件,因而就想要不就折腾一下这个吧,功能简单点,而后在微信里装逼的时候用一下。

因此,折腾这个 caniuse 简化版就是由于我无聊到后面想装逼,到最后的最后是想本身用的更顺手一点,仅此而已。然而也就是这样一个简单的想法,反反复复折腾了好几次,直到目前为止本身才算相对满意而已。

坑?遇到坑,首先是本身的能力不足致使的,其次就是本身的无知。当时看到这个 json 文件的时候,我在想,若是把文件下载过来,或者 fork 到本身的仓库后作修改,那么更新就麻烦了,直接引用应该是最简单的方法。

就由于这个想法,折腾这个 1.48 MB 的 json 文件让我快抓狂。里面数据量的庞大,以及本身不成熟的想法。最最开始的时候,我竟然把整个 json 文件在请求以后直接丢到 localStorage,想一想真是可怕。

反反复复修改了几回后,思路就清晰多了,总体的原则不变,经过对比 json 文件的 timestamp 来检测文件是否更新。由于不是必要更新,因此更新的主动权交给用户自行选择,如要尝试更新就去“关于”页面中点更新按钮便可,通常来讲,一周会有一次更新。

json 文件请求成功以后,会根据每一个属性,拆分写入到 localStorage,这样在搜索的时候直接从本地搜就能够了。这个时候是否是应该插入一个广告了呢。?


我是强势入场的广告

clipboard.png


前面我说了,我是一个不会写 JS 的“伪”前端,因此,我在开源这个小程序代码的时候,很忐忑,但最终我仍是鼓起了勇气。小程序代码的 GitHub 地址

广告环节

公众号【闲谈CSS那些事儿】

简介
没啥事儿就谈谈CSS,不深刻,只扯淡,扯点本身想说的,或许也是你想听的小东西,没有高深的东西,但应该不是平庸的内容……

我是清蒸嫌弃丑的公众号二维码

clipboard.png

技术圈【混迹于CSS圈】,技术圈传送门

简介
层叠样式表(英语:Cascading Style Sheets,简写CSS),又称串样式列表,由W3C定义和维护的标准,一种用来为结构化文档(如HTML文档或XML应用)添加样式(字体、间距和颜色等)的计算机语言。
CSS 看似简单,却深似海;
CSS 常常用的东西彷佛挺简单,但要想知道为何,却好像不容易理解;
一个使用简单,深刻难的东西;
一个没有过多复杂语法,却开始有变量的东西;
每一个人都有各自的玩法,每一个人都有各自的思想,怎么玩怎么用,全在我的。
#you { idea: important; }
站内 CSS3 问答
站内 CSS 问答
站内 CSS 专家问答
站内 CSS 关键字的搜索结果

剧透环节

本期访谈就到这了,下一次的访谈,我只能说他的名字全是字母,遁走~

相关文章
相关标签/搜索