为了账号安全,请及时绑定邮箱和手机立即绑定

导航条菜单的制作

江老实 Web前端工程师
难度初级
时长23分
学习人数
综合评分9.53
1004人评价 查看评价
9.8 内容实用
9.4 简洁易懂
9.4 逻辑清晰
不错,学会了relative父元素下的absolute不会改变页面布局
幸好我是学完jquery过来看一下案例的
设置圆角的确可以用border-radius ,但是用背景图能自己DIV一些图上去,选择更多

已采纳回答 / 唐宋小宝
什么是块级元素?在html中<div>、 <p>、<h1>、<form>、<ul> 和 <li>就是块级元素。块级元素特点:1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(真霸道,一个块级元素独占一行)2、元素的高度、宽度、行高以及顶和底边距都可设置。3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。
.{margin:0; padding:0;} 全局基本样式清除

display:block 转换为块级标签

display:inline 转换为内联标签

display:inline-block 转换为内联块级标签

list-style:none 清楚ul或ol列表中li标签前面的项目符号

text-decoration:none 清除下划线

text-decoration:line-through 添加删除线

text-indent:2em 设置文本缩进为字号的2倍

a:hover{} 定义鼠标滑过时的链接颜色
基本的样式清除: *{margin:0;padding:0}



无序列表圆点去除: ul{list-style:none}



下划线去除: a{text-decoration:none}



文本缩进标签 text-indent 不会影响总体宽度(padding会)



需要将a标签设置为块元素,才能设高宽、hover效果 代码:a{display:block}



hover格式 a:hover{}
一看到JS JQ一脸懵逼
题目中并没有说要a标签里面的文字居中,首先老师教的没错;如果你想居中也没人绑着你不让你居中,你居中就居中嘛,在这里bibi的啥,自作聪明!

最新回答 / 谢小婷
line-height 是行高,height是高度

已采纳回答 / 小杨羊
padding-left是内左边距,它增加长度,外面的盒子当然也会被撑大了。
其实挺奇怪的,这些东西其实确实挺基础 ,刚开始学不知道从哪儿学起 听的朦胧了又在评论里说讲的不好的,完全可以花光一万多学费报个培训班啊,免费的课听着自己都没有了解学习的大致框架 不符合自己学习习惯就说讲的不好 真奇怪
这里可以用text-align啊,并不是a设成了display:block就不能设置text-align:center了,因为这个属性影响的是元素内部的内联元素吧。另外,大家想尝试除老师介绍外的新东西不是挺好的嘛,哈哈哈。

最新回答 / qq_Jabo
obj.className ="defineClassName" (对象.className ="类"); 绑定类 明白不? 

最赞回答 / Airly
我没用定时器。这样写也可以window.onload=function(){    var aLi=document.getElementsByTagName('li');    for(var i=0; i<aLi.length; i++){ aLi[i].onmouseover=function(){ var subNav = this.getElementsByTagName('ul')[0]; if(subNav){ var This = subNav; This.style....

最新回答 / 门外小白3342804
这个思路是先选定所有li,然后在其上绑定事件,事件内容为<ul class="subNav">的高度拉长或变短。this.getElementsByTagName("ul")是鼠标经过的li下的所有ul,这是一个数组,if(oSubNav)无法判断。加上【0】就是当前鼠标经过的li下的第一个ul,如果存在,就执行事件内容,如果改为【1】那就不存在,不执行
课程须知
1.熟悉html知识,尤其对<ul>和<a>比较熟悉; 2.对css样式比较了解; 3.掌握JavaScript和jQuery基础知识。
老师告诉你能学到什么?
轻松制作出各种形式的网站导航条菜单

微信扫码,参与3人拼团

微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消