苍狼之眼

2017年2月11日

响应式设计第一章

摘要: 1.支持小屏幕设备的重要性 2.什么是移动网站设计 3.什么是响应式设计 4.视口和屏幕的区别 5.使用HTML5和CSS3 总结: 1.由于市场智能手机浏览器使用量大幅度的上涨,已经超越了PC端的网上浏览内容. 2.针对移动端的网站设计,针对不同手机端的设备宽度做不同的网页内容的展示 3.响应式设 阅读全文

posted @ 2017-02-11 11:00 苍狼之眼 阅读(114) 评论(0) 推荐(0) 编辑

2016年4月16日

转载css的background-position

摘要: 这是一个有趣的话题 其实我并不确切的平时大家是怎么去应用或者玩转一个属性,一个值。我能肯定的是这些东西都有不少的可玩性。 我今天要聊的 background-position 应该已经被大家玩得色彩斑斓了。尤其是 CSS Sprites流行的这些年,background-position 基本上是被 阅读全文

posted @ 2016-04-16 16:39 苍狼之眼 阅读(230) 评论(0) 推荐(0) 编辑

2016年3月10日

win7下安装Sass和compass

摘要: 由于项目需要我们使用到sass来编译css文件。本人在win7下开发 由于国内安装sass遇到了一些困难,后来不得不网查询,后来终于解决了,这里介绍一下 1.要安装sass环境必须要先安装rubyInstaller 网址:http://rubyinstaller.org/downloads/ 可以选 阅读全文

posted @ 2016-03-10 00:41 苍狼之眼 阅读(240) 评论(0) 推荐(0) 编辑

2016年2月19日

解决清除浮动的最佳办法

摘要: 之前给大家介绍两种浮动闭合的办法CSS清除浮动 万能float闭合,得知很多同学都在使用下面的骨灰级解决办法: .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear,我们知道这样能解决基本清 阅读全文

posted @ 2016-02-19 11:04 苍狼之眼 阅读(218) 评论(0) 推荐(0) 编辑

2016年2月17日

angular初步认识一

摘要: 最近比较流行MVC前端框架开发,最近研究了一个框架AngularJS框架 不说那么多,先上例子,我是个代码控 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>capter1-an 阅读全文

posted @ 2016-02-17 00:34 苍狼之眼 阅读(217) 评论(0) 推荐(0) 编辑

js动画之同时运动

摘要: 一个物体可以同时做多个运动,而不是完成一个运动再一个运动,而是让你感觉他们是同时发生的。 直接上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>同时运动</title> <style> .animati 阅读全文

posted @ 2016-02-17 00:22 苍狼之眼 阅读(289) 评论(0) 推荐(0) 编辑

2016年2月13日

js动画之链式运动

摘要: 链式运动就是当一个运动完,又启动另外一个运动,这个怎么实现呢?这里我们是用用回调函数实现一套链式动画 显示给div左移100像素,然后然后透明度变100 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>链式运 阅读全文

posted @ 2016-02-13 00:46 苍狼之眼 阅读(446) 评论(0) 推荐(0) 编辑

2016年2月9日

js动画之获取元素属性

摘要: 首先我们要介绍一些知识 offsetWidth element.offsetWidth = width + padding + border; width 我们也知道element.style.width 这个属性一般用来修改属性,那么在获取这个属性的时候, 如果这个元素的的样式是定义在css的文件 阅读全文

posted @ 2016-02-09 23:44 苍狼之眼 阅读(455) 评论(0) 推荐(0) 编辑

js动画之平抛运动

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>平抛运动运动</title> <style> body{margin: 0px;padding: 0px;} .animation{ background-co 阅读全文

posted @ 2016-02-09 22:40 苍狼之眼 阅读(320) 评论(0) 推荐(0) 编辑

js动画之多物体运动

摘要: 多个物体这不能使用一个定时器了,要给每个物体一个定时器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>多物体运动</title> <style> body{margin: 0px;padding: 0px; 阅读全文

posted @ 2016-02-09 21:57 苍狼之眼 阅读(235) 评论(0) 推荐(0) 编辑

导航