仿知乎前端页面

<!--主8左侧--> <div class="col-md-8"> <!--发现页左上--> <div> <img alt="Brand" src="../img/topic.png" style="margin-right: 5px"> <span style="font-size: 14px;color: #666666">编辑推荐</span> <a target="_blank" href="#/topics" style=" float: right;font-size: 14px;color: #666666" > 更多话题>> </a> </div> <hr style="background-color: #cccccc ;height: 2pt"> <!--发现页左中--> <div class="media " ng-repeat="question in questions"> <h3><a href="#"><strong>{{question.questionTitle}}</strong></a> </h3> <ul class="nav navbar-nav myNav" style="position:static;float:none;clear:both;"> <li> <img src="../img/explore_icon_1.jpg" style="height: 55px;width: 55px;"> </li> <li> <h5>{{question.authorName}}</h5> </li> <li> <h5><img src="../img/renzheng.png" > </h5> </li> <li> <h5>{{question.authorIntroduce}}</h5> </li> </ul> <div class="media-left" style="position:static;float:none;clear:both;"> <a href="#"> <img class="media-object pic-1" src="../img/{{question.thumbnail}}" > </a> </div> <div class="media-body"> <p style="clear:both"> {{question.content}} <strong>阅读全文</strong> </p> </div> <hr style="background-color: #cccccc ;height: 2pt"> </div> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <a href="#" > <strong>{{question.subtitle1}}</strong> </a> </h4> <h5 style=" float: right;font-size: 20px;color: #666666" > {{question.FAQ}} </h5> </div> <hr style="background-color: #cccccc ;height: 2pt"> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <a href="#" > <strong>{{question.subtitle1}}</strong> </a> </h4> <h5 style=" float: right;font-size: 20px;color: #666666" > {{question.FAQ}} </h5> </div> <hr style="background-color: #cccccc ;height: 2pt"> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <a href="#" > <strong>{{question.subtitle1}}</strong> </a> </h4> <h5 style=" float: right;font-size: 20px;color: #666666" > {{question.FAQ}} </h5> </div> <hr style="background-color: #cccccc ;height: 2pt"> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <a href="#" > <strong>{{question.subtitle1}}</strong> </a> </h4> <h5 style=" float: right;font-size: 20px;color: #666666" > {{question.FAQ}} </h5> </div> <!---发现页左下--> <nav class="navbar navbar-default"> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li class="active"><a href="#/daily_hot">今日最热 </a></li> <li><a href="#/monthly_hot">当月最热</a></li> </ul> </div><!-- /.navbar-collapse --> </nav> <div class="media white" ng-repeat="question in questions"> <h3><a href="#"><strong>{{question.questionTitle}}</strong></a> </h3> <ul class="nav navbar-nav myNav" style="position:static;float:none;clear:both;"> <li> <button type="button" class="btn btn-default" style="float: left;color:#eff6fa;background-color: #698ec1">5200</button> </li> <li> <h5>{{question.authorName}}</h5> </li> <li> <h5>{{question.authorIntroduce}}</h5> </li> </ul> <div class="media-body"> <p style="clear:both"> {{question.content}} <strong>阅读全文</strong> </p> </div> <ul class="nav navbar-nav myNav" style="position:static;float:none;clear:both;"> <li> <h5><img src="../img/add.png" style="margin-right: 10px">加关注</h5> </li> <li> <h5><img src="../img/comment.png" style="margin-right: 10px">{{question.collectionCount}}条评论</h5> </li> <li> <h5><img src="../img/dot.png" style="margin-right: 3px"></img>作者保留权利</h5> </li> </ul> </div> <!--<div class="panel-heading">--> <!--<img alt="Brand" src="../img/zhi.jpg" style="width: 60px;height: 57px ;margin-right:20px;"class="topic-pic">--> <!--<span><a href="#">知乎</a></span>--> <!--<url class="nav navbar-nav navbar-right" >--> <!--<li><a href="#"><span class="glyphicon " aria-hidden="true"></span>热门排序</a></li>--> <!--<li><a ><span class="glyphicon " aria-hidden="true"></span>|</a></li>--> <!--<li><a href="#"><span class="glyphicon " aria-hidden="true"></span>按时间排序</a></li>--> <!--</url>--> <!--</div>--> </div> </div> <!--主4右侧--> <div class="col-md-4"> <!--热门圆桌--> <div> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <strong>热门圆桌</strong> </h4> <a href="#"> <h5 style=" float: right;font-size: 17px;color: #666666" > 更多圆桌>> </h5> </a> </div> <div class="media "> <div class="panel-heading"> <img alt="Brand" src="../img/nuobeier.png" class="topic-pic" style="float: left"> <div style="display: inline;"> <a href="#" style="float: left;font-size: 15px;margin-bottom: 8px">2017诺贝尔奖巡礼</a> <font color="#999999"size="3px" style="float: right;margin-bottom: 8px">还有两天结束</font> </div> <div style="display: inline"> <font color="#999999"size="3px" style="float: left;">666 人关注</font> <font color="#999999"size="3px" style="float: right"> · 55 个问题</font> </div> </div> </div> <hr style="background-color: #cccccc ;height: 2pt"> <div class="media "> <div class="panel-heading"> <img alt="Brand" src="../img/liuxue.png" class="topic-pic" style="float: left"> <div style="display: inline;"> <a href="#" style="float: left;font-size: 15px;margin-bottom: 8px">2017留学申请</a> <font color="#999999"size="3px" style="float: right;margin-bottom: 8px">还有两天结束</font> </div> <div style="display: inline"> <font color="#999999"size="3px" style="float: left;">666 人关注</font> <font color="#999999"size="3px" style="float: right"> · 55 个问题</font> </div> </div> </div> <hr style="background-color: #cccccc ;height: 2pt"> </div> <!--热门话题--> <div> <div class="media " ng-repeat="question in questions" > <h4 style="float: left"> <strong>热门圆桌</strong> </h4> <a href="#"> <h5 style=" float: right;font-size: 17px;color: #666666" > 更多话题>> </h5> </a> </div> <div class="media-left "> <a href="#">