【免费】HTML+CSS学成在线案例的素材和源码以及切图工具cutterman

共21个文件

png：17个

html：1个

psd：1个

学成在线

cutterman

HTML+CSS

5星 · 超过95%的资源需积分: 0 142 浏览量更新于2022-07-22 4 收藏 8.77MB RAR 举报

内容概要：HTML+CSS学成在线案例的素材和源码，需要的小伙伴可以下载，里面还有最好用的切图工具cutterman，帮助你一秒切图，下载完注册个cutterman账号即可使用适合人群：具有一定的前端基础，CSS学完浮动可以尝试做一下这个案例能学到什么：做完这个案例，还是很有成就感的，也可以巩固一下自己的知识点，同时了解去写一个网站的流程阅读建议：可以自己先想一下思路，再看源码，实现界面有很多种方式，不一定要和源码一模一样，只要方便快捷都可以希望这个资源对你有所帮助！

收起资源包目录

学成在线素材源码及cutterman.rar （21个子文件）

学成在线素材源码及cutterman

study

images

pic3.png 57KB

pic1.png 50KB

c-pic1.png 79KB

banner.png 374KB

c-pic3.png 39KB

c-pic4.png 39KB

c-pic6.png 29KB

user.png 4KB

c-pic5.png 37KB

c-pic8.png 59KB

logo.png 5KB

pic2.png 50KB

pic4.png 47KB

c-pic7.png 65KB

c-pic2.png 88KB

c-pic9.png 32KB

btn.png 1KB

index.html 18KB

style.css 7KB

Cutterman_panel_3.5.0_201711141423.exe 1.23MB

学成网首页.psd 26.75MB

资源推荐

资源预览

资源评论

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>学成在线</title> <link rel="stylesheet" href="style.css"> </head> <body>  <div class="header w">  <div class="logo"> <img src="images/logo.png" alt=""> </div>  <div class="nav"> <ul> <li><a href="#">首页</a></li> <li><a href="#">课程</a></li> <li><a href="#">职业规划</a></li> </ul> </div>  <div class="search"> <input type="text" value="输入关键词"> <button></button> </div>  <div class="user"> <img src="images/user.png" alt=""> qq-lihua </div> </div>   <div class="banner">  <div class="w">  <div class="subnav"> <ul> <li><a href="">前端开发 <span> > </span></a></li> <li><a href="">后端开发 <span> > </span></a></li> <li><a href="">移动开发 <span> > </span></a></li> <li><a href="">人工智能 <span> > </span></a></li> <li><a href="">商业预测 <span> > </span></a></li> <li><a href="">云计算&大数据 <span> > </span></a></li> <li><a href="">运维&从测试 <span> > </span></a></li> <li><a href="">UI设计 <span> > </span></a></li> <li><a href="">产品 <span> > </span></a></li> </ul> </div>   <div class="course"> <h2>我的课程表</h2> <div class="bd"> <ul> <li> <h4>继续学习程序语言设计</h4> <p>正在学习-使用对象</p> </li> <li> <h4>继续学习程序语言设计</h4> <p>正在学习-使用对象</p> </li> <li> <h4>继续学习程序语言设计</h4> <p>正在学习-使用对象</p> </li> </ul> <a href="#" class="more">全部课程</a> </div> </div>  </div> </div>   <div class="goods w"> <h3>精品推荐</h3> <ul class="goods-item"> <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="#">Vue</a></li> </ul> <a href="#" class="mod">修改兴趣</a> </div>   <div class="box w"> <div class="box-hd"> <h3>精品推荐</h3> <a href="#">查看全部</a> </div> <div class="box-bd"> <ul class="clearfix"> <li> <img src="images/pic1.png" alt=""> <h4> Think PHP 5.0 博客系统实战项目演练 </h4> <div class="info"> <span>高级</span> • 1125人在学习 </div> </li> <li> <img src="images/pic2.png" alt=""> <h4> Android 网络图片加载框架详解 </h4> <div class="info"> <span>高级</span> • 7486人在学习 </div> </li> <li> <img src="images/pic3.png" alt=""> <h4> Angular 2 最新框架+主流技术+项目实战 </h4> <div class="info"> <span>高级</span> • 2485人在学习 </div> </li> <li> <img src="images/pic4.png" alt=""> <h4> Android Hybrid APP开发实战 H5+原生！ </h4> <div class="info"> <span>高级</span> • 1575人在学习 </div> </li> <li> <img src="images/pic4.png" alt=""> <h4> Android Hybrid APP开发实战 H5+原生！ </h4> <div class="info"> <span>高级</span> • 6415人在学习 </div> </li> <li> <img src="images/pic1.png" alt=""> <h4> Think PHP 5.0 博客系统实战项目演练 </h4> <div class="info"> <span>高级</span> • 1125人在学习 </div> </li> <li> <img src="images/pic2.png" alt=""> <h4> Android 网络图片加载框架详解 </h4> <div class="info"> <span>高级</span> • 7486人在学习 </div> </li> <li> <img src="images/pic3.png" alt=""> <h4> Angular 2 最新框架+主流技术+项目实战 </h4> <div class="info"> <span>高级</span> • 2485人在学习 </div> </li> <li> <img src="images/pic4.png" alt=""> <h4> Android Hybrid APP开发实战 H5+原生！ </h4> <div class="info"> <span>高级</span> • 1575人在学习 </div> </li> <li> <img src="images/pic4.png" alt=""> <h4> Android Hybrid APP开发实战 H5+原生！ </h4> <div class="info"> <span>高级</span> • 6415人在学习 </div> </li> </ul> </div> </div>    <div class="content w"> <div class="content-hd"> <h3>编程入门</h3> <ul> <li><a href="#">热门</a></li> <li><a href="#">初级</a></li> <li><a href="#">中级</a></li> <li><a href="#">高级</a></li> </ul> <a href="#">查看全部</a> </div>