一个有趣的布局
星期日, 07月 6th, 2008 277 views尝试一下，不用定位，只用浮动，就把这个排版排出来看看。 不要被她迷惑了，其实没你想的那么难 实在想不出来，可以看这里。
Archive for the ‘CSS’ Category
位于p最开始的span设置text-indent影响p的整个第一行，反继承
星期三, 06月 11th, 2008 132 views今天遇到这个问题 描述起来也蛮麻烦的 搜也搜不到，所以问了群里的朋友， 感谢Robin还有$一揪就出来， 他俩对此问题进行了深入的讨论， 感谢他们细心解答，真相才得以水落石出。 最后本文采用了$一揪就出来的方法： 如下代码 span.imgblock{ height:16px; width:16px; display:inline-block; background:#0099FF; text-indent:5em; overflow:hidden; } 这里看不见，确可以复制到选中前边的框子，然后复制吧。你可以复制所有本文 给最开始的span设置了text-indent属性之后，导致了整个父元素p的text-indent属性 IE6/7都确认有这个bug，可以说是一种反继承。 解决的方法是多一个标签,避开问题多多的text-indent， 设置内层标签的行高,以及padding-left。就能够大致解决问题了。 即保证了效果，也保证了文本的不丢失，为残障人士，搜索引擎，以及想要复制文章的人给予方便。 至少可以不用空格了，使用空格虽然可以轻松达到效果，无需使用text-indent了，但这显然不好。 span.imgblock{ height:16px; width:16px; display:inline-block; background:#0099FF; overflow:hidden; } strong.aaa{ display:inline-block; padding-left:2000px; } 这里看不见，确可以复制到。选中前边的框子，然后复制吧你可以复制所有本文
button 背景图片IE下不认
星期一, 04月 7th, 2008 46 views今日出现个离奇的问题 IE下设置了button 如下css button{border: none;background-image: url(button_gray_4.gif);} 结果发现IE下按钮始终是系统默认样式，并非我设定的样式。 捣鼓了半天，发现如果这样设 button{border: none;background: url(button_gray_4.gif);} 就又离奇的行了。真是莫名的…… 同时也发现，这个跟最开始的dtd声明有关，如果去除了顶部的 ，也就有效了。。。无语啊。。。 而如果对button 的border先设一个的话，也会有效：比如 border: 1px;border:none;background-image: url(button_gray_4.gif); 但如果图片不存早的话，表现效果也不相同…… [html] button.btn1{border: none;background-image: url(button_gray_4.gif);} button.btn2{border: none;background: url(button_gray_4.gif);} button.btn3{border: 1px;border:none;background-image: url(button_gray_4.gif);} 无背景图 有背景图 有背景图 [/html]
