2-4编程练习 请帮助完善
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 | <html> <head> <meta charset= "UTF-8" > <title></title> <style type= "text/css" > /*此处写代码*/ body{ margin : 0 ; padding : 0 ; color : #fff ; text-align : center ; } .yuansu{ width : 1100px ; height : 100px ; background : #000 ; position : absolute ; top : 50% ; left : 50% ; margin-top : -50px ; margin-left : -550 ; overflow : hidden ; zoom: 1 ; } .loge{ width : 200px ; height : 80px ; margin : 0 40px ; float : left ; } a{ text-decoration : none ; font-family : "微软雅黑" ; font-size : 25px ; color : #fff ; padding : 0 20px ; height : 80px ; line-height : 80px ; display : block ; } .dao { list-style : none ; float : right ; padding-right : 40px ; overflow : hidden ; zoom: 1 ; } .dao li{ float : left ; margin-right : 20px } </style> </head> <body> <!-- 此处写代码 --> <div class= "yuansu" > <div class= "loge" ><a href= "#" ><img src= "http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png" /></a> </div> <ul class= "dao" > <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> </div> </body> </html> |
0
收起
正在回答
1回答
你好同学 ,如下导航没有实现文字垂直居中显示
如下设置:
先清除默认样式 , 要使用通配符才会给所有元素设置初始化样式 , 如果你只给body设置的话 , marginhe 和padding不会继承给子元素的
logo高度也建议与头部保持一致
完善一下吧 , 祝学习愉快 ! 望采纳 .
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧