摘要：| 导语 在很多场景下，我们都需要给容器设定宽高比，实现自适应占位，巧用margin/padding可以让我们实现我们的需求 基本知识点 本文依赖于一个基础却又容易混淆的css知识点：当padding/margin取形式为百分比的值时，无论是left/right，还是top/bottom，都是以父元 阅读全文

摘要：| 导语 如果你已经是sass或者less的用户，你肯定已经在你的样式表中用过变量了，也知道有变量的存在，会非常灵活好用，如果你没用过，那一定很想在普通的css中有变量的存在，那么我们就来认识一下这个特殊的变量吧： currentColor 变量的好处 css中，如果有变量的使用，会让我们的代码能D 阅读全文

摘要：话不多说，上代码，关键在对应的低版本安卓的微信浏览器，需要-webkit-box对应的-webkit-box-orient-webkit-box-pack等的设置。.flex{ /* 设置弹性布局 */ display:-webkit-box;/* android 2.1-3.0, io... 阅读全文

摘要：在UIwebView 发现绑定longTap事件的操作中，在iso会有菜单弹出（复制黏贴，词典等），影响我们设定的交互操作，估要屏蔽之~ window.onload=function(){ document.documentElement.style.webkitTouchCal... 阅读全文

摘要：解决思路： 因为网页中的 Flash 是以控件形式出现的，优先级别较高，所以直接对它加链接是无效的，不过可以用按钮控件 BUTTON 来实现。方案一： 直接在按钮上加上onClick事件打开指定页面，运行后单击按钮时，按钮中的Flash有个下沉的动作，如果要取消这个动作，可以禁止按钮的交互性，然后... 阅读全文

摘要：昨天在项目中遇到要在一个输入框中使用缩进的情况，要用text-indent首行缩进2个文字。然后发现在webkit下，在输入框内容为空的时候，光标位置没有缩进，还是在行首，输入任意字符后，缩进才被激活。HTML代码如下：这里无论是input元素还是textarea，或是其它设置了contentEdi... 阅读全文

摘要：orm radio & checkbox 的对齐一直是个问题，不仅不同浏览器不同，不同的字体,不同的文字大小也会表现不一样，相信纠结了一大批人，如果没有好好整理总结下得出一个经验，相信每次碰到这个鬼东西都是比较纠结的，很头疼啊重置form radio & checkbox因为不同浏览器解析不一样，有... 阅读全文

摘要：在一次项目中，有一次要用到::selection伪元素，然后开发同学问我，CSS中一个冒号和两个冒号有神马区别？ 这好像真的是个问题，或许很多前端同学对此都有疑惑，查了些资料，证实了下两个符号的区别，简而言之：单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素。 W3C关于CSS3选择器... 阅读全文

摘要：经常遇到这个问题，但没记下来，今天同事TC问到，我就想如果记下来了 就可以直接发网址过去了。哈 所以还是要坚持总结。 0001 0002 0003 0004 0005 对li设置了float:left a标签需要自动宽度，写width:auto属性，加displ... 阅读全文

摘要：上代码： dib-wrap { font-size:0;/* 所有浏览器 */ *word-spacing:-1px;/* IE6、7 */}.dib-wrap .dib{ font-size: 12px; letter-spacing: normal; word-... 阅读全文

摘要：今天学习jQuery,看到nth-child(even)用法，特意找了下这个选择器的用法,在CSS3标准中，用法很强大。 1.简单的归纳下nth-child()的几种用法。 第一：nth-child(number) 直接匹配第number个元素。参数number必须为大于0的整数。 (EG) li:... 阅读全文

摘要：子层 前一段时间曾经遇到过内margin-top bug的问题，当时没有找到具体原因，只能用父层的padding-top属性来解决。 近日在做另外一个站点的时候，又遇到这个问题，决定好好的研究解决一下。 代码如下： 理想中的效果是父层和上部层贴边显示，子层距离... 阅读全文

摘要：前几天在做一个网站的引导页面，因为都是用图片，所以按钮需要用空a标签来做，发现a标签在IE6与IE7中点击无效中点击不了，其他浏览器都正常。一开始以为是z-index的问题，但不论z-index设置多大依然还是无效。代码大致如下： 给a标签添加文字后，发现只有鼠标放到文字上会成手型（说... 阅读全文

摘要：最近做页面时，经常碰到用 li 标签做纵向列表的时候，会在li的下面产生3px的空隙，之前也碰到过，但都用简单的方法解决了。搜索了一下，网上已经有人给出一些解决方案，但细看之后发现他们的解决方案和找到的原因都有些问题，甚至是错误。要么只单纯地提出问题，解决问题，没有更详细的探讨。所以这二天抽空写了... 阅读全文

摘要：问题重现： There are no scrollbars on this page in sane browsers html, body, p { margin: 0; padding: 0; } body { overflow: hidden; } p { wi... 阅读全文

摘要：众所周知IE6不支持position:fixed，这个bug与IE6的双倍margin和不支持PNG透明等bug一样臭名昭著。前些天我做自己的博客模板的时候，遇到了这个问题。当时就简单的无视了IE6——尽管有几个使用IE6的朋友，一起BS我……但是对于大项目或商业网站，如果有用到这个属性的时候，是... 阅读全文

摘要：@font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中，随着@font-face模块的出现，我们在Web的开发中使用字体不怕只能使用Web安全字体，你们当中或许有许多人会不自然的问，这样的东西IE能支持吗？当我告诉大家@font-face这个功能早在IE4就支持了你肯定会感到惊讶。我的Blog就使用了许多这样的自定义Web字体，比如说首页的Logo，Tags以及页面中的手写英文体，很多朋友问我如何使用，能让自己的页面也支持这样的自定义字体，一句话这些都是@font-face实现的，为了能让更多的朋友知道如何使用他，今天我主要把自己的一点学习过程贴上来和大家分 阅读全文

摘要：1.select的高度 select这类标签是最让人头疼的 因为IE是作为窗口控件 padding margin什么的 都不会生效 只能用在FF下 这时候 设置高度后你会发现 line-height是不生效的~ 所以要采用height+padding-bottom来实现文字居中 2.select下拉... 阅读全文

摘要：邮件模板，请严格按照下面的规则执行。邮件客户端和Web页面的需求不同，在编写代码的时候，考虑的方向也不一样。 1.原则，及思维出发点1. 不需要考虑DOM节点的精简和结构的优化。 以完成设计样式为最优先。必要时，不必吝啬使用表格嵌套，不必吝啬使用空的表格元素来占据空间。2. 宁可冗余，也不可缺少必要... 阅读全文

摘要：因为input输入框字数限定超过了背景图的宽度，背景图在ie67下会跟着移动，尝试了以下的解决办法： 1.background-attachment：fixed 但是ie7不管用，继续下一个方案 2.字数限定 对input做字数限定是最好的办法 3.背景图模拟 这个方法也不错，但是要根据情况... 阅读全文