CSS制作小箭头

    在西门大哥的博客中看到一篇文章:CSS实用小技巧,利用border属性实现一个标签做箭头,西门使用的是border,这里jucelin介绍另一种方法,用到的是一个特殊字符:◆。 演示:DEMO 代码:请狂击DEMO,然后右键,查看源代码(写得应该还算规范)。 主要用途:制作tips等。 实现原理:方法很简单,特殊字符◆就已经有了箭头的效果,那么用2个◆,用相对或绝对定位将他们完全重合,如果想做成向上的...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:2,263 ℃ | 标签:, , ,

    jquery.bgiframe使用方法

    jquery.bgiframe是用来处理IE6下select的z-index最高无法被透明层遮罩的BUG,原理也是利用IE6下的BUG,iframe可以遮罩住select,而DIV可以遮罩iframe,这样DIV也就遮罩住了select。 网上转载这个插件的文章很多,但大多都是复制过来的,来基本的错别字都没有修改。jucelin看到这个插件时就下载到了JS代码,但不知道初始化时对谁操作,于是网络中找了一会,很是失望的是,没有找到,也许是我...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:6,396 ℃ | 标签:, , , , , ,

    jQuery插件初识:Title提示插件jTipsShow

    jQuery插件多如牛毛,jQuery的高手也是随处可见,作为目前主流javascript框架,jQuery已经是无孔不入。咱也跟上时髦,做点特效,自己观赏观赏,并作为以后参考。高手有时间帮忙指导指导,先谢过。 一、写在前面的话: jucelin也是初学者,写这么个小插件用了一个上午的时间,真是会者不难,难者不会。虽说Title提示类插件已经有很多高手写出来了,如张鑫旭的jQuery万能浮动框插件,功能很强...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:1,235 ℃ | 标签:, , , , , ,

    CSS换行的那些事

    在CSS网页布局中,常常会遇到这样的问题,强制文字换行,而不是在一行内显示撑开容器影响布局。而有些时候可能会强制内容不换行,多出的 部分隐藏掉即可,关于强制不换行与强制换行的一些CSS属性52CSS.com作一些整理,希望能给大家的工作和学习提供参考。 先了解以下几个属性: 强制不换行 p.xx { white-space:nowrap; } 自动换行 p.xx { word-wrap: break-word; word-break: n...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:461 ℃ | 标签:, , , ,

    IE BUG:内联的图片超链接失效

    BUG描述下先:在标签<a>下加入<span>和<img>标签,并将<a>和<span>标签定义为display:block,设定大小,测试发现鼠标放在图片是不会显示手型,图片的链接也“失效”了(其实未失效,下面解释),点击没有任何效果,但点击<a>标签的空白位置,链接依然有效。 适用平台 IE6-8下出现,IE9未测试,Chrome正常。 BUG重现 下面是专门写的一个测试页面,有兴趣...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:1,058 ℃ | 标签:, , , , , , ,

    高效 CSS 指南

    避免通用类 确保选择器不是以通用类结束。 不要用标签名或class来描述ID类 如果你有一个选择器是以ID类作为关键选择符,请不要添加多余标签名上去。因为ID是唯一的,你不要为了一个不存在的理由而降低了匹配的效率。 差 – button#backButton { } 差 – .menu-left#newMenuIcon { } 好 – #backButton { } 好 – #newMenuIcon { } 不要用标签名来描述 class 类 和上一条类似,所有的 class ...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:461 ℃ | 标签:, , ,

    [转]CSS常用的hack技巧

    在iteye上看到一篇介绍CSS常用的Hack的技巧,转过来自己Mark下。 color:red; /* 所有浏览器都支持 */ color:red !important;/* 除IE6外 */ _color:red; /* IE6支持 */ *color:red; /* IE6、IE7支持 */ +color:red;/*IE7支持*/ *+color:red; /* IE7支持 */ color:red\9; /* IE6、IE7、IE8、IE9支持 */ color:red\0; /* IE8、IE9支持 */ color:red\9\0;/*IE9...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:563 ℃ | 标签:, , , , ,

    html+css判断各个IE浏览器版本

    在编写网页代码时,各种浏览器的兼容性是个必须考虑的问题,有些时候无法找到适合所有浏览器的写法,就只能写根据浏览器种类区别的代码,这时就要用到判断代码了。 在HTML代码中,区别各种浏览器的代码如下(以ie6为例,这时目前国内用户最多的,得益于盗版xp系统的广泛流传….不过这玩意也是绝大部分兼容性问题的根源,因为其标准化程度实在是….): <!--[if IE 6]> 仅IE6可识别 <![...阅读全文
    作者:jucelin | 分类:前端设计 | 阅读:1,554 ℃ | 标签:, , , ,
更多