51-CSS介绍

一、什么是CSS

CSS全称Cascading Style Sheet层叠样式表,是专用用来为HTML标签添加样式的。

  • 样式指的是HTML标签的显示效果,比如换行、宽高、颜色等等
  • 层叠属于CSS的三大特性之一,我们将在后续内容中介绍
  • 表指的是我们可以将样式统一收集起来写在一个地方或者一个CSS文件里

二、为什么要用CSS

修改HTML标签的样式需要为每个HTML标签单独定义样式属性。这样做的缺点有:

1、记忆困难:需要记忆每个标签的所有样式相关属性,如果标签没有某个样式相关的属性,那么设置了也没有效果

2、代码耦合度高:HTML语义与样式耦合到一起

3、扩展性差:当某一类样式需要修改时,我们需要找到所有设置了该样式标签进行修改。这样既繁琐又比较丑,拿出去给别人看容易恶心到别人。

三、怎样使用CSS

1、CSS的语法
选择器 {
    声明1;
    声明2;
    …
}

其中声明由属性:值组成

2、四种引入方式
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--外链式 -->
    <link rel="stylesheet" href="css/a.css">

    <!--嵌入式    -->
    <style>
        p {
            color: green;
            font-size: 30px;
        }
    </style>


    <!--导入式(了解)
    <style>
        @import url("css/a.css");
    </style>
    -->
</head>
<body>
<p>你好呀</p>

<!--行内式-->
<!--<p style="color: red;font-size: 50px">你好呀</p>-->
</body>
</html>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。