关于HTML和CSS一些鸡零狗碎的事

原文发表于我自己的服务器www.jjxiaoliu.cn；不过这个服务器我可能不打算续费了，所以搬到cnblogs来。

有些关于HTML和CSS的内容不值得单独列一篇文章，全都放在这里了。

我们可以利用注释来给原本不能断行的HTML代码增加断行：
<!– 下面的代码可能出现在使用<ul>和<li>制作的简单横向菜单中（配合CSS） –>
<li>item1</li><!–
–><li>item2</li>

指定charset的两种写法：
<meta charset=”utf-8″ />
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
这两种几乎是一样的。所以一般用短些就可以了。

我们可以使用download属性来设定用户下载到本地的文件名：
<a href=”something_to_be_download” download=”short_name”>Download something</a>

用于标记计算机代码的HTML标签：

• <code>，标记通用计算机代码
• <var>，标记变量名
• <kbd>，标记用户输入
• <samp>，标记计算机输出

<thead> .vs. <th>
<thead>仅描述表格结构；<td>一般而言会使得浏览器以更醒目的方式渲染标签内容（表现形式）。
如果对上一段文字感到拧巴，可以参考这一篇：
HTML与CSS：结构与表现。
另外，在打印长表格时，<thead>和<tfoot>会自动重复出现在每一页的头和尾。从这点来说，它们更像是页头和页尾。
在需要时，<thead>和<th>也是可以混用的。可以参考MDN上关于<thead>标签的例子。

pseudo-classes与pseudo-element
pseudo-classes匹配整个标签，而pseudo-element匹配标签内的特定元素。
例如：p:first-child匹配作为第一个child元素出现的p标签；p::first-letter匹配p标签内的第一个字符。
顺便说一下，pseudo-classes的child是指标签本身作为child，不是指标签的下级child。且child计数从1开始。

CSS的属性名称不区分大小写，但属性值区分大小写。
[name=”jjxiaoliu”]等价于[Name=”jjxiaoliu”]，但不等价于[name=”JJxiaoliu”]。

CSS可以用紧邻的[]匹配多个属性。
[country=”china”][province=”jiangsu”]可以匹配如下标签：
<p country=”china” province=”jiangsu”>Jiangsu Province, China</p>
注意两个[]之间不能有空格。
如果两个[]之间有空格，那么将形成Descendant selector，于是匹配的将是如下形式的HTML结构：
<div country=”china”>
<p province=”jiangsu”>Jiangsu Province, China</p>
</div>

class和id联合使用
p.class_name#id_name
类似的，class也可以和属性联合使用：
p.class_name[attribute]

css的margin属性
如果相邻元素都是正值，那么取正最大；
如果相邻元素都是负值，那么取负最大；
如果相邻元素正负相反，那么取两者的和。

css的position属性
如果设置为absolute，那么位置值默认是相对于html标签，除非其祖先设置过position为非static值：即absolute的位置值是相对于其祖先元素里除去用static定位以外的最近一个；
如果设置为relative，那么位置值是相对于其“原本（没有设置位置的情况下）应该在的”位置。
如果设置为fixed，那么位置值是相对于浏览器窗口。