CSS基础


  当一个页面的结构搭建完成之后,需要使用css样式表对其进行修饰,使得用户的体验更舒适,交互效果更好。CSS的全称是:cascading style sheet (层叠样式表)。其作用就是对网页进行渲染,控制网页的样式。

  CSS的语法组成:

    选择符 + 声明;

    选择符选择的是要做渲染的标签;声明就是做什么样的渲染,声明又是由属性和属性值组成。

  所有的CSS语句都要放在CSS样式表中。CSS样式表又分为三类:内部样式表、外部样式表、行内样式表。

行内样式表:

  顾名思义是写在标签里的样式,其语法为: <标签 style = "行内样式表">

内部样式表

  内部样式表是放在 head 标签内的

          /* type="text/css"可以不写 */         

    css语句

       

外部样式表

  单独创建一个后缀名为 .css 的文件。然后导入HTML文件中。

  导入的方法:

    一、使用link标签

      

        rel="stylesheet"  建立关联性

                        href="url"        导入css样式表的路径

    二、       两种导入方式的区别:         1.本质上的差异:link属于html标签;@import属于css提供的方法。                   2.加载顺序:link导入的 css 和 html结构 同时加载;@import 等待所有的结构加载完毕 再 加载css。                   3.兼容方面:link的兼容性比较好;@import比较差                   4.js控制 dom 的差别:@import导入 css样式,js动态控制样式的时候,会失效。   三种样式表的权重:         内联样式表权重最高;         内部样式表和外部样式表的权重,后写的会覆盖前写的。         覆盖的只是相同样式,不同样式会继续执行。