【九月打卡】第17天 javascript（导航菜单样式）

1.课程名称 ：导航菜单样式

课程章节：javascript（导航菜单样式）

2.课程内容：

        首先把菜单文字写进去

开始写css

 首先把默认的超链接下划线去掉

a:link,a:visited{

    text-decoration: none;

}

效果

    

    继续完善 mune-item

    height:64px  高度

    line-height:66px 行高

    font-size:16px 字体大小

    padding: 0 24px  上0 右 24

    position 相对定位

效果

    

    

    设置超链接字体为白色

    .mune-item a:link ,mune-item a:visited{

    color:white;

}

 

继续添加下划线 超链接文字下的下划线

  .mune-item a {

    display :block

    border-bottom: 1px solid rgba(255,255,255,0.2)       //下边框

    padding: 0.8

    height:63px 下滑线高度

}

 效果

   

然后完善 箭头

导入箭头图片

写入css样式

    

绝对定位

右 32px   字体大小24px  高0  引用箭头图标  不倾斜 字体不加粗

效果：

本节完！O(∩_∩)O

三 本节重点 需要重复多练这些样式！！！