随笔分类 -  css技巧

摘要:http://css-tricks.com/examples/ShapesOfCSS/ 阅读全文
posted @ 2014-08-07 17:31 microsoft_kk 阅读(182) 评论(0) 推荐(0) 编辑
摘要:Demo 原理是标准浏览器下用table和table-cell布局,然后用vertical-align:middle居中元素,但IE67不支持table布局,所以用了用了css hake,就是带#开头的属性... 阅读全文
posted @ 2014-08-07 17:29 microsoft_kk 阅读(291) 评论(0) 推荐(0) 编辑
摘要:padding-bottom: 5000px;margin-bottom: -5000px; 阅读全文
posted @ 2013-11-11 17:58 microsoft_kk 阅读(186) 评论(0) 推荐(0) 编辑
摘要:.pagenavi .floatBox1{position:relative;left:50%; float:left;}.pagenavi .floatBox2{position:relative;left:-50%; float:left;} 阅读全文
posted @ 2013-08-27 18:17 microsoft_kk 阅读(294) 评论(0) 推荐(0) 编辑
摘要:Linear一下,你就知道 阅读全文
posted @ 2013-07-02 14:52 microsoft_kk 阅读(631) 评论(0) 推荐(0) 编辑
摘要:transition: 过渡时间 被改变属性 执行函数 延迟时间 transition:width 1s,height 2s 1s;transform: 平移(translate)、缩放(scale)、旋转(rotate)、扭曲(skew) translale:translateX、translateY、translateZ、translate(x,y)、translate3d(x,y,z) scale:scaleX、scaleY、scaleZ、scale(x,y)、scale3d(x,y,z) rotate:rotateX、rotateY、rotateZ、... 阅读全文
posted @ 2013-07-02 11:56 microsoft_kk 阅读(840) 评论(0) 推荐(0) 编辑
摘要:"_" ------ IE6 "-" ------ IE6 "+" ------ IE7 "!important" ------ IE7 "*" ------ IE6/IE7 "\9" ------ all IE 阅读全文
posted @ 2013-07-01 11:01 microsoft_kk 阅读(193) 评论(0) 推荐(0) 编辑
摘要:1,父级div定义heightLeftRightdiv2原理:父级div手动定义height,就解决了父级div无法自动获取到高度的问题。优点:简单,代码少,容易掌握缺点:只适合高度固定的布局,要给出精确的高度,如果高度和父级div不一样时,会产生问题建议:不推荐使用,只建议高度固定的布局时使用评分:★★☆☆☆2,结尾处加空div标签clear:bothLeftRightdiv2原理:添加一个空div,利用css提高的clear:both清除浮动,让父级div能自动获取到高度优点:简单,代码少,浏览器支持好,不容易出现怪问题缺点:不少初学者不理解原理;如果页面浮动布局多,就要增加很多空div, 阅读全文
posted @ 2013-06-27 11:25 microsoft_kk 阅读(415) 评论(0) 推荐(0) 编辑
摘要:网页设计中的默认字体为font: 12px/1.5 Tahoma, Helvetica, Arial, sans-serif;理由如下: font-size采用px, 不采用em. 理由是em带来的可用性提升很有限,同时基于em很难保证视觉设计的精确性,并且现在主流浏览器都支持“全页面缩放(Full Page Zoom)”功能,是时候不用考虑基于字体大小(em)的设计了。 line-height采用1.5, 也就是18px. 这是淘宝视觉规范中定义的行高,对于12px字体,这个行高看起来很舒服。 font-family默认采用Tahoma. Tahoma是英文Windows操作系统的默认... 阅读全文
posted @ 2013-05-09 14:44 microsoft_kk 阅读(1111) 评论(0) 推荐(0) 编辑
摘要:关于默认元素在不同浏览器中的margin值是多少的问题,今天做了一个探讨 /*2013-4-11*/// body的margin值firefox 20.0 ----------------------- body的margin为: margin:8px 8px 8px 8px;Internet Explorer 6.0 ----------- body的margin为: margin:15px 10px 15px 10px;Internet Explorer 7.0 ----------- body的margin为: margin:16px 11px 16px 11px;Internet Ex 阅读全文
posted @ 2013-05-08 15:39 microsoft_kk 阅读(489) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf- 阅读全文
posted @ 2013-04-20 13:03 microsoft_kk 阅读(403) 评论(0) 推荐(0) 编辑
摘要:border-bottom:1px solid#e6eaf5;border-top:1px solid#7390bf;overflow:hidden;height:0px; 阅读全文
posted @ 2013-04-19 18:23 microsoft_kk 阅读(1157) 评论(0) 推荐(0) 编辑
摘要:一、文件规范1、文件均归档至约定的目录中(具体要求以豆瓣的CSS规范为例进行讲解):所有的CSS分为两大类:通用类和业务类。通用的CSS文件,放在如下目录中:基本样式库 /css/core通用UI元素样式库 /css/libJS组件相关样式库 /css/ui业务类的CSS是指和具体产品相关的文件,放在如下目录中:读书 /css/book/电影 /css/movie/音乐 /css/music/社区 /css/sns/小站 /css/site/同城 /css/location/电台 /css/radio/外联CSS文件适用于全站级和产品级通用的大文件。内联CSS文件适用于在一个或几个页面共用的C 阅读全文
posted @ 2013-04-18 10:50 microsoft_kk 阅读(348) 评论(0) 推荐(0) 编辑
摘要:给元素设定 left: 0; right: 0 ,元素就会实现自适应 阅读全文
posted @ 2013-04-02 11:45 microsoft_kk 阅读(2021) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示