html和css我大概学了3遍,第一次是在萌码,第二次是慕课网,最后一次是这本书,其中还看了一部分的w3school。
前面两次的学代码平台看似互动的界面,其实学习效果很差。。很多东西没有讲明白,比如css的布局,在前两个网站都是给几个例子让你跟着做,我当时又求快飞快的做完,然后过几天就什么都忘了。
这本书的CSS布局是精华部分,先从html的flow说起,然后讲float,position,果冻布局,表式布局。。。
下面是一些看书时记的笔记,细节部分怕忘了重新摘抄在这里:
1.target=“name”,name是窗口名字,_blank是一个特殊例子,意思是打开新窗口
2.一般使用id属性来当作锚,在a标签的href后面加上#id来寻找锚
3.<img>依然是空元素,因为image不是<img>的一部分,而是被<img>引用
4.CSS的PPI是96,就是每inch包含96像素
5.可以通过设置img的属性width和height来设置图片的尺寸,但是这个方法仍然会下载全尺寸大小的图片(建议使用thumbnail技术)
6.浏览器对<img>标签和其它标签有些不同,在载入页面的内容后才会根据img的src取回图片
7.font-size最常用的单位是关键字,比如xx-small, x-small, small medium….
8.可以把font-weight的值设置成100-900间的100的倍数
9.width属性专门用来指定盒子模型的content区域。盒子的真正宽度是左右padding,左右margin,左右border再加上content的width
10.width默认为auto,就是说它会自动填充到可以填充的区域
11.text-align将会调整块级元素内的所有行级元素
12.如果使用%和em,那么值是相对的。而如果你把line-height的值设为1,那么它会变成自身font-size的一倍,而不是父元素的font-size
13.可以为行级标签设置width,但是你看不到设置它们有什么用,除非你移动了它们的位置.除了<img>标签
14.伪类有5种状态:link, visited, hover, focus, active
15.cascade就是浏览器的决定,给定一组样式表和一组样式,哪一个样式会被使用
16.嵌套的block的margin发生折叠时,如果外层的元素有border,那么它们的margin不会碰到一起
17.每个设置了position位置的元素都有一个z-index,也就是z轴
18.默认position值是“static”
19.把border-spacing想象成一般元素的margin,还有border-collapse
20.vertical-align 来确认所有在table中的内容都垂直对齐,有top,middle,bottom
21.表式布局的关键是:display: table, table-row, table-cell。以及为cell设置的vertical-align
22.只有当元素使用absolute,fixed,relative才有Z轴。默认的“static”则没有Z轴
23.relative position取决于包含元素的标准流位置,然后再根据此位置做调整
24.行级元素,流的顺序是从左上到右下
25.如果用手机观看网页,手机浏览器会理解<aside>标签,并把它放在最下面而优先显示更重要的内容
26.<video> , controls, autoplay是布尔属性
27.<video>有 controls,autoplay,src,preload,poster,loop,width,height等属性
28.伪类 nth-child() 参数为odd even 2n 2n+1
29.于rowspan对应的是colspan,作用于<td>
30.列表属性:包括list-style-image,list-style-type,list-style-position
31.<select>下面的<option>不需要标明name属性
32.<fieldsets> <lengends>可以创建一个小块字段集合,增加可视化
33.在<select>中加入multiple这个布尔属性,选择框将会变成多选
34.pseudo-elements伪元素, p:first-letter, p:first-line
35.css属性选择器,基于属性的值来做选择 img[height="300"]
36.使用加号(+)选择CSS兄弟元素
37.CSS属性transition >过度时间 transform >变形
生词:
You betcha! 当然啦!
和慕课网,w3school那些妖艳贱货完全不一样
《深入浅出HTML与CSS、XHTML》热门书评
-
我大四在校时用词典和另外三个同学做的渣译,愧对大家给的那么多五星。。。(虽然我知道你们的五星给的是英
124有用 1无用 光影之间 2013-12-10
如标题,2007年在中央民族大学念大四时勤工俭学的渣译,全书大概十万字,我负责的前四章,林旺是我们学校勤工处的老师,张晓坤是林旺的老师。林旺骗我们四个穷学生说翻译这本书待遇千字五十,条件是我们四个学生不署名,想着每人...
-
注意你看的版本
36有用 0无用 砖头 2013-03-24
HTML与CSS有两版,第一版是2005年出的,书名是HTML, CSS和XHTML,中文版是2008年出的,第二版是2012年出的,书名是HTML和CSS,没有中文版不用说应该尽量看新版,新版对HTML5, mobile web等都有涉及,旧版已经将近10年,虽然语法没变,但标准,设备和网络环境已...
-
爱不释卷爱不释卷!!(English Version)
29有用 0无用 崖敌 2010-01-31
从来没有因为哪一本专业的教材能让我最后竟然舍不得把最后几页读完,当看到"We covered a lot of ground, and you’re almost finished with t...
-
内容很浅显
15有用 2无用 LaoBai 2007-01-20
内容很简单,如果你已经会一点HTML。编排很独特,顺便提一句,我是因为那本著名的深入浅出设计模式才关注这本书的。以及HeadFirst系列。不过除了能学习英文外,这本的好处还包括:1、理论体系或者说方法论比较到位,这就比一般的参考书更有价值;2、叙事方法值得学习。缺点吗。价格不太公道。但和原版相比,...
-
深入浅出的典范
10有用 0无用 蔚翔 2013-07-29
王小波在《沉默的大多数》里说:“...其实每一本书都应该有趣,对于一些书来说,有趣是它存在的理由。对于另外一些书来说,有趣是它应达到的标准...”由此可见,在一向严谨刻板不苟言笑的IT(书籍)领域,能冒出一本风趣幽默的入门级教材,让读者轻松愉快的获取到他想学习的东西。是多么的难得。也许是随着年龄暗中...
书名: 深入浅出HTML与CSS、XHTML
作者: [美] 弗里曼 Freeman·E
出版社: 东南大学出版社
出版年: 2006-5
页数: 658
定价: 98.00元
装帧: 平装
丛书: O'Reilly深入浅出系列
ISBN: 9787564103194