一个后端程序员的前端之路之自述

前端之路之自述

缘起

年初的时候,我换了一个工作,之前的工作主要是撸Oracle的openjdk7,或者V8什么的源码。现在的工作主要是处理web开发方面的事情。web开发涉及到前后端,我负责后端,前端直接交给前端工程师去做,不过鉴于公司路由器有问题,都由我来解决的现状,涉及到前端的事自然也落到我的头上了。汗!

我的CSS基础

这里说一个事情。有这么一个功能:一个搜索框,下面是一个很长的列表。点击搜索框,会到后台去搜索特定的内容,并返回前台。这个后台功能不复杂,现在看来,涉及到的前台显示——让搜索框和列表变的好看,其实也不是很复杂。但当时,一筹莫展啊!我的css基础嘛,为0.1,知道一些CSS文本属性,其它的就不知道了。

怎么学习CSS、应该掌握什么CSS知识,怎么实现眼前的这个功能等等,我都不知道,而且这个不可以借鉴我之前的后端知识。用php做个比对,php我之前一次没有见过,但对于php,我知道我所不知道。我知道什么该知道,什么可以缓缓,不懂的原因、解决方法在那里,我都很清楚。我可以拿一本php权威指南之类的书籍,或者php编程之类的书籍,直接开始撸代码。但对于css不行,我不知道我不知道的。而且在学了css后,我才了解前端程序员的不容易:如果把后端程序员比喻成去解决开源软件的问题,那前端程序员就是去解决windows那闭源的软件问题。

初衷

我打算将我目前对css的学习记录下来。不知道谁说过,你只有教会某一样东西,你才能真正地学会某一样东西。嗯,这句话送给我。我有一句话送给你:没有教会的,只有学会的。

学而不思则罔 思而不学则殆

有一个简单的纲要:

  1. CSS布局

    • 浮动布局(float、浮动包含、浮动清除)
    • 定位(静态定位、绝对定位、固定定位、相对定位等)
    • flex布局(使用的比较广泛,尤其是移动端,目前的微信小程序就是使用的flex布局)
    • grid布局(不会,因为目前浏览器支持比较少,属于实验性,暂时没有学的心情)
  2. CSS控件实例学习
    通过各个控件的实现,来学习CSS。

  3. 重要的CSS属性介绍,比如line-heightbackground等属性。

希望达到的目的:

  1. 看懂别人的CSS代码。
  2. 可以熟练地利用CSS框架,比如Bootstrap、weui等CSS框架。
  3. 可以不借助框架,实现自己的布局;控件的布局
  4. 可以自己实现特定的CSS控件。

CSS书籍推荐

我只推荐我看过,我认为还可以的。我听说是好书,但我没看过的,我就不推荐了!

CSS基础知识类:

  1. 《CSS设计指南》(第2遍在读)
  2. 《精通CSS:高级Web标准解决方案》(第二次读完background一节后,认为整本书独值得一读)
  3. 《CSS权威指南》(读的昏昏欲睡)

《CSS设计指南》我认为比较适合初学者,实例结合理论,有内涵,有一定深度。图书的厚度也合适。 我发现一点,前端的书籍,好像都不是太厚,我还没有见过500页向上的前端书籍。

《精通CSS:高级Web标准解决方案》这本书是我看被人推荐的,我刚拿到手,看了background一节,发现介绍的都是老的技术,以现在的效果,只要CSS3的一个属性就可以做到,还讲那个做什么。就放下了,知道后来开始撸CSS代码的时候,才发现这些技术随处可见,于是把它又捡起来,准备认真地通读全本书。

《CSS权威指南》这本书,我已经不止一次看到推荐了,比如《CSS设计指南》的作者也看过这本书。那为什么放在最后呢,因为难读。尤其是浮动一节,不太适合刚做CSS的同学们去读。嗯,对的,我就是第一次接触CSS时,直接看《CSS权威指南》的,效果不好,看完就忘了。

写出这本书的作者,起码对CSS规范很熟悉,甚至可能自己接触过浏览器对CSS特性的实现,否则不可能写出介绍CSS原理的书籍来。这本书甚至可以换个名字,叫《CSS原理》。但这本书不是从代码的角度去介绍CSS的,更多的是从规范的角度去写CSS。我觉得每一个前端开发者都应该读一下这本书。嗯,我没必要,我是后端程序员。

Bootstrap类:

  1. 《Bootstrap实战》李松峰翻译(读完)
  2. 《Packt Bootstrap By Example》(实践部分读完)

《Bootstrap实战》是国外的那一本,不是国内的那一本,要分清。自从看到这本,我就知道我可以去驾驭Bootstrap了,当然我现在也没能自由驾驭Bootstrap。不过,书写的真是好,属于深入浅出之类的书籍,书中还教你前端开发的一些好的实践,不错!

《Packt Bootstrap By Example》这本书就是教你学Bootstrap的,有些人可能很惊讶,这本书不教你Bootstrap,那教你什么。举个例子:《Bootstrap用户手册:设计响应式网站》这本书就不是教你Bootstrap的,起码在我眼里不是,它是卖钱的。

没有结论

先给个结论吧,好像我们学前端的东西,需要先看最终的显示效果一样。此结论,只表明我目前对CSS的一些使用看法,不代表最终结论:

  1. CSS和浏览器结合紧密,而浏览器与CSS的关系,繁杂、琐碎。需要花费特定的时间来学习,故CSS比较难学。
  2. CSS也比较好学,因为没有秘密,随时可以看到其代码,看到就能学到,类似于开源的概念。
  3. 需要看CSS代码,和后端一样。
  4. CSS比较有趣。

简书的自己的样式比较漂亮,为什么个人写作的CSS这么丑?

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,716评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,558评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,431评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,127评论 0 209
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,511评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,692评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,915评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,664评论 0 202
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,412评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,616评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,105评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,424评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,098评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,096评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,869评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,748评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,641评论 2 271

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 170,569评论 25 707
  • 今天是高考的日子,它将我的思绪拉回到了十七年前我的高考岁月。 高中时,和我一起玩大的玩伴们都相继辍学了...
    素心齋阅读 401评论 1 14
  • 空冷的大街上, 风生硬地乱冲。 远处的景观, 开始慢慢剥落。 似睡将睡的当儿, 一对情侣从斜刺的小路骑车而来。 银...
    泰平阅读 768评论 0 4