初学CSS笔记

本文将简单介绍下CSS来方便日后的CSS的学习。

CSS 全称 Cascading Style Sheets,中文意思是层叠样式表。如今支持最广泛的是CSS 2.1,同时还有CSS 3也是我们的主要学习内容。

下面我们将列出几种适合初学CSS的学习资源。

  1. CSS 2.1 中文 spec
  2. CSS Tricks
  3. Codrops 炫酷 CSS 效果

接下来,我们将介绍引入 CSS 的几种最基本的用法

  1. 内联样式,把 style 属性写到标签里面

    示例:

    
    

  2. 不使用 style 属性,使用 style 标签,一般是写在 里面,不写在里面也无所谓。

    示例:

        
    
    

    不用在任何一个标签里写 style 属性,导致标签太长。

  1. 外部样式,使用 link 标签引入外部文件,这样避免 style 标签过长,使得文档更加纯粹。

    示例:

      
    

    这会发起一个 对 ./a,css 的GET请求

  1. 在CSS文件里面引入另外一个CSS

    示例:

    a.css

    @import url(./b.css);
    body {
        background-color: gray;
    }
    h1 {
        text-align: center;
        color: red;
    }
    

    在引入 a.css 之前 再引入一个 b.css

注意:
在同时使用多种引入方式时,我们要知道这些引入方式的优先级。

  1. 由于HTML的代码是从上到下执行的,所以 style 标签 (内部样式表) 和 外部样式表一般是没有优先级高低之分的,而是按照就近原则,哪种方式最后执行,哪种优先级就高。
  2. 由于就近原则,所以一般内联样式的优先级都是高于内部和外部样式表的。

你可能感兴趣的:(初学CSS笔记)