CSS简介-CSS引入方式-CSS语法格式

CSS简介

  • 什么是CSS?
    • 层叠样式表:Cascading Style Sheet
  • 有什么作用?
    • HTML标签绝对了页面的骨架,CSS可以对骨架内容进行修饰
  • 为什么使用?
    • 通过标签属性设置样式,页面会显得十分臃肿,使用CSS可以将内容显示分开,提高开发效率
    • CSS提供了很多标签属性没有的显示效果
    • CSS可以独立成文件单独加载,可以多个页面共享,可以节约带宽,降低成本
  • 文件后缀:.css

CSS引入方式

  • 方式1:行内样式表,通过标签的style属性进行设置
    <body style="background-color: red;"></body>
  • 方式2:内联样式表,通过style标签进行设置
    <head>
      <style>
          p {
              color: green;
              font-size: 30px;
          }
      </style>
    </head>
  • 方式3:外联样式表,通过link标签加载外部CSS文件
    <head>
        <link rel="stylesheet" type="text/css" href="01-common.css"/>
    </head>
  • 使用说明:
    • 当设置的属性较少,使用的地方也比较少,可以使用行内样式
    • 若样式只在页面内部使用,多个地方需要同样的效果,可以使用内联样式
    • 若多个页面需要同样的显示效果,可以选择外联样式

CSS语法格式

  • 样式要写在{}中
  • 样式是以键值对形式出现的,键和值通过:进行连接
  • 每个样式后添加一个分号,一行一个样式
  • CSS文件中不要写style标签
  • 注释写在/* */
  • 指定CSS文件字符集:@charset "utf-8";

发表评论 X

电子邮件地址不会被公开。 必填项已用*标注

姓名不能为空
填写正确的email