4-5编程练习，麻烦老师帮忙检查

qq_烟锁池塘_0 2018-01-17

源自：盒子模型 4-7 编程练习

31

收起

4回答

好帮手慕糖回答被采纳获得+3积分 2018-01-18 10:22:13

你好，经测试，实现效果没有问题，建议：3个hover事件可以统一的来写，例：

.big div:hover ul{
    display: block;
}

祝学习愉快~

qq_烟锁池塘_0 提问者 #1

非常感谢！

2018-01-18 11:12:26
qq_烟锁池塘_0 提问者 #2

老师 .big 代表什么

2018-01-18 11:13:12

好帮手慕糖 2018-01-18 11:17:46

你好，.big就是定义的big元素呀，.big div就是指.big元素下的div呀，你结合代码看下。

祝学习愉快~

好帮手慕糖 2018-01-18 09:31:49

你好，该代码实现效果没有问题，但是这个是案例的代码，不是4-5的练习哦，而且，这个与图片中的代码也不一样，看一下是否是粘贴错代码了。

祝学习愉快~

提问者 qq_烟锁池塘_0 #1

抱歉老师代码粘错了，以下是正确的： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>display属性</title> <style type="text/css"> /*样式补充*/ body,div,h3,ul,li{margin:0px;padding:0px; font-family:"微软雅黑";} .big{width:150px; background-color:#d9dde1;text-align:center;margin:0px auto;} .div1{border:1px #919394 solid;padding:10px 0px 0px ;border-bottom:none;} .div2{border:1px #919394 solid;padding:10px 0px 0px;border-bottom:none;} .div3{border:1px #919394 solid;padding:10px 0px 0px;} li{list-style-type:none;background-color:#fff;padding:10px;} ul{display:none;} .div1:hover .elec{display:block;} .div2:hover .wash{display:block;} .div3:hover .clothes{display:block;} </style> </head> <body> <div class="big"> <div class="div1"> <h3>家电</h3> <ul class="elec"> <li>冰箱</li> <li>洗衣机</li> <li>空调</li> </ul> </div> <div class="div2"> <h3>洗护</h3> <ul class="wash"> <li>洗衣液</li> <li>消毒液</li> <li>柔顺剂</li> </ul> </div> <div class="div3"> <h3>衣物</h3> <ul class="clothes"> <li>衬衫</li> <li>裤子</li> <li>卫衣</li> </ul> </div> </div> </body> </html>

2018-01-18 10:12:39

好帮手慕糖 2018-01-17 15:35:22

你好，只有图片，无法进行测试，建议：直接把你的代码粘贴过来。

祝学习愉快~

提问者 qq_烟锁池塘_0 #1

老师，代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS样式实例</title> <style type="text/css"> body,div,p{margin:0px; padding:0px; font-family: : "微软雅黑"} .one{width:220px; background-color:#f2f4f6;border: 1px #f2f4f6 solid;margin:0px auto;} .two{width:100%;height:150px;background-color: black;} .p1{font-size: 20px; color: #fff; font-weight: bold;text-align: center;line-height: 150px } .list{font-size: 14px;border-bottom: 1px #d9dde1 solid;margin: 0px 15px;padding: 10px 0px 5px 5px;line-height: 1.5em;} span{font-size: 12px; color:#c5c6c8;} .spen{border-bottom: none;} </style> </head> <body> <div class="one"> <div class="two"> <p class="p1">前端课程安排</p> </div> <div class="list"> <p>HTML+CSS基础课程</p> <span>466609人在学</span> </div> <div class="list"> <p>HTML+CSS基础课程</p> <span>466609人在学</span> </div> <div class="list spen"> <p>HTML+CSS基础课程</p> <span>466609人在学</span> </div> </div> </body> </html>

2018-01-17 19:36:05

相似问题

老师麻烦检查下

老师，第2章内部类的编程练习呢，是不是漏了

编程练习会有老师检查吗？

编程练习.。

4-8编程练习无法用浏览器检查功能查看

登录后可查看更多问答，登录/注册

前端小白入门系列课程

参与学习人
提交作业 11218 份
解答问题 36713 个

从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！

本课精华内容

问答作业

为什么我的没有框

5 45

表格的问题

377 41

大家好,body前面有一个红色的小××，麻烦大家帮我看看

378 40

到底是cellspacing还是cellpacing?

0 35

课间活动的表格怎么实现，想了很久也想不出来

60 30

查看更多本课问答

请稍等 ...

意见反馈帮助中心 APP下载