CSS学习笔记1:基础知识

CSS规则由两部分组成,选择器和声明
    选择器:标签,告诉浏览器哪些标签需要用到这个样式
    声明:样式的内容,由一或多对属性:值以;隔开组成,由{}包围,需要多个选择器时以逗号隔开
    例如:p,h1{font-size=“50px”;
                  color=“blue”}
    CSS的注释:/* */
CSS的引用方式:
  1. 行内样式(内联样式)
  2. 内部样式(嵌入样式)
  3. 外部样式表
  4. 导入式
 
行内样式:
    直接在开始标签写入style,与标签的属性类似 <p style=“color:red”>内容</p>
     与html同时加载
 

内部样式:    
    写在<head>    </head>标签内的style标签里
    <head>
            <style type=“text/css”>
                    <!--
                    CSS样式
                    -->
            <style>
    </head>
    在用内部样式时,需要将style里的内容用html的注释来注释起来,因为一些低版本的浏览器不支持style标签
    与html同时加载
 

外部样式表:
    外部样式就是吧css单独写在一个css文件中,再将其导入到html中
    css文件中直接写入一或多个选择器和声明的组合即可
    引用:
        在html的head标签里:<link href=“xxx.css” type=“text/css” rel=“stylesheet" />
        rel 属性规定当前文档与被链接文档之间的关系,只有 rel 属性的 "stylesheet" 值得到了所有浏览器的支持。其他值只得到了部分地支持。
    html加载时同时加载css样式
    一般选用外部样式表
    优点:
  1. css和html分离
  2. 多个文件可以使用用一个样式的内容
  3. 多个文件引用同一个css文件,css只需加载一次

导入式:
    需要在head里写入style标签,再在style标签里使用导入式的方法
      <style type=“text/css”>
            @import ”xxx.css” 或
            @import url(xxx.css) 
      </style>
    html加载完后再加载css样式
    缺点:可能出现html加载很慢,还没加载完时显示出来的内容无css
 
优先级:
    一切遵循究竟原则,行内样式永远最优先,其它的取决于引用位置
原文地址:https://www.cnblogs.com/liangjiahao713/p/6761916.html