(1)CSS样式加载:
1.外部样式 <link href="layout.css" rel="stylesheet" type="text/css" />
1.外部样式 <link href="layout.css" rel="stylesheet" type="text/css" />
2.内部样式
<style>
h2 { color:#f00;}
</style>
这种形式是内部样式表,它是以<style>和</style>结尾,写在源代码的head标签内。这样的样式表只能针对本页有效。不能作用于其它页面。
3.行内样式
<p style="font-size:18px;">内部样式</p>
4.导入样式
@import url("/css/global.css");
链接样式是以@import url标记所链接的外部样式表,它一般常用在另一个样式表内部。如layout.css为主页所用样式,那么我们可以把全局都需要用的公共样式放到一个global.css的文件中,然后在layout.css中以@import url("/css/global.css")的形式链接全局样式,这样就使代码达到很好的重用性。
(2)CSS优先级
id优先级高于class
后面的样式覆盖前面的
指定的高于继承
行内样式高于内部或外部样式
总结:单一的(id)高于共用的(class),有指定的用指定的,无指定则继承离它最近的
(3)CSS盒子模型
margin:外边距
border:边界宽度
padding:内边距
当margin:auto时为自动居中