摘要:定义 css雪碧图(sprite)是一种网页图片应用处理方式,它允许将一个页面涉及到的所有零星图片都包含到一张大图中。使用雪碧图的处理方式可以实现两个优点:【1】减少http请求次数【2】减少图片大小,提升网页加载速度 (多张图片加载速度小于拼合成的图片的加载速度)凡事都不完美,实现优点的同时也带来 阅读全文
posted @ 2017-05-02 11:15 circe 阅读(49) 评论(0) 推荐(0) 编辑
摘要:CSS之图片压盖效果案例分析最近在做某个网站的静态页面,发现有很多图片压盖效果的布局,特来记录一下布局技巧。碰到这种布局你会怎么做: 第一反应肯定是浮动,没错,可以把这几个图片放在ul列表的li标签里,给每个li标签内添加img和文字。如:<ul> <li> <img src="" alt="">< 阅读全文
posted @ 2017-04-29 00:06 circe 阅读(751) 评论(0) 推荐(0) 编辑
摘要:css三种图片格式比较及背景透明度图片 :jpg 特点:可压缩,色彩丰富,压缩后图形变模糊,但保存大小会变小。 缺点:不能保存图层,不支持透明和动图。png 特点: 能够保存图层,支持透明和半透明 缺点: 不能压缩,如果图片色彩丰富,图形复杂同样一个图片大小会远大于jpg图片 如果图片较小,保存pn 阅读全文
posted @ 2017-04-28 23:40 circe 阅读(132) 评论(0) 推荐(0) 编辑
摘要:css制作网站规范对css文件分层级进行书写和引用:基本划分四个等级,所有网站公共使用的清除默认样式、所有网站都能使用的原子类、自己网站公共的部分、自己网站每个网页自己独有的部分。1,清除默认样式 雅虎的YUI的reset.css文件,清除默认样式是最好的。 使用:要么使用网址形式绝对路径,更多的将 阅读全文
posted @ 2017-04-28 23:31 circe 阅读(60) 评论(0) 推荐(0) 编辑
摘要:css伪类及logo插入图关于css的一些小知识点伪类 伪类的权重与类的权重相同。 伪类有权重,a:link a:visited a:hover a:active 工作中为了用户体验,link和visited状态一样,hover状态不同,active不写。 a选择器:color, text-deco 阅读全文
posted @ 2017-04-25 00:18 circe 阅读(43) 评论(0) 推荐(0) 编辑
摘要:css 相对定位和绝对定位及案例定位对于页面布局起着很大的作用,网上关于定位概念的技术文章已经很多了,我就不多说什么了,就说一下具体应用吧1.知识点: 三种常见定位比较: 不同点: relative: 相对定位没有脱离文档流,原位置保留标准流位置,没有让出来,实体化显示位置通过设置偏移值发生偏移。  阅读全文
posted @ 2017-04-24 23:59 circe 阅读(150) 评论(0) 推荐(0) 编辑
摘要:css 创建常用图形网站中有一些常见的图形用css就可以实现出来,本人就此总结了几种常用的css图形画法,引用链接http://www.cnblogs.com/lovemomo/p/4878293.html圆形 css 创建常用图形 网站中有一些常见的图形用css就可以实现出来,本人就此总结了几种常 阅读全文
posted @ 2017-04-21 23:55 circe 阅读(43) 评论(0) 推荐(0) 编辑
摘要:圣杯布局和双飞翼布局今天看了很多圣杯布局和双飞翼布局的技术博客,通过自己的理解总结一下吧。1.二者相同点: 实现的都是三栏布局,两边的盒子宽度固定,中间盒子自适应,也就是我们常说的固比固布局。它们实现的效果是一样的。2.不同点: 圣杯布局知识点:浮动,负边距,相对定位,不需要添加额外标签。 双飞翼: 阅读全文
posted @ 2017-04-21 21:26 circe 阅读(32) 评论(0) 推荐(0) 编辑
摘要:css 深入学习css之后会发现需要记忆的东西有很多,知识点也很零碎,在此记录几个比较常见的有点难度的知识点 zoom=1 :IE 浏览器的专有属性,解决ie下比较奇葩的bug。如外边距(margin)的重叠,浮动的清除,ie的haslayout属性等。 zoom定义:设置或检索对象的缩放比例。设置 阅读全文
posted @ 2017-04-19 00:01 circe 阅读(50) 评论(0) 推荐(0) 编辑
摘要:相对路径绝对路径 相对路径:从文件本身位置出发,根据相对位置进行的查找。 (注意:文件夹和文件名不能出现中文) - 同级查找:<img src="pic.jpg" alt=""> - 子级查找:<img src="images/pic.jpg" alt=""> - 上级查找:<img src=".. 阅读全文
posted @ 2017-04-18 23:47 circe 阅读(199) 评论(0) 推荐(0) 编辑