1. 使用html标签的style属性
如:
这种方式的优点:分散灵活方便;
缺点:缺乏整体性和规划性,不利于维护,维护成本高;
这种方式的css渲染的优先级要高于其它三种。
2. 将样式代码写在标签中
通常将style标签放到html文件
标签里 如:
此种方式的优点:单个页面内的css代码具有统一性和规划性,便于维护。
缺点:多个页面之间css复用仍然不够。
3. 使用标签,引入外部css文件
外部css文件:base.css:
p { color: #000}
...
此种方式的优点:一个页面可以引入多个外部css文件,方便css代码复用,方便维护;
目前应用做多。
缺点:代码量集中,容易混乱。
4. 使用@import,引入css文件
这种方法既可以用在
@import url ('/css/list.css')
特点:引入方便,但性能可能较差
使用link 标签和@import区别:
1. 范畴不同: link是html标签,除了加载css之外,还可以定义其他如rss事务;@import属于css范畴,只能加载css;
2. 加载顺序不同:link引入css时,在页面加载时同时加载,而@import需要页面完全载入以后加载;
3. 兼容性差别: link是xhtml标签,因此无兼容问题,而@import是在css2.1提出的(ie5以上才能识别),因此低版本的浏览器不兼容;
4. 是否支持js dom改变: link支持使用javascript控制dom改变css样式,@import不支持;
5. 权重不同: link方式样式的权重高于@import样式的权重。
