CSS层叠样式表(一)

时间:2022-03-09 13:19:19

一、css含义

层叠样式表,用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。CSS目前最新版本为CSS3。

二、几种样式控制方式(就近原则)

1、行内样式

<body>

    <div style="color:red;"></div>

</body>

2、内联样式

   <head>

           <title>这是内联样式</title>

           <style type="text/css">

                   div{

                      color:red;

                      }

          </style>

   </head>

3、链接式

<link rel="stylesheet" type="text/css" href="base.css"/>

4、导入式(几乎不用)

 

<style>

 

 @import url(1.css)

 

</style>

 

三、css选择器

1、标签选择器 

       div{

           width:200px;

           height:300px;

           color:red;

       }

2、类选择器

        .c1{

 

           width:200px;

 

           height:300px;

 

           color:red;

           }

   <div class="c1"></div>

3、id选择器(唯一)

     #d1{

 

     width:200px;

 

     height:300px;

 

     color:red;

 

        }

 <div id="d1"></div>

优先级:标签<class<id

四、字体样式(继承)

 

div{
 font-size:14px;
 font-family:"微软雅黑";
 color:#FF0000;
 font-weight:bold;
 text-decoration:underline;
 text-decoration:overline;
 text-decoration:line-through;

 

}

五、css注释

/* 注释 */