选择器和复杂选择器

       举例css文件：

       在css文件中添加内容如下：

       .foot_area1{
width: 70%;
height: 20px;
margin: 0 auto;

}

      在html文件的标签中，添加内容如下：

     

• 关于我们|


• 联系我们|


• 联系客服|


• 合作招商|


• 商家帮助|


• 营销中心|


• 手机京东|


• 友情链接|


• 销售联盟|


• 京东社区|


• 风险监测|


• 隐私政策|

       则该

可以调整为全屏宽度的70%，高20px,自动居中

                       

CSS:

       css中很重要的一个是使用选择器，如上方的14条内容，使用的是类选择器。

      1. 先介绍标签选择器，在css文件中添加

li{
list-style: none;
float: left;
color: #666;
line-height: 5px;
margin-right: 10px;
margin-top: 10px;
}

这段内容会对li标签进行样式添加，所有包含该标签的都会变成这种样式

        2.类选择器

        格式为  .类名{样式}  如：

.foot_area1{
width: 70%;
height: 20px;
margin: 0 auto;

}

     

• 关于我们|


• 联系我们|


• 联系客服|


• 合作招商|


• 商家帮助|


• 营销中心|


• 手机京东|


• 友情链接|


• 销售联盟|


• 京东社区|


• 风险监测|


• 隐私政策|

通过定义类名，设置样式，然后在需要的标签中，用class="设置的类名"，即可调用样式

可以

   也可以

        3.ID选择器

        格式   #名{内容}

css内：

         #a{

         width:500px;

         height:500px;

         background-color:#999;

         }

html内：

         

使用id选择器，然后让div区域变成500*500，颜色为#999；

 

       4.复合选择器

       1)并集选择器：用逗号隔开

           格式：.名1,.名2{内容}

.center_button1,.center_button2,.center_button3{
width: 158px;
height: 44px;
float: left;
margin-left: 30px;
        margin-top: 10px;
        line-height: 44px;

        text-align: center;
}

        2)后代选择器：用空格隔开，先父后子

        格式：名1   名2{内容}

.input li{
    float: left;
    margin-right: 10px;
    white-space: nowrap;
    color: #999;
    line-height: 20px;
list-style: none;
font-size: 12px;
}

        3）超链接选择器：

a:link{}

a:visited{}

a:hover{}

a:active{}

  超链接选择器4个的顺序不能变

  注：选择器很重要