请问红线应该怎么加?
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>布局</title> <style> html,body{margin:0px;} header{ height:80px; background-color:black; font-weight:bolder; } header img{ height:80px; width: 230px; } a{ color:white; text-decoration: none; } #container { height: 500px; background-color: green; } nav { float: left; width: 35%; height: 100%; font-weight: bolder; background-color: yellow; font-family: "Microsoft Yahei"; } #table1{ width: 80%; height:20%; margin: 40px 100px; } article { overflow: hidden; width:30%; height: 100%; background-color: coral; font-weight: bolder; font-family: "微软雅黑"; } #table2{ width: 80%; height:20%; margin: 40px 50px; } aside { float: right; width: 35%; height: 100%; background-color:blue; font-weight: bolder; font-family: "微软雅黑"; } #table3{ width: 80%; height:20%; margin: 40px 50px; } footer{ height:80px; background-color:black; font-weight:bolder; font-family: "微软雅黑"; } #table4{ width: 50%; height:20%; margin: 0px 350px; } </style> </head> <body> <header> <img src="http://img1.sycdn.imooc.com/climg//59093e9c00016ce303000100.png"/> <table border="0" cellspacing="20" cellpadding="10"> <tr> <td><a href="#">课程</a></td> <td><a href="#">职业路径</a></td> <td><a href="#">实战</a></td> <td><a href="#">猿问</a></td> <td><a href="#">手记</a></td> </tr> </table> </header> <div id="container"> <nav> <table id="table1" border="0" cellspacing="20" cellpadding="3"> <tr><td colspan="2"><h2>课程推荐</h2></td></tr> <tr> <td style="background-color:pink;width:4em;">职业路径</td> <td>HTML5与CSS3实现动态网页</td> </tr> <tr> <td style="background-color:pink">职业路径</td> <td>零基础入门Android语法与界面</td> </tr> <tr> <td style="background-color:pink">职业路径</td> <td>iOS基础语法与常用控件</td> </tr> <tr> <td style="background-color:pink">职业路径</td> <td>PHP入门开发</td> </tr> <tr> <td style="background-color:pink">职业路径</td> <td>JAVA入门开发</td> </tr> </table> </nav> <aside> <table id="table3" border="0" cellspacing="20" cellpadding="0"> <tr id="row"><td><h2>登录</h2></td></tr> <tr id="row"> <td> <form name="q5"> <input type="text" placeholder="请输入手机号/登录名" style="height:30px;width:200px;"> </form> </td> </tr> <tr id="row"> <td> <form name="q5"> <input type="password" placeholder="请输入6-16位密码,区分大小写" maxlength="16" style="height:30px;width:200px;"> </form> </td> </tr> <tr id="row"> <td> <button type="submit" form="q5" style="height:40px;width:205px;background: red;color: white; font-weight: bolder;border: none;font-size: 20px;">登 录</button> </td> </tr> </table> </aside> <article> <table id="table2" border="0" cellspacing="20" cellpadding="3"> <tr><td><h2>相关课程</h2></td></tr> <tr><td>HTML CSS JavaScript</td></tr> <tr><td>HTML5 CSS3 Jquery</td></tr> <tr><td>移动端基础 移动端APP开发</td></tr> </table> </article> </div> <footer> <table id="table4" border="0" cellspacing="20" cellpadding="10"> <tr> <td><a href="#">网站首页</a></td> <td><a href="#">企业合作</a></td> <td><a href="#">人才招聘</a></td> <td><a href="#">联系我们</a></td> <td><a href="#">常见问题</a></td> <td><a href="#">友情链接</a></td> </tr> </table> </footer> </body> </html>
33
收起
正在回答 回答被采纳积分+1
4回答
guly
2017-11-17 14:06:09
你好,你应该每个模块放在一个div里面比如:
<div class="container"> <!-- 左侧内容 --> <div class="left"> </div> <!-- 中间内容 --> <div class="middle"> </div> <!-- 分割线 --> <div class="line"></div> <!-- 右侧内容 --> <div class="right"> </div> </div> <!-- 底部内容 --> <div class="footer"> </div>
如果解决了您的问题请采纳,祝学习愉快!
Michelleqyh
2017-11-16 23:00:51
而且为什么用手机打开成这样了呀?
Michelleqyh
2017-11-16 22:25:28
求具体的加红线的代码。试了很多方法,总是跑到第二行上去了
相似问题
登录后可查看更多问答,登录/注册
PHP小白零基础入门
- 参与学习 人
- 提交作业 626 份
- 解答问题 4930 个
想要学好Web后端开发的中流砥柱语言,本阶段为你轻松铺就扎实的基础,从前端网页布局的搭建到后台PHP开发,助你从零基础到掌握主流开发语言。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星