css介绍与引入

编辑本博客

css:层叠样式表

  • 内容与样式分离
  • 网页样式统一,容易修改
  • 丰富样式,使页面布局更加灵活
  • 减少网页代码量,提升网页浏览速度,节省网络资源
  • 运用独立页面的css,有利于被搜索引擎收录

CSS引入方式

  • 行内样式
  • 内接样式
  • 外接样式
  1. 连接式
  2. 导入试,也可以在一个css文件中@import另一个css文件
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>css引入</title>
        <!--连接外部css资源,连接式-->
        <link rel="stylesheet" href="./index.css">
        <style type="text/css">
            /*写内接样式表*/
            /*标签选择器,检索整个文档标签,所有标签具有共性*/
            span{
                color:green;
            }
        </style>
        <!--连接外部css资源,导入式-->
        <style type="text/css">
            @import "index.css";
        </style>
    </head>
    <body>
        <div>
            <!--行内样式,直接在标签上用style引入-->
            <p style="color:red">我是一个段落,引入行内样式</p>
        </div>
        <div>
            <!--内联样式-->
            <span>我是另一个span标签,使用内接样式</span>
            <a href="#">我是a标签,使用外接样式表,连接式</a>
        </div>
    
    </body>
    </html>
    View Code

 每个样式以键值对形式,以冒号结束

posted @ 2018-06-05 07:56  丫丫625202  阅读(150)  评论(0编辑  收藏  举报