Tell me, out of the school into a software testing company operations, drifted off was like this for more than a year, in the company, things more easily, 965 work make me so useless to mix now, now want to work in a challenging, of course, such as Java back-end I feel I can’t learn, Although my major is Java but why not learn not to omit that the emmp of a because he so chose to start the basis of the front, to now also watching video and review the previous knowledge, have learned about half a month in this way, these two days the sums up half a month, made a static page, feels good!

linzhentao.3vhost.net

Below are the renderings

Here is my code, you can have a look

 WeChat
 customer service
 feedback
 maintenance
 shopping cart
  • Home page
  • course
  • Career planning
Lin tao 

<! <div class="banner"> <! <div class="w"> <! - the subnavigation -- > < div class = "subnav" > < ul > < li > < a href = "#" > front-end developer < span > > < / span > < / a > < / li > < li > < a Href = "#" > the backend development < span > > < / span > < / a > < / li > < li > < a href = "#" > mobile development < span > > < / span > < / a > < / li > < li > < a Href = "#" > < span > artificial intelligence > < / span > < / a > < / li > < li > < a href = "#" > business forecast < span > > < / span > < / a > < / li > < li > < a Href = "#" > cloud computing and big data < span > > < / span > < / a > < / li > < li > < a href = "#" > operations & from test < span > > < / span > < / a > < / li > < li > < a < a href = "#" > the UI design span > > < / span > < / a > < / li > < li > < a href = "#" > products < span > > < / span > < / a > < / li > < / ul > < / div > <! - course -- -- > < div class = "course" > < h3 > my schedule < / h3 > < ul > < li > < h4 > continue to learn programming language design < / h4 > < p > are learning - using the object < / p > < / li > < li > < h4 > continue to learn Programming language design < / h4 > < p > object is learning to use the < / p > < / li > < li > < h4 > continue to learn programming language design < / h4 > < p > are learning - using the object < / p > < / li > < / ul > < button > all courses < / button > < / div > </div> </div> <! -- End of banner AD --> <! - products recommended navigation start -- > < div class = "goods w" > < h4 > products recommended < / h4 > < ul > < li > < a href = "#" > JQuery < / a > < / li > < li > < a href = "#" > Spark < / a > < / li >  <li><a href="#">MySQL</a></li> <li><a href="#">JavaWeb</a></li> <li><a href="#">MySQL</a></li> <li><a Href = "#" > JavaWeb < / a > < / li > < / ul > < a href = "#" class = "mod" > modify interest < / a > < / div > <! End of navigation bar --> <! - goods to -- > < div class = "box w" > < div class = "box - hd" > < h3 > products recommended < / h3 > < span > < a href = "#" > view all < / a > < / span > < / div > < div class="box-bd"> <ul> <li> <em><img src="images/hot.png" alt=""></em> <img src="./images/sp.png" alt=""> <h4>Angular 2 Latest mainstream frame + technology + project practical < / h4 > < h5 > top < / h5 > < span > • 1125 people in learning < / span > < / li > < li > < em > < img SRC = "images/hot. PNG" Alt = "" > < / em > < img SRC ="./images/sp.png" Alt =""> <h4>Angular 2 latest framework + mainstream technology + project action </ H4 > < H5 > Advanced </ H5 > <span> • 1125 people learning </span> </li> <li> <img SRC ="./images/sp.png" Alt =""> <h4>Angular 2 latest framework + mainstream technology + project action </ H4 > < H5 > Advanced </ H5 > <span> • 1125 people learning </span> </li> <li> <img SRC ="./images/sp.png" Alt =""> <h4>Angular 2 latest framework + mainstream technology + project action </ H4 > < H5 > Advanced </ H5 > <span> • 1125 people learning </span> </li> <li Class ="clear"> <img SRC ="./images/sp.png" Alt =""> < H4 >Angular 2 latest framework + mainstream technology + project </ H4 > < H5 > Advanced </ H5 > <span> </li> <li> <img SRC ="./images/sp.png" Alt =""> < H4 >Angular 2 latest framework + mainstream technology + project experience </h4> < H5 > Advanced </ H5 > <span> </li> <li> <img SRC ="./images/sp.png" Alt =""> < H4 >Angular 2 latest framework + mainstream technology + project experience </h4> < H5 > Advanced </ H5 > <span> </li> <li> <img SRC ="./images/sp.png" Alt =""> < H4 >Angular 2 latest framework + mainstream technology + project experience </h4> < H5 > Advanced </ H5 > <span> </li> <li> <em><img src="images/hot.png" alt=""></em> <img src="./images/sp.png" alt=""> <h4>Angular 2 Latest mainstream frame + technology + project practical < / h4 > < h5 > top < / h5 > < span > • 1125 people in learning < / span > < / li > < li class = "clear" > < img SRC = ". / images/sp. PNG "Alt =" "> < h4 > 2 presents the latest frame + + mainstream technology project of actual combat < / h4 > < h5 > top < / h5 > < span > • 1125 people in learning < / span > < / li > < / ul > < / div > < / div > <! End of merchandise section --> <! - hot goods start -- > < div class = "brick - box w" > < div class = "box - hd" > < / h3 > < h3 > data analyst < ul > < li > < a href = "#" Class = "info" > top < / a > < / li > < li > < a href = "#" > primary < / a > < / li > < li > < a href = "#" > intermediate < / a > < / li > < li > < a href = "#" > top < / a > < / li > < / ul > < span > < a href = "#" > view all < / a > < / span > < / div > < div class = "brick - box - bd" > < div class = "box - bd - left" > < / div > < div class="box-bd-right"> <div class="box-right-hd"> <img src="./images/logo1.png" alt=""> </div> <div class="box-bd"> <ul> < li > < em > < img SRC = "images/hot. PNG" Alt = "" > < / em > < img SRC =". / images/sp. PNG "Alt =" "> < h4 > 2 presents the latest frame + + mainstream technology project of actual combat < / h4 > < div class = "ceshi" > < span > top < / span > < P >, 1125 people in learning < / P > < / div > < / li > < li > < img SRC = ". / images/sp. PNG "Alt =" "> < h4 > presents 2 Latest mainstream frame + technology + project practical < / h4 > < div class = "ceshi" > < span > top < / span > < P >, 1125 people in learning < / P > < / div > < / li > < li > < img SRC = ". / images/sp. PNG" Alt = "" > < h4 > 2 presents the latest frame + + mainstream technology project of actual combat < / h4 > < div class =" ceshi "> < span > top < / span > < P >, 1125 people in learning < / P > < / div > < / li > < li /images/sp.png" Alt =""> <h4>Angular 2 </h4> <div class="ceshi"> <span> Advanced </span> < P >, 1125 people in learning < / P > < / div > < / li > < / ul > < / div > < / div > < / div > < / div > <! -- Hot items end --> <! - start at the bottom of the -- -- > < div class = "footer" > < div class = "w" > <! Xuechengonline is committed to promoting the best education in China. Xuechengonline offers online courses in cooperation with top Universities and institutions in China. © 2017 XTCG Inc. All Rights Reserved. </p> <button> APP</button> </div> <! - link -- -- > < div class = "links" > < dl > < / dt > < dt > about well net about < dd > < / dd > < dd > management team < / dd > < dd > work < / dd > < dd > customer service < / dd > < dd > help < / dd > < / dl > < dl > < dt > newbie guide < / dt > < dd > how to sign up < / dd > how to select the courses < dd > < / dd > < dd > how to get a diploma < / dd > < dd > what credits < / dd > < dd > test failed to do < / dd > < / dl > < dl > < dt > partners < / dt > < dd > partners < / dd > < dd > mentor < / dd > < / dl > < / div > < / div > < / div > <! -- Bottom end -->Copy the code

} .goods ul li a{ padding: 0 30px; /* height: 60px; / line-height: 60px; border-left: 1px solid #d8d8d8; color: #050505; } .goods ul li a:hover { color: #00a4ff; } .mod { float: right; line-height: 60px; margin-right: 20px; font-size: 14px; color: #00a4ff; } .box { margin-top: 30px; height: 620px; / background-color: red; / } .box-hd { / margin-top: 20px; / height: 50px; / background-color: pink; * /

} .box-hd h3 { float: left; font-size: 20px; font-weight: 400; line-height: 50px; color: #494949; } .box-hd span a{ float: right; margin-right: 30px; font-size: 12px; line-height: 50px; color: #d8d8d8 } .box-bd { /* float: right; / height: 540px; / margin-bottom: 20px; / / background-color:pink; }. Box-bd ul li {/ add a relative position: relative; float: left; margin: 15px; margin-left: 0; width: 228px; height: 270px; background-color:#ffffff; }. Box-bd ul li em{/ position: absolute; top: 4px; right: -4px; } .box-bd ul li>img { width: 100%; } .box-bd h4 { margin-top: 20px; padding: 0px 20px; font-size: 14px; font-weight: 400; color: #050505; } .box h5 { float: left; margin: 20px 20px; font-size: 12px; color: #ff7c2d; } .box-bd span { float: left; margin: 20px 0; font-size: 12px; color: #999999; } .box-bd .ceshi span { float: left; margin: 20px 20px; font-size: 12px; color: #ff7c2d; } .box-bd .ceshi p{ float: left; margin: 20px 0; font-size: 12px; color: #999999; } .box-bd .clear { margin-right: 0; }. Box-bd ul li:hover {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0, 0.2), 0 4px 8px 0 rgba(0, 0, 0, 0.2); } .box-hd ul { margin-left: 300px; } .box-hd ul li{ float: left; padding: 0 35px; line-height: 50px; / margin-top: 20px; / } .box-hd ul li a { font-size: 16px; color: #868686; } .box-hd ul .info { font-size: 16px; color: #00a4ff; } .brick-box { margin-top: 30px; height: 440px; / background-color:pink; / } .box-bd-left { float: left; width: 228px; / background-color:blue; / height: 390px; background-image: url(.. /images/cbl.png); } .box-bd-right { margin-left: 14px; float: left; width: 958px; height: 390px; / background-color: aqua; / } .box-bd-right img { width: 100%; } .footer { background-color: #ffffff; height: 430px; margin-top: 30px; } .copyright { float: left; margin-top: 20px; margin-left: 20px; width: 432px; height: 185px; / background-color: red; / } .copyright p { color: #666666; font-size: 12px; margin-top: 30px; } .copyright button { margin-top: 6px; width: 120px; height: 40px; font-size: 16px; color: #00a4ff; border: solid 1px #00a4ff; background-color: #ffffff; } .links { float: right; overflow: hidden; / width: 50px; height: 50px; / margin-top: 20px; margin-right: 30px; / background-color: red; / } .links dl { float: left; margin-left: 140px; } .links dl dt { font-size: 16px; color: #333333; margin-bottom: 15px; } .links dl dd { / padding-top: 15px; / font-size: 12px; color: #333333; margin-bottom: 2px; } / / fixed-left {position: fixed; z-index: 1; margin-left: 624px; margin-top: 50px; width: 82px; height: 420px; background-color: #fff; top: 50%; left: 50%; } .fixed-left>a { display: block; height: 84px; text-align: center; line-height: 84px; border-top: solid #f3f5f7 1px; font-family: ‘icomoon’; } .fixed-left>:hover { color: orange; } .fixed-left .code { position: relative; } .fixed-left .code span{ display: none; position: absolute; width: 84px; height: 84px; top: 0; left: 100px; background-color: #fff; / background-color: red; / } .fixed-left .code span>img { width: 100%; height: 100%; } .fixed-left .code:hover span { display: block; } / .code>p { font-size: 13px; } / / .fixed-right { position: fixed; margin-right:625px; width: 200px; height: 300px; top: 400px; right: 50%; background-color: pink;

} * /