06 2012 档案

border：0；和border：none；的区别
摘要：无边框用border:none还是border:0一直都是一个热议的问题，两者除了在渲染性能上面的差别以为，在标准浏览器中页面表现是没有任何差别的。下面一起认识一下它们本质的区别：一、border:noneborder-style的简写在chrome审查元素看到以下结果element.style {border: none;border-top-style: none;border-right-style: none;border-bottom-style: none;border-left-style: none;border-width: initial;border-color: ini 阅读全文
posted @ 2012-06-25 11:00 sheena的世界 阅读(7484) 评论(0) 推荐(0)
如何在Drupal中避免重复列末尾的Margin
摘要：一个宽度为400px的列表项里面，要求最后一个列里面没有右边距，效果预览为：我们一般喜欢给最后一个li写一个单独的样式，注明no-mr：margin-right：0；但是如果是在大量动态随机的显示时，我们会发现需要用到js去控制了，计算出最后一个是4的倍数，再动态添加no-mr这个样式。有没有简单的css，可是实现，不用程序控制就能实现最后一个的margin-right：0呢；答案是肯定的。这里我们来说一下纯css方法和js方法。第一种：css实现给外层加一个div，并给它加overflow：hidden；通过这个外层的div来使它隐藏掉最后一个的右边距，记住是隐藏，而不是去掉。如果你亲手做一 阅读全文
posted @ 2012-06-20 16:04 sheena的世界 阅读(525) 评论(0) 推荐(0)
实现单行超出部分，省略号表示 兼容各浏览器
摘要：这里介绍两种方法，都是css实现的，其他的js，jq代码，可以去网上搜索很多。第一种：margin负值定位法<div class="text_overflow" ><div class="text_con" >这是一段比较长的文字，用来测试是否文字溢出时会用省略号显示。</div><div class="text_dotted" >…</div>.text_overflow{width:300px; height:25px; overflow:hidden;line-heig 阅读全文
posted @ 2012-06-12 17:01 sheena的世界 阅读(5419) 评论(1) 推荐(0)
css 实现层半透明，且块内文字不透明（兼容ie6等各种浏览器）
摘要：兼容各浏览器且效果一致，有两种方法：一、使用opacity+Alpha Filter其实见到这个的时候，我们的第一想法当然是 background + opacity，在不支持 opacity 的 IE 再使用 filter 的 alpha 滤镜来实现。但是如果仅仅只是如此，这个最外层，最内层和文字，都被设置了 opacity（alpha 也是使用 opacity ）导致文字模糊 。当然，我们可以给各层设置 opacity 变回来，但这是很麻烦的事，所以我这里将文字放在外层的p标签内，再给一个相对定位，（也可给绝对定位）让其显示在半透明的div里面。代码如下：<!DOCTYPE html 阅读全文
posted @ 2012-06-01 14:25 sheena的世界 阅读(6915) 评论(0) 推荐(0)