麻烦老师看看这段代码，有没有需要优化的地方

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

<!DOCTYPE html>
<html>
<head>
    <title>测试</title>
    <meta charset="utf-8">
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
            font-family: "微软雅黑";
        }
        .big{
            width: 1600px;
            height: 600px;
        }
        /*导航*/
        .header{
            width: 100%;
            height: 100px;
            background: black;
            position: fixed;
            top: 0;
        }
        .logo{
            background: url(http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png) no-repeat;
            padding-left: 32px;
            width: 300px;
            height: 100px;
            vertical-align: middle;
        }
        .nav ul{
            list-style-type: none;
            display: inline;
            height: 50px;
            line-height: 50px;
            position: absolute;
            right: 0;
            top: 50%;
            margin-top: -25px;
        }
        .nav ul li{
            color: white;
            float: left;
            padding-right: 66px;
        }
        /*内容*/
        .content{
            width: 100%;
            height: 400px;
            padding: 100px 10%;
            background: rgb(185,215,228);
            overflow: hidden;
            zoom:1;
        }
        p{
            margin: 10px 0;
            color: black;
        }
        p span{ margin-right: 20px;}
        .left{
            width: 30%;
            height: 100%;
            float: left;
            padding-top: 5%;
        }
        .left p span:nth-child(1){
            background: pink;
        }
        .right{
            width: 30%;
            height: 100%;
            float: left;
            
            padding-top: 5%;
            margin-left: 20%;
        }
        
        /*底部*/
        .footer{
            width: 100%;
            height: 100px;
            background: black;
            position: fixed;
            bottom: 0;
        }
        .footer ul{
            list-style-type: none;
            display: inline;
            height: 50px;
            line-height: 50px;
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -25px;
            margin-left: -492px;  
        }
        .footer ul li{
            color: white;
            float: left;
            padding-right: 100px;
        }
    </style>
</head>
<body>
    <div>
        <div class="header">
           <div class="logo"></div>
           <div class="nav">
               <ul>
                   <li>课程</li>
                   <li>职业路径</li>
                   <li>实战</li>
                   <li>猿问</li>
                   <li>手记</li>
               </ul>
           </div>
        </div>
        <div class="content">
            <div class="left">
               <h2>课程推荐</h2>
               <p><span>职业路径</span><span>HTML5与CSS3实现动态网页</span></p>
               <p><span>职业路径</span><span>零基础入门Android语法与界面</span></p>
               <p><span>职业路径</span><span>iOS基础语法与常用控件</span></p>
               <p><span>职业路径</span><span>PHP入门开发</span></p>
               <p><span>职业路径</span><span>JAVA入门开发</span></p>
            </div>
            <div class="right">
                <h2>课程推荐</h2>
                <p><span>HTML</span><span>CSS</span><span>JavaScript</span></p>
                <p><span>HTML5</span><span>CSS3</span><span>Jquery</span></p>
                <p><span>移动端基础</span><span>移动端APP开发</span></p>
            </div>
        </div>
        <div class="footer">
            <ul>
                   <li>网站首页</li>
                   <li>企业合作</li>
                   <li>人才招聘</li>
                   <li>联系我们</li>
                   <li>常见问题</li>
                   <li>友情链接</li>
               </ul>
        </div>
    </div>
</body>
</html>