1.内联元素的外边距、内边距与块元素稍有不同。
如果一个内联元素四周都增加外边距,只能看到左边和右边会增加空间;你也可以对内联元素的上下增加内边距,不过这个内边距不会影响包围它的其他内联元素的间距——所有内边距会与其他内联元素重叠(即这个内边距在一群内联元素里表现的不是叠加,而是公用一个最大的,而且这个样式效果必须在上下有块元素时才能体现。)
2.
header.top img#headerSlogan{
float: right;
}
这是一个最佳实践:实际上,这个选择器不需要增加.top也可以正确地选择元素(众多header标签只有一个属于top类),不过这样一来,就能在CSS中更清楚地看出我们选择的是哪一个headerSlogan。
3.关于视频的格式
一个视频文件包含两个部分:一个视频部分和一个音频部分,每个部分都使用一种特定的编码类型来编码(这样可以缩小数据大小,并能更高效地播放);包含视频和音频编码的文件也有自己的格式和格式名,这种文件称容器。
大多数情况下,并没有一种得到大家共识的编码。
现在主要有三个竞争(2013年)对手在争霸视频web界(如果你只关心apple设备(例子),那么只支持一种格式也可以;如果是多种设备,就不能只支持一种):
1.WebM容器和其包含的Vp8视频编码、Vorbis音频编码。
其由Google设计,扩展名是webm。
2.MP4容器和其包含的H.264视频编码、AAC音频编码。
H.264由MPEG-LA公司授权,有很多债H.264,每一种分别称为一个profle。
3.Ogg容器和其包含的Theora视频编码、Vorbis音频编码。
Theora是一个开源编解码器(编解码器=codec),扩展名为.ogv。
4.table中如果一行没有足够的元素(即某行的列数比其它行少),就会导致不能正确的对齐(少的那个会被后面的填补,即最后空的列会从后面开始空)。
5.
<p>
Extra:<br>
<input type="checkbox" name="extras[]" value="giftwrap">Gift wrap<br>
<input type="checkbox" name="extras[]" value="caralog" checked>Include catalog with order
</p>
为什么这里的name有“[]”?
首先,这是合法的;之所以这样写,是因为编写这一段的脚本语言php希望得到一点提示,想知道一个表单变量可能包含多少个值。提供这个提示的做法就是在名字后加“[]”——虽然暂时用不到,记录一下也是好的。
6.form中的method属性值,POST和GET的区别。
首先,两者的目地都是一样的——将表单数据从浏览器发到服务器。
简单地说,POST会打包表单变量,在后台发到服务器;GET也是打包变量,但却是通过加在网页URL后面的方式给服务器发送。使用GET和使用POST,表面上的区别可以用一个例子说明:
原URL(即action的值):
所以我对于GET和POST的理解,是纯粹地来源于HTTP协议。他们只有一点根本区别,简单点儿说,一个用于获取数据,一个用于修改数据。具体的请参考RFC文档。
如果一个人一开始就做Web开发,很可能把HTML对HTTP协议的使用方式,当成HTTP协议的唯一的合理使用方式。从而犯了以偏概全的错误。
可能有人会觉得我钻牛角尖。我只是不喜欢模棱两可,不喜欢边界不清、概念不明,不喜欢“拿来主义”,也不喜欢被其它喜欢钻牛角尖的人奚落得无地自容。
method
浏览器使用这种 HTTP 方式来提交 form. 可能的值有:
post
: 指的是 HTTP POST 方法 ; 表单数据会包含在表单体内然后发送给服务器.get
: 指的是 HTTP GET 方法; 表单数据会附加在 URIaction
属性中并以 '?' 作为分隔符, 然后这样得到的 URI 再发送给服务器. 当这样做(数据暴露在URI里面)没什么副作用,或者表单仅包含ASCII字符时,再使用这种方法吧。
这个值可以被 <button>
或者 <input>
元素中的 formmethod
属性重载(覆盖)。
(里面的两篇英文链接“POST方法”“GET方法”有空自己翻译翻译)
把 TCP/IP 层次化是有好处的。比如,如果互联网只由一个协议统筹,某个地方需要改变设计时,就必须把所 有部分整体替换掉。而分层之后只需把变动的层替换掉即可。把各层之间的接口部分规划好之后,每个层次 内部的设计就能够*改动了。
值得一提的是,层次化之后,设计也变得相对简单了。处于应用层上的应用可以只考虑分派给自己的任务
TCP/IP 协议族内预存了各类通用的应用服务。比如,FTP(File Transfer Protocol,文件传输协议)和 DNS(Domain Name System,域名系统)服务就是其中两类。
HTTP 协议也处于该层。
我们用 HTTP 举例来说明,首先作为发送端的客户端在应用层(HTTP 协议)发出一个想看某个 Web 页面的 HTTP 请求。
接着,为了传输方便,在传输层(TCP 协议)把从应用层处收到的数据(HTTP 请求报文)进行分割,并在 各个报文上打上标记序号及端口号后转发给网络层。
在网络层(IP 协议),增加作为通信目的地的 MAC 地址后转发给链路层。这样一来,发往网络的通信请求 就准备齐全了。
接收端的服务器在链路层接收到数据,按序往上层发送,一直到应用层。当传输到应用层,才能算真正接收 到由客户端发送过来的 HTTP 请求。
div{
transform:rotate(45deg);
/*首先要列出的是通用属性,以保证属性得到支持,或者至少将来得到支持*/
-webkit-transform: rotate(45deg);
/*webit是safari和chrome的开发商标识符*/
-moz-transform: rotate(45deg);
/*moz是Mozilla的开发商标识符*/
-o-transform: rotate(45deg);
/*o是Opera的开发商标识符*/
-ms-transform: rotate(45deg);
/*ms是IE的开发商标识符*/
}
通常可以在各个浏览器的开发文档和发行说明中找到这些开发商特定的属性。
这本书的读书笔记到此为止。
在HTML5与CSS的学习上,本来我打算下一步是看《HTML5权威指南》,但通过这段时间的学习,我发现在Web开发这一块,书籍的主要作用应该是入门,而不是进阶——因为Web开发自2015年前后,很多东西才开始真正立为标准,而一本成熟的书,其局限的时间必然是其成书时间前3~4年的“成熟”。恰恰在Web开发中,当下的重要性在进阶中是比过去重要许多的!所以我决定,只看HTML5权威指南的部分章节,目地非“学习”而是“回顾历史”,学其思想。具体的使用上,我将在项目开发中用到什么学什么,当遇到我的第一个瓶颈时,再考虑书籍。
鉴于所看章节只有部分,就不另外开文章记录了,直接在这里记上即可。
《HTML5权威指南》
美·Adam Freeman著;牛化成、刘美英等著。
人民邮电出版社,2014年第一版。
HTML与CSS的区别,以及为什么分离样式和结构,我就不再记录了,已经是老生常谈的内容。
6.1 语义与呈现分离——————这一节相当有用,记录所耗时间过长,遂决定把这部分独立存为一个文档作为链接放在文章里。
“HTML就成了一个‘双速’标准。一部分元素(特别是新元素)只有语义方面的作用;而另一部分元素(特别是那些名字只有一个字母的)因为招牌如此之老,新标准在呈现与含义分离的原则上也只得向其屈服——尽管它不愿坦然承认这一点。
从下一章开始,在阅读元素说明的时候,对新思维和老路子之间的这种敏感关系最好要心里有数。它确实有助于解释读者碰到的一些琐碎的怪象。
我的建议是:在语义方面要求严格点不为过,只要有条件,尽量避用那些就有浓重呈现意味或存粹起呈现作用的元素。定义一个自定义类然后借助它应用所需样式并不复杂。只要做到样式的采用是以内容类型为依据而不是随心所欲,你至少也保持了一颗向着语义的心。”
————————在这让我想到了一个东西: css rest,对于这个的讨论,见: