为了账号安全,请及时绑定邮箱和手机立即绑定
首页 手记 【九月打卡】第16天...

【九月打卡】第16天 javascript(导航菜单及内容菜单)

2022.09.20 21:46 36浏览

1.课程名称:javascript 导航菜单及内容菜单


课程章节:导航菜单得结构


2.课程内容:

            首先添加一个div容器模板

    https://img4.sycdn.imooc.com/632993be0001c3a408880182.jpg

    然后再写入css样式

    .menu-box

    宽度 高度 绝对定位 边距,背景颜色 透明度以及优先级

.{
    ::: : : :(): :

    

https://img3.sycdn.imooc.com/632994970001532213330499.jpg

    https://img2.sycdn.imooc.com/6329b934000145a205970638.jpg

    然后设置内容菜单div,

    https://img2.sycdn.imooc.com/6329ba970001a46108770513.jpg

    

    设置它的css,基本上跟上面那一个基本一样

    .menu-content

    weight =244

    heigth = 254

    position =absolute   //绝对定位

    left = 0

    top = 0

    z-index = 2

    padding-top = 6px    填充高度6px


    https://img2.sycdn.imooc.com/6329c02d0001ef2913050707.jpg


    加入内容 在index.html   在menu-content下面添加

    添加一个容器,加上超链接

    <div class=menu-item>

    <a href="">

        <span>手机 配件</span> 

            <i>&#xe665</i>

    </a>


</div>

    https://img2.sycdn.imooc.com/6329c3b80001bdf111790675.jpg

    完成:

    https://img2.sycdn.imooc.com/6329c3ee00012cb315750692.jpg


    下一节继续完善 O(∩_∩)O















点击查看更多内容
0人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
全栈工程师
手记
粉丝
4
获赞与收藏
0

关注TA,一起探索更多经验知识

同主题相似文章浏览排行榜

风间影月说签约讲师

50篇手记,涉及Java、MySQL、Redis、Spring等方向

进入讨论

Tony Bai 说签约讲师

146篇手记,涉及Go、C、Java、Python等方向

进入讨论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消