Ⅰ 精灵图的导入是用img还是background
方法1.在图片的外面加上一个div,如果是图片要占整行，那么这个div不需要加什么样式；如果是和其他元素共占一行，那么这个div必须是display：inline-block,而里面的img图片只要设置width:100%;让图片自适应外层的DIV，而div则自适应更外层的宽度，这个方法不存在IE8内不存在兼容性问题（IE6以下不兼容）。
方法2.在布局上和方法一一样，但是在导入图片和展示图片上有点差异，即用background导入图片，用background-size来控制图片的展示。
Ⅱ 什么是精灵图在css中如何使用精灵图其有什么优缺点
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。这样可以减少很多图片请求的开销，因为请求耗时比较长；请求虽然可以并发，但是也有限制，一般浏览器都是6个。对于未来而言，就不需要这样做了，因为有了`http2`。
具体请查看“background-image”，“background- repeat”，“background-position”的使用方法
Ⅲ 现在做网页前端的学习路线是什么
初学者必看干货web前端学习路线图，随着移动互联网的发展，web前端逐渐受到企业的重视，前端开发人员的薪资也水涨船高，越来越多的人看好前端行业的发展，想要转行加入。下面，给大家分享一份web前端学习路线图，希望对初学者有所帮助。
Web前端行业的发展，让前端人员能完成比以前更多的职责范围，所以未来前端可以宽口径就业，前景非常好。除此之外，目前web前端工程师日均岗位缺口超50000，平均薪资10820元/月。
对于零基础的人而言，要怎么学习web前端呢？
1、前端页面重构。主要内容为PC端网站布局、Photoshop工具及切图、H5移动端网页布局、HTML5+CSS3新特性与交互。学习目标是完成PC端网站布局，可实现响应式布局，一套代码适配PC端、移动端、平板设备等。
2、前后端网页交互。主要内容为JavaScript语法全面进阶、ES6到ES10新语法实践、jQuery应用及插件使用、设计模式及插件编写、封装JS工具库及WebAPIS、AJAX+PHP+MySQL前后端交互、前端工程化与模块化应用以及PC端全栈开发项目等。学习目标是可以掌握前端工程化工具，如git、gulp、webpack等，搭建项目及开发项目。
3、Node.js+前端框架。主要内容为Node.js全面进阶、Koa2+MongoDB搭建服务、Vue.js框架、React.js框架、小程序云开发与小程序框架、原生APP与混合APP、数据可视化与桌面应用等。学习目标是掌握桌面应用及可视化大数据，实现复杂数据展示类项目，能够独立完成前后台相关功能，胜任HTML5全栈开发工程师职位。
很多学习web前端的朋友都希望在学成后能找到一份满意的工作，所以我们在学习过程中一定要注意实战经验的积累，如果你所学的东西对企业没有用，那你所做的一切都是无用功。
Ⅳ 有没有哪位在兄弟连培训过html5前端开发，请问html5培训的课程大纲可以分享一下么
以下是课程大纲，可以参考一下
(1)HTML5+CSS3
经典表格布局制作简历
1. HTML5介绍 2. HTML5发展史 3. HTML5简介 4. HTTP协议介绍 5. HTTP消息类型 6. 互联网发展形式 7. web开发所需要的构件
8. 编辑器的使用 9. HTML基本语法与规范(标签元素、属性) 10. 第一个HTML网页 11.表格标签
规范代码盒模型布局小米等网站
1. 文档头和编码声明 2. 基础标签 3. 文本类标签 4. 列表标签 5. 语义化标签的使用 6. 字符实体 7. 表格标签 8. HTML5标签的兼容处理9. HTML5标签SEO的作用 10. HTML5表单新特性 11. 多媒体标签
3D旋转+动画制作正方体
1. CSS的定义 2. CSS引入 3. CSS选择器 4. CSS3与CSS2的区别 5. 长度单位 6. 颜色单位 7. 常用属性 8. CSS属性
流行的pc端，App页面响应式布局
1. W3C盒子模型 2. Div+CSS网页布局 3. 弹性盒子 4. HTML5兼容处理 5. 使用HTML5布局元素的布局 6. Media Query响应式布局 7. 百分比网页布局
工作要求，实战大型电商网站静态页面
1. PS切图 2. 精灵图 3. CSS重制样式表Reset CSS、 Normalize.css 4. CSS命名规范，CSS常用名
(2)JavaScript jQuery实例 实战项目
前端核心语言javascript语法
1. JavaScript简介 2. 在页面中使用JavaScript 3. JavaScript的语法 a) 变量声明规范 b)语句结束 c)脚本注释 d)代码块 e)数据类型 f)类型转换 g)运算符 h)流程控制语句 i)函数 j)内置对象
原生Js功能开发
1. 更换页面皮肤 2. 五彩小球 3. 随机点名器 4. 轮播图 5. 网站时间显示 6. 商城抢购活动 7. 购物车的全选、反选、全不选 8. 选项卡前端后台交互功能开发9. 进度条 10. 拖拽div 11. 放大镜 12. 城市地址二级、三级联动 13. 随机浮动广告 14. 无缝连接 15. 仿网络登录
Jquery库交互特效开发
1. JQuery简介 2. JQuery安装 3. JQuery CSS操作 4. JQuery选择器 5. JQuery筛选 6. JQuery html 文档处理 7. JQuery事件 8. JQuery效果 9. JQuery Ajax 10. JQuery其他操作 11. JQuery插件
实战进阶-瞄准市场
1.PS切图 2.CSS重置样式表 3.网页规范 4.兼容性 5.SASS 6.Compass精灵图 7.代码压缩 8.常见网站效果 9.rem相对大小布局
(3)Node.JS MongoDB Express Vue.js
Vue.js前端热组件化开发框架
1. 介绍 2. 安装 3. 模板/数据绑定 4. Class/Style绑定 5. 事件 6. 组件 7. 混合 8. 插件 9. 服务/路由
后端Js-Node.js搭建前端脚手架
1. Node.js简介 2. Node.js安装 3. NPM工具使用 4. 模块、Package 5. 回调函数 6. Buffer，事件 7. 文件处理模块 8. Http，URL，Querystring Path等模块 9. POST/GET请求 10. 安装模板引擎
Mongodb数据库操作
1. NoSQL基础概念 2. MongoDB 简介 3. 数据库、集合、文档概念 4. 数据库操作 5. 集合操作 6. 文档CURD操作 7. 条件操作符 8. Limit与Skip方法 9. 排序 10. Node.Js的mongoose模块 操作MongoDB
基于node.js搭建express服务器
1. Express 简介 2. 安装 Express 3. 路由 4. 中间件 5. 视图 6. 模板引擎 7. AJAX 8. 跨域/JSONP 9. 搜索分页 10. 文件上传 11. 登陆注册
实战-大型单页应用
1. Web Socket 2. SSE 3. 网络爬虫(实现多人聊天时，服务器主动推送消息) 4. 常用工具使用Webpack 5. 压缩混淆 6. AMD/CMD规范 7. 结合Vue.JS实现单页面应用 8. Web APP 打包
(4)HTML5新特性 微信开发 微信小程序 学生项目
HTML5新特性
1. 音/视频 API 2. 本地存储LocalStorage/SessionStorage 3. Geolocation(地理定位) 4. 网络地图API 5.浏览器多线程Web Workers 6. 应用程序缓存 (Application Cache) 7. Canvas 画图、SVG 8. 拖拽事件、API 9. FileReader API 10. PAJAX 11. Bootstrap 12.插件：Swiper、图表、Iconfont
微信公众号开发
1. 接入微信公众平台 2. 账号申请 3. 微信JSSDK使用 4. 分享接口 5. 图像接口 6. 音频接口 7. 智能接口 8. 设备信息 9. 地理位置微信小程序开发10. 界面操作 11. WEUI框架 12. 微信小程序开发 13. 创建项目 14. 工具 15. 框架 16. WXML 、 WXSS 17. 组件 18. API
实战--团队协作工具
1. Git协作 2. 前端项目规范化 3. H5新特性 4. 即时通讯 5. 互联网服务接口调用