无法显示背景色为黑色,还有块状元素那里也打不到老师演示的那样
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>imooc</title> <!-- 引入css样式 12 --> <link rel="stylesheet" type="text/css" href="testcss.css"> </head> <body> <!-- 头部标签 header 1--> <header> <!-- container容器的意思 2 --> <div> <!-- 创建首页标签LOGO 引入切好的图片标签 3 --> <a href="test1.html"><img src="images/logo.png" ></a> <!-- 导航标签 4--> <nav> <a class="Home active" href="test1.html">Home</a> <a href="#">Course</a> <a href="#l">Actual</a> <a href="#l">Plan</a> <a href="#l">FAQ</a> <a href="#l">Notes</a> </nav> </div> </header> <!--添加横幅 5 --> <section> <ul> <li><img src="images/banner/banner1.jpg" ></li> <li><img src="images/banner/banner2.jpg" ></li> <li><img src="images/banner/banner3.jpg" ></li> </ul> </section> <!-- 主题部分 6 --> <section> <!-- 侧边栏 7 --> <aside> <!-- 标题 ,并同samp强调 8 --> <h1>Recent <samp>Course</samp></h1> <!-- d1>dd>dt 9 --> <d1> <dt>这里是Java</dt> <dd><img src="images/Course/05_05.png" ></dd> <dd>这里是我开始做的第一个网页布局实验</dd> </d1> <d1> <dt>这里是C++</dt> <dd><img src="images/Course/06_04.png" ></dd> <dd>这里是我开始做的第一个网页布局实验</dd> </d1> <d1> <dt>这里是JavaScript</dt> <dd><img src="images/Course/09_07.png" ></dd> <dd>这里是我开始做的第一个网页布局实验</dd> </d1> <d1> <dt>这里是AngularJs</dt> <dd><img src="images/Course/02_09.png" ></dd> <dd>这里是我开始做的第一个网页布局实验</dd> </d1> </aside> <!-- 9 --> <article> <!-- 10 --> <h1>Welcome to <samp>Massive Open Online Course</samp></h1> <!-- 11 --> <img src="images/article.jpg" > <p>这是我的第一段文章</p> <p>这是我的第二段文章</p> <p>这是我的第三段文章</p> </article> </section> <!-- 尾部标签 12 --> <footer> <div> <p>Copyright @2016 imooc.com All Rights Reserved.</p> <span> <img src="images/icon/weichat.png" > <img src="images/icon/qq.png" > <img src="images/icon/sina.png" > </span> </div> </footer> </body> </html>
*{ /*这里是通配符*/ font-family: Arial; font-size: 14px; margin: 0; padding: 0; border: none;; } a{ /*这里是超链接*/ text-decoration:none; } ul{ /*这里是UL*/ list-style: none; } header{ height: 80px; background: #000; } header >.container{ /*这里是设置容器的,>是子选择器*/ width: 1200px; /*宽度设置为1200像素*/ margin: 0 auto; /*这里是设置自动区中*/ } header >.container> a{ /*这里是设置LOGO标题部分*/ display: block; float: left; /*浮动块设置往左移动*/ margin: 5px 25px; /*这里是控制好5像素和25像素*/ } header>.container> nav{ /*这里是设置导航条*/ float: right; /*控制往右浮动*/ } header > .container > nav >a{ /*这里是控制导航条下面的超链接*/ font-size: 24px; /*控制字体大小*/ line-height: 73px; /*控制行高数73,就会数值居中*/ display: block; /*转换成块级元素,不然宽度和高度就无效*/ float: left; /*设置成浮动元素*/ width: 110px; height: 73px; text-align: center; /*设置文字居中*/ color: #fff; /*设置背景为白色*/ } header > .container > nav > a.Home{ background: #433b90;} header > .container > nav > a.Course{ background: #017fcb; } header > .container > nav > a.Actual{ background: #78b917; } header > .container > nav > a.Plan{ background: #feb800; } header > .container > nav > a.FAQ{ background: #f27c01 } header > .container > nav > a.Notes{ background: #d40112; } header > .container > nav > a.hover, header > .container > nav > a.active { padding-bottom: 7px; }
如题,达不到这两个要求,不知道是哪里出问题了。另外下载sublimeCodeIntel时,出现异常,不知道该怎样解决?
29
收起
正在回答
2回答
关于sublimeCodeInte下载失败,你可以尝试重新安装Package Control,祝学习愉快!
HTML5与CSS3实现动态网页 2018
- 参与学习 1887 人
- 提交作业 4643 份
- 解答问题 5760 个
有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星