7.28

作者: 小豪豪豪豪豪豪 | 来源:发表于2018-08-20 09:55 被阅读0次

导航条变色

<style type="text/css">
*{
margin:0;
padding:0;
box-sizing: border-box;
}
li{
list-style: none;
}
a{
text-decoration: none;
}
ul{
width:500px;
margin:0 auto;
height:40px;
line-height: 40px;
background: #e4393c;
}
ul>li{
float:left;
}
ul>li>a{
display: inline-block;
width:100px;
text-align: center;
color:#fff;
}
</style>
<body>
<ul>
<li>
<a href="#">首页</a>
</li>
<li>
<a href="#">公司介绍</a>
</li>
<li>
<a href="#">联系我们</a>
</li>
<li>
<a href="#">涉及分类</a>
</li>
<li>
<a href="#">综合设计</a>
</li>
</ul>
<script type="text/javascript">
var li=document.querySelectorAll('ul>li');
console.log(li);
for(var i=0;i<li.length;i++){
li[i].onmouseover=function(){
this.style.background='#fff';
this.firstElementChild.style.color='red';
}
li[i].onmouseout=function(){
this.style.background='#e4393c';
this.firstElementChild.style.color='#fff';
}
}
</script>
</body>

相关文章

  • Day4作业-学生管理系统

    7.28更新管理系统3.0

  • 我在稻城做义工 7.29

    7.28 稻城 早雪 中午阴 下午晴 7.29 稻城 早晴 中午晴 下午雨 毫不夸张的说,7.28,一定是我来稻城...

  • 7.28

    导航条变色 *{margin:0;padding:0;box-sizing: border-box;}li{lis...

  • 7.28

    生存挑战第六天: 来长沙快一个月了,我最感谢的人就是老大(经理),在我快活不下去的时候帮助我。还有给我介绍...

  • 7.28

    有的时候换个思维方式看待世界。你会发现一个新的世界。

  • 7.28

    睡了一天,头昏脑涨,再睡一晚上,明天奋斗。

  • 7.28

    我看书,这使我多活几度生命。

  • 7.28

    今天休息一天,领着一只寄存的小汪汪出去玩,明天继续加油

  • 7.28

    为什么我一到晚上就犯困 好困。好困。好困

  • 7.28

    出汗的感觉真好,原来世界这么美妙。这么久没出门的我像是大山里的孩子,外面的一切都充满了新奇,虽然是陪老六去看病,...

网友评论

      本文标题:7.28

      本文链接:https://www.haomeiwen.com/subject/lldkiftx.html