今天在别的地方看到一个DIV+CSS的学习教程,感觉还不错,于是自己也跟着学习然后记录下,便于以后查看。
在过去的页面中,我们经常会使用表格来进行布局,而使用CSS排版后,会使网页代码简洁,表现和内容相分离,维护方便,能兼容更多的浏览器,也能在移动设备上更好的进行浏览操作。
A. CSS的样式加载可以有以下四种方式
1. 外部样式
如: <link href="other.css" target="_blank" rel="external nofollow" rel="stylesheet" type="text/css"/>,这样就可以将other.css资源文件加载到当前页面中,这样的好处时other.css文件可以被多个页面使用,能够很好的重用。
2.内部样式
如:
<style type="text/css">
h2{
color:red;
}
</style>
该样式写在head标签内部,只能供当前页面使用,不能在其他页面进行使用。
3.行内样式
如:
<p style="color:red;">Hello,World!!</p>
该样式只能作用于当前的标签,所以一般不建议使用。
4.导入样式
如:
@import url("global.css");
这个一般是在css文件中导入其他的css文件,就跟我们在写jsp页面时,用include标签导入其他页面类似。
B.css的优先级问题
1.id的优先级高于class
即当我们写 #cssIdname这样的样式和.cssclassName时,#cssIdname会生效
2.后面的样式会覆盖前面的样式
3. 指定的样式高于覆盖样式
4.行内样式高于其他