CSS总结与复习(1)

98 阅读1分钟

CSS简介

CSS简单来说CSS的作用是为网页中的元素设置样式。

通过CSS来修改元素的样式,有三种方式。第一种方式叫内联样式或行内样式,第二种方式是内部样式表,第三种方式是外部样式表。

内联样式

内联样式,是在标签内部通过style属性来设置元素的样式。

    <p style="color:red;font-size: 60px;"></p>

内部样式表

内部样式表即将样式编写到head中的style标签里,通过CSS选择器来选中元素并为其设置各种样式。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            p{
                color:green;
                font-size: 60px;
            }
        </style>
    </head>

外部样式表

外部样式表是前端开发中的最佳实践。它可以将css样式编写到一个外部的css文件中,然后通过link标签来引入外部的css文件。

在style.css文件设置样式

    p{
        color:tomato;
        font-size: 60px;
    }

CSS语法

CSS的语法由选择器和声明块组成。

选择器

选择器的作用是选择页的指定元素,比如p的作用就是选择页面所有的p元素。

    p{}

声明块

声明块即大括号的内容,它指定要为元素设置的样式。声明块是一个名值对结构,名和值之间以:连接,以;结尾。

    p{
         color:red;
         font-size: 40px;
     }
    h1{
         color: green;
      }