随笔分类 -  CSS

【Bootstrap】(一)——文件结构介绍
摘要:文件结构、内容下载文件后你会发现如下所示的文件结构,分为编译版和源码版。编译版:正常情况下,编写页面常用到的样式集(不含响应式)以及插件集。源码版:bootstrap官网下整站的源码。包含很多模板页和less文件,并采用node.js搭建。1.1编译版 bootstrap/ ├── css/ │ ├── bootstrap.css─────────全部样式集合(不含响应样式)(123KB) │ └── bootstrap.min.css────────────(压缩版)(104KB) ├── js/ │ ├── bootstrap.js────────────全部13款... 阅读全文

posted @ 2013-05-31 18:05 _xiaoMo_ 阅读(1468) 评论(0) 推荐(0)

CSS2——IE6圆角
摘要:IE6 圆角 by xiaoMo 优点: 兼容任何浏览器缺点: 标签不语义 阅读全文

posted @ 2013-04-30 19:45 _xiaoMo_ 阅读(391) 评论(3) 推荐(0)

CSS3——iPhone
摘要:: Message Reminder Mail ... 阅读全文

posted @ 2013-04-28 11:42 _xiaoMo_ 阅读(298) 评论(0) 推荐(0)

CSS3——齿轮转动
摘要:HTML关键代码: 1 div{ 2 -webkit-animation: xuanzhuan 5s linear; 3 -webkit-animation-iteration-count: infinite; 4 } 5 6 @-webkit-keyframes xuanzhuan { 7 from { 8 -webkit-transform: rotateZ(0); 9 }10 11 to {12 -webkit-transform: rotateZ(360deg);13 }14 }CSSJS 阅读全文

posted @ 2013-04-27 15:04 _xiaoMo_ 阅读(1431) 评论(2) 推荐(0)

【一天一道兼容性】之——IOS4及以下fixed失效
摘要:少叙闲言如今手机换代都快赶上换衣服速度了,每每出新手机都是各种搭载最新系统,大家都在关心android5.0该不该叫切糕?IOS的最新版啥时候出完美越狱……,可偏偏就总有些人抱着旧系统来测你的页面,没有那金刚钻,还非要揽这瓷器活?!android碎也就那么地了,你苹果来凑什么热闹啊……,今儿接到个任务,说是领导家有个亲戚,上我们时候首页的一个fixed元素在ios旧版本中失效,让做兼容……,好吧,为了什么鬼亲戚,我只能蝴蝶效应了……正题demo:<style> html, body, div, p {margin: 0;padding: 0; } body {height: 300 阅读全文

posted @ 2013-04-18 18:51 _xiaoMo_ 阅读(360) 评论(0) 推荐(0)

【总有一些东西要弄清】——说说面试时一系列的CSS问题
摘要:仅以此篇缅怀那些笔试100次,问100次的CSS问题。问: CSS选择符有哪些?哪些属性可以继承?优先级?内联和important哪个优先级高?选择符1通配选择符(*)表示页面内所有元素的样式*{font-size:12px;margin:0;padding:0;}2类型选择符(body、div、p、span等)网页中已有的标签类型作为名称的选择符div{width:10px;height:10px;}3群组选择符(,)对一组对象同时进行相同的样式指派a:link,a:visited{color:#fff;}4层次选择符(空格)包含选择符对某对象中的子对象进行样式指派#header top{. 阅读全文

posted @ 2013-03-19 23:49 _xiaoMo_ 阅读(682) 评论(5) 推荐(2)

【IE大叔的嘴歪眼斜】之—— 由hasLayout引发的临床CSS Bug表
摘要:IE大叔这嘴歪眼斜的毛病不是一天两天了,集体拉出来测试时候,明明大家都在微笑,就丫一副呲牙咧嘴的......哎,没办法,谁让咱国内市面上都是这种呲牙咧嘴的浏览器呢.....(关注IE678死亡速度)查阅,翻读,摘抄,记录,再逐一实践,总结,终于对他这个臭毛病有了根源上的认识。hasLayout!先上定义:它是IE的特有属性。它决定着一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算组织内容。为了区别这两个概念,渲染引擎采用了hasLayout的属性,true或false,当属性为true时,我们说这个元素触发了布局(Layout)。具有hasLayout属性的标签:< 阅读全文

posted @ 2013-03-07 19:02 _xiaoMo_ 阅读(1220) 评论(3) 推荐(2)

【IE大叔的杀马特审美】之——CSS盒子模型
摘要:干前端,跑不了和IE大叔打交道.....有句话叫存在即合理,IE大叔在前端界是灰常的NB啊,既然咱改变不了世界,就只能改变自己。先上定义:为了给浏览器上各个元素排版定位,浏览器会根据渲染模式为元素生产4个矩形框,分别从外到内为margin、border、 padding、content,它们不可分割,但可能重合,这就是所谓的盒子模型,即CSS对一个元素渲染后的抽象形态。来一起看看大叔的眼里的盒子。总结一哈: 盒子模型的范围也包括 margin、border、padding、content 但W3C认为:盒子大小= content ... 阅读全文

posted @ 2013-03-05 18:31 _xiaoMo_ 阅读(829) 评论(6) 推荐(0)

【IE大叔开玩笑】之——CSS设置IE6中容器高度的BUG
摘要:在IE6中设置display:block的空容器一个较小高度时,如<p style="height:1px;"></p>,会发现其高度不能小于某个值<p style="background: #f00; height: 1px; font-size:0"></p><!-- demo1 -->demo1:设置font-size:0,但是这个容器的高度最小为2px,所以没有办法实现高度为1px的效果<p style="background: #f00; height: 1px; li 阅读全文

posted @ 2013-03-05 14:54 _xiaoMo_ 阅读(388) 评论(1) 推荐(0)

导航