zoukankan      html  css  js  c++  java
  • 导航栏

    .nav ul{
    980px;/*设置元素宽度为980px*/
    border:1px solid #000;/*设置一个颜色为#000,宽度为1px的边框*/
    margin:0px auto 0px auto;/*也可以简写为margin:0 auto*/
    
    }
    
    .nav ul li{
    float:left;/*让li元素左浮动*/
    list-style-type:none; /*去掉前面的小点
    }
    
    .nav ul li a{
    80px;/*设置元素宽为80px*/
    height:28px;/*设置高度为28px*/
    line-height:28px;/*设置行距为28px,让文字在每行的中间位置*/
    background:red;/*设置元素的背景为红色*/
    color:#FFF;/*文字颜色是白色*/
    margin:5px 10px;
    font-size:12px;/*用12号字*/
    display:block;/*这个比较关键,因为a本身就是联级元素,本身不具有宽高,
    
    用这个把它变成块级元素,这样前面设置的宽和高就能起作用了*/
    text-align:center;/*让文本居中*/
    text-decoration:none; /*去掉下划线*/
    }

    当访客鼠标放到某个元素上的时候,这个元素要有别于其他元素。要实现这个我们就要用到:hover这个伪类。在样式中加入以下代码。

    .nav ul li a:hover{ /*这个大概的意思就是当鼠标放到这个a元素的上面时,这个a元素的样式就按下面的代码执行*/
    
    78px;
    
    height:26px;
    
    line-height:28px;
    
    border:1px solid red;
    
    color:red;
    
    background:#FFF;
    
    }
    

      



      

  • 相关阅读:
    可左右拖动窗口demo
    制作一个简单的百度网盘在线视频加速的chrome插件
    git分支
    使用git的ssh
    git的概念和常用命令
    爬虫:获取页面 -- request库的使用
    字符串方法
    从实现原理更深入了解call和apply
    Git和GitHub使用
    localStorage和sessionStorage
  • 原文地址:https://www.cnblogs.com/yuchao19950412/p/5546469.html
Copyright © 2011-2022 走看看