• CSS(层叠样式表)


      CSS层叠样式表是用在标准文档流中的,它的引用方式分为以下三种;

      1 使用外部样式表

           格式<link rel="stylesheet"  href=".css">  表示引用外部资源,该代码放在HTML文件中的head标签中,

           特点:实现了内容结构与表现形式代码的分离,方便重复使用和维护;

         使HTML的代码更加简洁,有利于程序员和搜索引擎的优化。

      2 使用内部样式表

          格式 <head>

          <style>

            (css代码)

          </style>

        </head>

      特点:没有了样式表的文件,在某些时候可以提升效率;

         多了页面难以共享样式,不利于代码的重复使用;

         HTML和CSS代码相互混合,不利于程序员和搜索引擎的阅读。

      3 使用行内样式表

          格式:<style=" ">   (添加在body的具体的某一个元素内 如<p> <i>)   CSS代码写在元素的style属性中,行内样式表不写选择器。

       特点:没有了样式表的文件,在某些时候可以提升效率;

         多了页面难以共享样式,不利于代码的重复使用;

         HTML和CSS代码相互混合,不利于程序员和搜索引擎的阅读;

         与javacript操作的是行内样式;

         在测试模式使用时,可以立即展现出效果。

      CSS的注释格式:/*注释内容*/

      CSS代码格式:h1{color:red;text-align:center}     (h1表示选择器 表示该规则应用到那个元素上    color:red;text-align:center  表示声明块有哪些规则)

          CSS选择器:

           1 元素选择器:      书写格式:  标记名{   声明块   }           (表示所有的该标记名都将应用该标签的规则)

        2  类选择器:        书写格式:.类名{    声明块  }                  (所有class属性为指定类名的元素都将应用该标签的规则)

       3  ID选择器:         书写格式 : #ID值{   声明块      }               (属性为ID值的元素将应用该标签的规则)

               4  组合选择器:     书写格式:  例如h1,h2,h3{    声明块  }          (该规则将同时应用到多个选择器上)

               5  伪类选择器:     书写格式:  元素名称:伪类名称  例如 a:link { 声明块  }   (表示用户在未点击的相关信息)

       6  后代选择器:      书写格式:父级选择器名称+空格+子级选择器名称{   声明块     }  例如div p{  声明块  }     (表示该规则将应用到父级元素的具体子级元素)

       7 子级选择器:      书写格式: 父级元素名称>子级元素名称 {  声明块  }    (与后代选择器相似)

            弄清楚各个选择器的应用范围和什么时候使用不同的样式表,这样可以在编写代码时候减少错误率,同时还能提高代码书写的效率。

  • 相关阅读:
    linux常用命令
    练习00004
    python学习第六天
    练习00003
    练习00002
    python学习第四天
    练习00001
    Linux_安装mysql踩坑日记
    Linux_更改远程登录端口以及禁止root用户登录
    redis_基础_基本使用
  • 原文地址:https://www.cnblogs.com/whitesnow/p/7638520.html
Copyright © 2020-2023  润新知