一聚教程网:一个值得你收藏的教程网站

热门教程

CSS的Class以及ID选择器

时间:2022-07-02 12:22:37 编辑:袖梨 来源:一聚教程网

9、CSS的Class以及ID选择器

id和class的不同指出在于一个页面同一个ID只能只有一次,而class可以无限制使用。
  同样,你可以在html选择器后面使用一个选择器来指定特殊HTML元素,比如p.jam{值}将作用到带有'jam'class属性的段落。
10、这个都差点忘了。页面布局
      clear    float    disply等这几个,关于网站用div+css主要把这个用好。
总结:基本上都差不多,css的概念都有了一个了解,必定我们是做web开发,但是css,html前端的我们不能不知道,要知道个大概,查资料也知道怎么查就行了。所以我接下来想做一个demo来演示一下。今晚发上,希望大家支持一下黑侠客,我也是一只很老的,现在才踏进来这个web之间,希望大家多多帮助,谢~
11、演练html+css


由于我的目的是学习web开发,所以这个html+css不要求太精,了解一下大概,在以后我拿到一个实例可以改就行了,这就是我的目的。不知道大家是什么要求。
接下来我就改一下百度的页面,因为本人比较懒,比较大的页面可能没有耐心做下去,就模仿一下百度吧,也不知道这两天学的行不行.

    首先看到这个布面,我先分析结构,用html把结构弄出来,接下来再看表现方式用css定义。

 代码如下 复制代码



        html+css baidu.com demo
   
   

       


     
            

      

                   

                           
  • 新闻

  •                    
  • 网页

  •                    
  • 贴吧

  •                    
  • 知道

  •                    
  • MP3

  •                    
  • 图片

  •                    
  • 视频

  •                

             

       

               
                         
             
 
       

           

                   
  • 帮助

  •                
  • 搜索

  •             

        

      
        


body{
        width: 98%;
        margin: 0px auto;
}
#login{
        float: right;
        font-size: 12px;
        padding-top: 7px;
}
#log{
        background-image:url(../images/log.gif);
        height:129px;
        padding:0;
        background-repeat: no-repeat;
        background-position: center;
}
#txt ul{
        float: left;
}
input #btn{
   color: Blue;
}
#nav{
    margin: 0px auto;
         height: 200px;
}
#link ul{
        margin: 0px auto;
        color: Black;
   float: left;
}
#copy{
        clear: both;
   text-align: center;
        color: #7777cc;
        font-size: 12px;
}
#copy a{
        color: #7777cc;
}

 

热门栏目