第三章 构建模块
p89 <q>和<blockquote>的区别
<blockquote>是一个块(block)元素,<q>是一个内联(inline)元素。
块元素显示时就好像前后各有一个换行,而内联元素在页面文本流中总在“行内”出现。
块元素是web页面中主要的构建模块,而内联元素用来表示小段内容
p98 void元素
<br> <img>这样的元素没有实际内容的元素称为 void元素
p99 xhtml中<br>应该写成<br/>
p102 html list
<ol> ordered list, <ul> unordered list, <li> list item
p112 特殊字符
> > (greater than)
< < (less than)
& &
第四章 链接起来
p126 域名和网站名的区别
www.starbuzzcoffee.com 中 starbuzzcoffee.com 是域名, www是域中特定服务器的名字
如book.douban.com、movie.douban.com这些网站名都属于同一个douban.com的域名
p151 如何用id链接到元素
<a href=”index.html#chai”>See Chai Tea</a>
点击这个链接就会跳转到index.html中id为chai的部分显示
p156 用target打开新窗口
<a target=”_target” href=”http://www.google.com”>Google</a>
第五章 为你的页面增加图像
p167 jpeg、png和gif的对比
照片和复杂图像使用 jpeg(jpeg有损、不支持透明度、比较小、不支持动画)
单色图像、logo和几何图像使用png或gif(png可包含上百万中颜色、无损、可透明、图像下面的东西可以显示出来、相对于jpeg而言png更大;类似png、256种颜色、无损、支持透明度,不过只有一种、比jpeg更大、支持动画)
p173 img中的alt属性
img中alt给定一段文字,当图像不能显示时,就显示这段文字
p195 img是内联元素
第六章 严肃的HTML
p222 HTML简史
html和xml的分手??
第七章 CSS入门
《CSS Pocket Reference》
p281 CSS中的继承 & p284 覆盖继承
可以给元素提供特定的规则来覆盖继承,有点儿像面向对象编程中的,父类和子类的感觉。
某些CSS是可以继承的,而某些是不行的,总的来说,如果样式会影响你的文本外观,那么它就是可以继承的
应用样式快捷指南:
1.有没有某个选择器选择你的元素?
2.有没有继承?
3.都没有?使用默认值
4.如果多个选择器选择了同一元素,则使用更特定的那个规则
第八章 字体系列概述
p314 字体系列
font-family包含一组有共同特征的字体:sans-serif、serif、monospace、cursive和fantasy。
sans-serif:没有衬线,与serif比,更适合在计算机上显示
serif:有衬线,新闻报纸的文字排版
monospace:字体固定宽度,适合显示代码
curisive和fantasy:比较有趣的字体
p325 增加web字体
@font-face {
font-family: “Emblema One”; //font名字
src: url(“…./EmblemaOne-Regular.woff”)
url(“…./EmblemaOne-Regular.ttf”)
}
可以使用google的字体托管服务
p328 调整字体大小的三种方式
px:直接指定大小
body { font-size: 14px;}
%: 相对于父元素的大小
body { font-size: 14px; }
h1 { font-size: 150%; }
这相当于说h1的font-size是21px
em: 类似%,不过表示的是倍数
body { font-size: 14px; }
h1 { font-size: 1.5em; }
还有xx-small, x-small, small, medium, large, x-large和xx-large
字体粗细: font-weight: bold
第九章 盒模型
p365 line-height
p367 盒模型
从内到外:content area(width)、padding(内边距)、border(边框)、margin(外边框)
content area:内容区用于显示元素内容
padding:内边距是透明的,没有颜色,也没有自己的装饰
border:边框可以有各种不同的宽度和颜色
margin:外边距也是透明的,没有颜色,也没有自己的装饰
p373 是一个非常好的例子
第十章 div与span
p417 div表示一个快级逻辑区
p423 div是一个块元素
p442 CSS简写属性
p448 span内联级内容逻辑分区
p453 伪类
a:visited { color: red; }
当连接访问过以后显示为红色。
其他的状态按顺序还包括:
link, visitied, hover, focus、active。
浏览器会在后台根据用户的操作对伪类进行添加删除的维护
p457 CSS中的层叠
层叠:给定一组样式,浏览器是按照层叠的方式来确定使用哪一个样式
层叠的顺序
1. 收集所有的样式表
2. 找到所有匹配的声明
3. 对所有的匹配规则排序(作者、读者、浏览器)
4. 按特定性对所有声明进行排序
5. 对于冲突的规则,按照它们在各自样式表中出现的顺序进行排序
p460 特定性的确定