犀牛书第五版读书笔记——Chapter 16. Cascading Style Sheets and Dynamic HTML
1.浏览器内置有默认的样式表，用户可以用自己的设置来改变默认值。这也是为什么页面在不同的浏览器中视觉效果不同的原因
2.通过一个ElementNode的style属性，可以编辑该元素的一些CSS属性。不同的浏览器对该属性的实现是不同的：
var s = document.i1.style;
var count = 0;
for ( var prop in s) {
count++;
}
alert(count);执行上面的代码，FF下支持202个属性，IE下只有148个，Google浏览器只有11个
3.element.style属性获取的CSS2Properties对象，只包含内联的css样式，通过外部css文件设置的属性，用style属性无法取到。同样，设置这个值，实际上设置的是内联样式，将覆盖外部css文件的设置值
var p1 = document.getElementById("p1");
var s = p1.style;
alert(s.color);<body> <button id="b1">click me</button> <p id="p1" style="color:red;">hello world</p> </body>
将显示"red"，如果是用外部css文件设置，则没有值
4.CSS属性是多个单词用-连接的，在javascript里会改用驼峰方式命名
element.style.fontFamily = "sans-serif";
5.给style的属性赋值时，一定是使用string
6.所有的位置属性都需要单位
element.style.left = "300px";
同样，取出位置属性，也是带有单位的string
7.window对象的getComputedStyle()方法，返回CSS2Properties对象。不同于element.style属性只包含内联样式，这个返回值包含了内联样式和外部CSS文件定义的样式。该方法接受两个参数，第一个参数是要计算的元素，第二个参数是CSS的伪类。FF和Google浏览器支持这个方法
var p1 = document.getElementById("p1");
var s = getComputedStyle(p1, null);
alert(s);
for ( var prop in s) {
alert(prop + ": " + s[prop]);
}8.IE不支持上述方法，但是它提供了类似的功能。每个元素都有currentStyle属性
9.可以设置外部CSS文件是否生效
<link id="css1" type="text/css" rel="stylesheet" href="../styles/css.css" />
function toggleCssSheet() {
var c1 = document.getElementById("css1");
c1.disabled = !c1.disabled;
}10.FF还支持直接操作CSS样式表文件，不过作用不大
相关推荐
aaaaaaaa00 2011-02-16
atpsoul 2011-02-15
mianhuantang 2011-02-12
shucher 2014-07-15
xiaoheizhuoer 2019-04-07
政见CNPolitics拆掉知识的高墙 2018-05-25
DavidsCorner 2018-05-24
扑克投资家 2018-05-14
一苒说 2018-03-16
爱燃烧最专业的中文跑步运动社区 2018-01-14
扑克投资家 2018-01-01
新经济100人 2017-12-30
UncleLeslie的看法 2017-12-26
优主张 2017-12-22
云健身 2017-12-14
扑克投资家 2017-12-01
稀土 2017-10-05