2-12老师帮忙看下哪里可以优化吗，很难啊
来源：2-12 编程练习
慕无忌8417539
2018-11-19 17:14:14
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
*{margin:0;padding:0;}
.header{background:black;height:100px;position:fixed;top:0;width:100%;}
.footer{background:black;height:100px;position:fixed;bottom:0;width:100%;}
.content{background:lightblue;height:800px;position:fixed;top:100px;width:100%;}
.con_1{float:left;width:33%;line-height: 2em;padding-top:80px;padding-left:60px;height:inherit;box-sizing:border-box;}
.con_1 span{background:yellow;}
.con_2{float:left;width:33%;line-height: 2em;padding-top:80px;padding-left:60px;height:inherit;box-sizing:border-box;}
.con_3{float:left;width:34%;line-height: 2em;padding-top:80px;padding-left:30px;height:inherit;border-left:1px solid orange;box-sizing:border-box;}
.footer ul{width:100%;text-align:center;}
ul{float:right;height:100px;line-height: 100px;}
li{display:inline-block;list-style:none;margin:0 20px;}
a{color:white;font-size:25px;text-decoration: none;}
img{float:left;box-sizing:border-box;}
button{background:red;height:30px;width:250px;color:white;border:none;}
input{height:30px;width:250px;display:block;margin:25px 0;}
h1{margin-bottom:20px;}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="header">
<a><img src="http://climg.mukewang.com/59093e9c00016ce303000100.png"/></a>
<ul>
<li><a>课程</a></li>
<li><a>职业路径</a></li>
<li><a>实战</a></li>
<li><a>猿问</a></li>
<li><a>手记</a></li>
</ul>
</div>
<div class="content">
<div class="con_1">
<h1>课程推荐</h1>
<p><span>职业路径</span> HTML5与CSS3实现动态网页</p>
<p><span>职业路径</span> 零基础入门Android语法与界面</p>
<p><span>职业路径</span> iOS基础语法与常用控件</p>
<p><span>职业路径</span> PHP入门开发</p>
<p><span>职业路径</span> JAVA入门开发</p>
</div>
<div class="con_2">
<h1>相关课程</h1>
<p>HTML CSS JavaScript</p>
<pHTML5 CSS3 Jquery</p>
<p>移动端基础 移动端APP开发</p>
</div>
<div class="con_3">
<h1>登录</h1>
<form>
<input type="text" name="username" placeholder="请输入登录邮箱/手机号"/>
<input type="password" name="passwd" placeholder="6-16位密码，区分大小写，不能用空格" />
<button type="submit" name="submit" value="submit" maxlenth="10">登录</button>
</form>
</div>
</div>
<div class="footer">
<ul>
<li><a>网站首页</a></li>
<li><a>企业合作</a></li>
<li><a>人才招聘</a></li>
<li><a>联系我们</a></li>
<li><a>常见问题</a></li>
<li><a>友情链接</a></li>
</ul>
</div>
</body>
</html>
1回答
-
好帮手慕夭夭
2018-11-19
你好同学 ,经过测试 ,效果实现了 . 刚开始学习新知识 , 觉得难或者有好的不会的都是很正常的 . 同学在看完视频后 , 能够课后模仿老师的例子去实现一个效果 . 认真完成课后练习和编程题 . 以后就会慢慢的熟练掌握了 .
另外 , 建议同学可以按照如下方式优化一下css代码 :
把元素公共的样式写在一起 , 代码简洁 . 祝学习愉快 ,望采纳 .
0
相似问题
回答 1
回答 1