CSS制作尖角框
引用两个◆制作尖角(引用腾讯微博中的做法)
要点：使用了两个◆，利用其位置相差度来表示框线，如果没有外框线则可以使用一个◆，具体看代码。
- <style>
- .popBox { width:200px; height:300px; border:#ddd solid 1px; background:#f5f5f5; position:relative; margin-left:100px; }
- .popBox span { position:absolute; left:-9px; width:20px; height:20px; top:50px; font-size:19px; color:#f5f5f5; overflow:hidden; display:block; }
- .popBox em { font-style:normal; position:absolute; left:-11px; width:20px; height:20px; top:50px; font-size:19px; color:#ddd; overflow:hidden; display:block; }
- </style>
- <div class="popBox">
- <em>◆</em>
- <span>◆</span>
- </div>
上侧尖角和下侧尖角在某些浏览器可以需要兼容处理，这里只讲述这个方法
CSS使页面翻转，挺有意思的，备着愚人节用！
CSS使页面翻转，挺有意思的，备着愚人节用！
具体的实现通过ie滤镜和css3旋转，具体效果运行下面代码！
display:none和visibility:hidden区别
今天在处理一个Iframe的自动延伸的情况时，郁闷了很久了啊
我用的iframe是用在弹出层上的，但写了JS后，iframe onload却总是设置不了高度，即高度不能延伸！但肯定写的JS是没有错的
最后原因出在"display:none"上面，弹出层在默认状态下我设置了"display:none"，导致当层显示的时候却没有达到高度自动适应的效果！改为"visibility:hidden;"搞定
简单原因如下：
display:none,把对应的DOM元素从页面中移除，即不占空间，这样要想用JS让其自动适应高度就不存在了
visibility:hidden 只是把对应的DOM元素隐藏，但仍占有网页空间，所以当用JS让其适应高度后，自然适应的高度也是存在的了！
CSS常用技巧
1、A标签的使用
h1~~~h6不可以放在a标签中。
p不可以放在a标签中。
div不可以放在a标签中。
在Strict标准下，
a标签只能放在"p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" 标
签里
浏览器CSS HACK，常用总结
1、说明本文阐述了我们发现的在用CSS设计中有用的解决方案。
1.1 只对google chrom,Safari 3.1
以下CSS语句目前只有Google Chrome和Safari 3.1可以正常解释。
- body:nth-of-type(1) p {
- color: #333333;
- }
关于这个hack起作用的解释如下：
每个网页只有一个body元素
body:nth-of-type(1)将匹配页面内第一个也是唯一的一个body元素
只有Safari 3.1和google chrome支持:nth-of-type伪类