HTML/CSS-CSS-5节课

一 是什么

定义：cascading style sheets 层叠 样式 表

作用：存储样式（定义如何显示html元素，长什么样），做到内容和表现分离，即运行显示的效果

例子：h1 劈里啪啦，html源代码相同在不同浏览器显示效果不同，chriome和IE，浏览器自带样式

           对于开发人员，一样好，所以需要自定义样式

二 内联样式

3引入方式:内联样式 内嵌样式 外联样式 

定义：利用标准属性style定义样式属性值：css样式代码

缺点  只对当前元素有效，需要重复定义，html css没有有效分离

<h1  pppp style=‘color:  ;' >   </h1>

三 内嵌样式

利用style定义样式，还有type属性<style='text/css'>，text/css'表示当前定义的css样式内容，html'5可以省略

优点：不需要重复定义，缺点html css没有有效分离

<style>  h1 {color=‘’} h1 </style>

四 外联样式

利用link元素引入外部CSS

属性：rel：值为stylesheet，当前引入的CSS；type: 值为’text/css‘ ，当前引入的CSS；href：设置引入css文件的路径

优点：分离了，但需要加载多（html1个+n个css）个文件速度变慢

<link rel='stylesheet' href='style.css'>  style.css为在同一层的CSS文件

有的教材会把内嵌外联合称为外联           

五 语法                                                             声                  明

h1                          {                                          color         :              light                    ;                                        }

选择器：定位     声明块：包含多个声明     属性名称    分隔符       属性值             结束符                           另外半个声明块       

                                                                   css预定义的             不同属性不同值   (没有会小红线报错，表明一个声明结束，                                                                                                                                           分隔两个声明，最后一个可以没有，最好有)