阳光果苏

# Bootstrap 是什么 前端框架 JQ：库。仓库、工具库。一个 JS 文件 BS: 框架。一套快速搭建响应式网站的解决方案（HTML+CSS+JS） 区别： 前者是弱约定：开发权（选择权）在开发者手里，开发者可以绝对要不要它的方法和属性 后者是强约定：主导权在框架手里。开发者需要按照框架的约定来开发。必须要按照它的写法或规则来写代码。 响应式设计 BS 一套代码解决 3 端适配问题。 栅格化系统 它是一种思想，而不是技术。 网页：是一个放模块的容器。网页拆分为很多个部件（模块）：导航、搜索、tab 切换页、卡片、轮播图、侧边栏。。。 全球流行...

# 移动端开发 添加 viewport 内部布局 弹性布局 + 文字等如何保持等比例 图片自适应（让它 100%） 适当使用响应式 移动端开发的其他问题 # 移动端开发的现实问题 设计师一般只会根据主流机型设计一套 UI 界面，工作即结束。那么所有的适配屏幕的工作都会交给前端来处理 手机端屏幕尺寸各异，如何像 UI 那样，只需要写一套移动端代码就能适配所有的屏幕，并能保证一致的用户体验？ 要找到一种方式：等比例适配。 比如设计师针对的是 iPhone8 做的一套设计（750px）, 前端拿到 UI 设计搞后，也可以根据 iPhone8...

# 响应式设计（媒体查询） 让一套代码可以在多个终端中适配。一套代码解决所有设备的显示问题。即只写一套代码，在多个终端到处运行。终端：PC 端、移动端端、手表、智能眼镜等。 就像写 if 语句那样： 123456789if(屏幕大小是768以下){ //这里写768px以下的样式}if(屏幕大小>769&& 小于1024时){ //这里写对应的样式 }if(大于1024时){ //这里写对应的样式} #...

# 怪异盒模型 区别：不是新增了盒模型属性，盒模型的总宽总高的计算方式发生了改变 面试：标准盒模型和怪异盒模型的区别？ 1234/*要给元素启用怪异盒模型，需要写对应的样式*/标签{ box-sizing:content-box(默认值)|border-box（怪异盒模型）;} 标准盒模型（标准盒模型） 总宽需要 3 个属性参与 12345总宽=width+左右padding+左右border总高=height+上下padding+上下border//...

# CSS 的运动 就是让一个盒子改变它的状态或位置。 改变位置：用盒模型、偏移属性、浮动 改变状态：鼠标摸上去，添加 class 但是这样的运动没有任何过渡，太突兀了，可以添加过渡样式实现过渡效果，让运动如丝滑般顺滑 # 过渡 transition 该属性可以让元素实现过渡效果，让状态或位置的改变不是瞬间完成而是按照一定的方式和过程完成。 1234567891011121314151617transition:style duration delay timing-function;//参数说明transition:要过渡的样式 持续时间 是否延迟进行...

# CSS3 新增特性 选择器 边框：圆角，阴影和边框图片 背景：背景图片大小，位置，平铺 1,2,3 今天 文字阴影、溢出，加载新字体 (将图标当字体使用) 1 次课 2D/3D 转换，过渡，动画 做出类似于 PPT 的效果，2 次课 多栏布局，弹性布局 1 次课 媒体查询，响应式 1 次课（一套代码可以用在多个终端中使用） # CSS3 新增的选择器 在 5 年前，如果要体验 CSS3 的新特性，可能需要添加前缀来实现。 渐进增强的开发方式 1234chrome/safari:-webkit- firefox:-moz-IE:-ms-opera:-o- 之前学 jquery...

# H5 的地理定位（JS 对象来实现定位） 使用场景（LBS 环境中：local based services）基于本地服务的应用中： 社交（近场服务）陌陌 、微信摇一摇 导航软件：高德、百度地图、凯立德、腾讯地图，滴滴打车 生活服务类：外卖软件、订票、旅游 健康类的应用：跑步，咕咚，悦跑圈，keep 以上服务获取用户位置可以划分为两大类： 只需要获取一次用户位置 1，3 类似于延时器（只执行一次） 要不断的获取用户位置 2，4 类似于定时器（要不断的执行） # navigator.geolocation 对象下的 3...

# 本地存储有什么用 用户登录后，记住用户名密码，下次打开时就不再重新登录 第一次访问某网站时，会弹出一个引导操作，下次访问时则不再出现，除非清空浏览器缓存 网站换肤，我们选择了某个皮肤后，下次访问该网站应该还是之前选择的那个皮肤样式 购物车同步（多页面间的通信） 记录用户的浏览记录 离线下载 只有一个本质：就是保存数据到用户本地（用户的终端设备中） # localStorage–永久存储 读 12localStorage.getItem("变量名");//key名var n=localStorage.name; 写...

# 视频标签 -video 1234<video> //假设要添加更多的播放源，就需要添加该标签 <source></source></video> 属性： 1）width、height 定义宽高 默认 300*150（视频拥有） 2）controls 规定标签是否显示视频播放控件 controls=‘controls’ 3）src 文件路径 4）poster 规定视频加载时显示的照片（视频拥有） 5）paused 是否暂停了，true 表示暂停，false...

# 新建画布 123<canvas id="ca" width="454" height="350">亲爱的，您的浏览器不支持canvas，请升级浏览器后再来</canvas>//默认的宽度是300*150注意事项：宽高不能写%，写了会把它当做固定单位来看待 # 准备画笔（工具）—js canvas 只有一只 2d...