请问老师,我的分割线为什么显示不出来呀?
老师可以之间看.fengexian这个样式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0;padding: 0;}
a{text-decoration: none;}
body{background: rgb(150,150,200);}
.big{width: 100%;height: 100px;background: black;position: fixed;}
.tit-li{float: right;width: auto;color:white;font-size: 30px;line-height: 100px;margin-right: 100px;}
.logo{float: left;}
.foot{width:100%;height: 100px;background: black;position: fixed;bottom: 0px;}
.foot-ul{margin:0 auto;width: 1100px;}
.foot-li{color:white;font-size: 30px;line-height: 100px;margin-right: 100px;float: left;}
.foot-li:nth-child(5){margin-right: 0px;}
.main{padding-top: 100px;width: 80%;margin: 0 auto;font-size: 30px;}
.left{float: left;width: 25%;padding-top: 50px}
.middle{float: left;width: 25%;margin-left: 3%;padding-top: 50px}
.fengexian{width: 1%;background: orange;float: left;height: 800px;margin: 0 3%;}
.right{float: right;width: 40%;padding-top: 50px}
.h3-li{background: pink;}
.input{width: 300px;height: 50px;}
.submit{width: 300px;height: 50px;background: red;}
</style>
</head>
<body>
<div class="big">
<div class="logo">
<img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png">
</div>
<div class="tit">
<div class="tit-li">手记</div>
<div class="tit-li">猿问</div>
<div class="tit-li">实战</div>
<div class="tit-li">职业路径</div>
<div class="tit-li">课程</div>
</div>
</div>
<div class="main">
<div class="left">
<h1>课程推荐</h1>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
</div>
<div class="middle">
<h1>课程推荐</h1>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span class="h3-li">职业路径</span> HTML5与CSS3实现动态网页</p>
</div>
<div class="fengexian"></div>
<div class="right">
<h1>登录</h1>
<br><br>
<form>
<input class="input" type="" name="" value="" placeholder="请输入登录邮箱/手机号">
<br><br>
<input class="input" type="text" name="" value="" placeholder="请输入密码">
<br><br>
<input class="submit" type="submit" value="提交">
</form>
</div>
</div>
<div class="foot">
<div class="foot-ul">
<div class="foot-li">网站首页</div>
<div class="foot-li">网站首页</div>
<div class="foot-li">网站首页</div>
<div class="foot-li">网站首页</div>
<div class="foot-li">网站首页</div>
</div>
</div>
</body>
</html>
正在回答
用Chrome测试你的代码之后显示如下:
这个分割线是可以显示出来的!建议你用主流浏览器测试一下,如果还有问题,可以继续提问哦!
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星