Headfirst系列书,照相留念,用了很多便签记录知识点

Headfirst系列编程书有个特点是节奏很慢,每章包含的知识点不多就那么几个,但是比较全面,把篇幅多用在多种实际情况的演练和讲解原因上了(但不会太深入)。

这样的坏处是过了很多页,感觉学了很多,但其实知识点包含得很少。

这样的好处是学习的那些知识点会掌握得相对比较牢靠,因为是实际使用场景的教学,去回忆知识点时,一下子就能想起,并且还知道一点原理。

具体到这本Headfirst:HTML与CSS,我看的英文影印版,直到第471页,也就是第十一章,全书终于算是到了一个高潮。其实也只是讲到了布局和定位,也就是div+css的切图。其中最重要的就是4种布局模式:

The Floating Layout

The Jello Layout

The Absolute Layout

The Table Display Layout

在各自实战演示了一遍,然后又综述总结了这四种设计模式后,第十一章用了这样一段为这四种模式作了评价

There are as many page designs on the Web as there are designers, but many of those designs are based on the layouts you've learned about here (or some variation of these).

You now have several strategies in your layout toolbox to choose from, so you're in good shape to handle just about any layout job your boss might throw at you!

这段的大致意思是:一万个设计者就有一万种设计布局,但万变不离其宗,都脱离不了这四种基本布局。现在的你就有了这个秘密工具箱啦,能成倍的提高效率, 从容应对需求。

对于编程来说,我也很喜欢并且倾向于接受这种“模式集成”或者“封装”,然后基于此之上再演绎具体需求。这样从“工具”的角度看待编程,追求的是效率和稳定可靠。

说回Headfirst的这本书。前面虽说书厚知识点少,但毕竟700多页十四个章节,我看了近两周,看到了第十一章,经过书里的各种实战练习(也配合着下载的配套源代码),确实还是收获满满,比如:

HTML标签代表着结构骨架,一旦定好,则不动如山;

CSS则对HTML的各个标签“化妆”,对各种属性的使用会完全改变网页外表;

HTML的结构里又分为block和inline,用div和span两个标签分别控制各自的逻辑分区;

为了提高HTML与CSS的沟通效率,每个HTML标签有id属性和class属性,分别用作唯一的和一组的身份识别,以此能对特定标签化妆。

……

这些知识点单独来说都很简单,真正有趣的地方在于它们之间的组合。就如同二进制一样,随着能组合的数上升(幂变大),能组合出的形态会越来越多,单个的HTML标签和CSS标记能量不大,但把多个组合起来就能实现多样的页面效果……这样的组合可以说无穷无尽.

当然也有隐患。前面说过,从模式出发,根据具体需求再演绎,这样有效率且稳定可靠。但如果只是自己随意组合,只靠发挥想象,天马行空的话,后果也很容易想象:重复低效,不稳定。

最后,虽然HTML和CSS很强大,但终究只是标记语言。现代的web已经从单纯的文本向应用靠拢。要想更好的发挥HTML和CSS,除了运用HTML5的新的强大标签外,还得学习另一门编程语言JavaScript,以此让文本变应用,让Web更加强大。

于此同时,虽然headfirst系列以实战演练为主,但想要完全掌握html与css,除了不断回顾知识点之外,还得多实际练手,找不同的网页类型结合着书里总结的四种设计模式比较分析,然后再自己实现一次相应的页面。

html和css学习,HTML与CSS学习小结相关推荐

  1. Web前端技术分享:学习HTML和CSS的5大理由

    人们学习HTML和CSS最常见的原因是开始从事Web开发.但并不是只有Web开发人员才要学习HTML和CSS的核心技术.作为一个网络用户,你需要你掌握的相关技术很多,但下面小千总结了5个你无法拒绝学习 ...

  2. rem和em学习笔记及CSS预处理

    rem和em学习笔记及CSS预处理 1.当元素A的字体单位是n rem时,它将根据根元素(html)的font-size的大小作为基准,比如  View Code parent-div中的em-div ...

  3. css清除浮动的几种方法_web前端学习路线分享CSS浮动-清除浮动篇

    web前端学习路线分享CSS浮动-清除浮动篇,为什么要清除浮动 这里所说的清除浮动,并不是不要浮动了,而是清除浮动与浮动之间的影响.那么到底会有什么影响呢? 1.高度塌陷 举个例子我们看一下. 我们在 ...

  4. 自学html和css,学习HTML和CSS的5大理由

    描述 人们学习HTML和CSS最常见的原因是开始从事web开发.但并不是只有web开发人员才要学习HTML和CSS的核心技术.作为一个网络用户,你需要你掌握的相关技术很多,但下面有5个你无法拒绝学习H ...

  5. ul 原点显示_web前端开发学习教程,CSS HTML - ul li列表原点如何相连

    原标题:web前端开发学习教程,CSS HTML - ul li列表原点如何相连 目前我列出两个方案,很详细,希望可以帮助到有疑问的朋友. 方案一: html 参与考试<第一期模拟考试> ...

  6. Html,css,is,php,mysql的学习顺序是什么?

    你还推荐现在的 Web 入门的同学学习 jquery?Web 后端你推荐大家学 php?前端框架技术选型是什么?是否使用 typescript?后端学习什么框架?学习的过程中如何实践?数据库呢? SQ ...

  7. 5去掉button按钮的点击样式_各种好看的小按钮合集,纯css编写,最近在学习时遇到的,记录成为笔记...

    写在前面 最近忙着实习的事,前往广州,租房,置办东西等等.用碎片化的时间看了一些博客,也看到不少我认为很不错的通过纯css来打造的按钮样式.记录下来以后开发的时候或许能用上. 亮起来按钮 <di ...

  8. 从零开始学前端:CSS复合选择器 --- 今天你学习了吗?(CSS:Day10)

    从零开始学前端:程序猿小白也可以完全掌握!-今天你学习了吗?(CSS) 复习:从零开始学前端:CSS背景颜色 - 今天你学习了吗?(CSS:Day09) 文章目录 从零开始学前端:程序猿小白也可以完全 ...

  9. 从零开始学前端:CSS背景颜色 --- 今天你学习了吗?(CSS:Day09)

    从零开始学前端:程序猿小白也可以完全掌握!-今天你学习了吗?(CSS) 复习:从零开始学前端:CSS字体属性和文本属性 - 今天你学习了吗?(CSS:Day08) 文章目录 从零开始学前端:程序猿小白 ...

  10. button按钮样式_各种好看的小按钮合集,纯css编写,最近在学习时遇到的,记录成为笔记...

    写在前面 最近忙着实习的事,前往广州,租房,置办东西等等.用碎片化的时间看了一些博客,也看到不少我认为很不错的通过纯css来打造的按钮样式.记录下来以后开发的时候或许能用上. 亮起来按钮 < 简 ...

最新文章

  1. 量子技术发展的一小步:Google AI推出开源框架Cirq
  2. 骨架提取的MATLAB实现
  3. Redis搭建(二):主从复制
  4. 做人,你想过这四个致命的问题吗
  5. PowerDesigner 正向工程 和 逆向工程 说明
  6. 《JavaScript高级程序设计》第8-9章
  7. (转)解决fasterxml中string字符串转对象json格式错误问题(无引号 单引号问题)...
  8. java简单的复数类_Java练习 SDUT-4303_简单的复数运算(类和对象)
  9. 表达式计算:后缀表达式求解 以及 中缀表达式转换为后缀表达式
  10. usb深度检查 清理_红桥区清理隔油池一般多少钱
  11. 关于React的一切(updating...)
  12. oracle创建dblink问题
  13. 小米游戏本bios更新_小米笔记本电脑bios升级方法图文步骤
  14. VMware 虚拟机Win10固定ip地址
  15. 阿里云国际版账户登录不上去什么原因?
  16. 网页上怎么查询服务器地址,怎么查看一个网页的服务器地址
  17. CCF-201809-3
  18. 51单片机与STM32的区别(为何51单片机IO引脚的驱动能力弱)
  19. unity应用(Apply)预制体时报错
  20. vue2 props

热门文章

  1. mysql group by 无效_Mysql5.7版本group by 子查询中order by 无效的问题解决办法
  2. java迷宫生成代码_通过深度优先搜索产生的迷宫的Java代码
  3. python类继承可以有多个父类_Python3基础 多重继承 一个子类继承于多个父类
  4. python教程:super()的用法
  5. jmeter线程说明_4.centos下Jmeter+InfluxDB+Grafana环境的搭建1
  6. vue 实现无限轮播_用vue写一个轮播图效果
  7. php ajax实现编辑资料,怎么用jQuery、Ajax、php实现这样的无刷新编辑功能?
  8. 什么是透传通道?(透明传输通道,就是当中继使)
  9. M 点滑动平均 Python 实现
  10. Winmail邮件服务器