-
onmouseover的td里面有a标签时晃动
所属栏目:[经验] 日期:2018-10-06 热度:117
这是因为当鼠标移动到td里面的 a 上时,td 的 onmouseout 事件会被触发。 然后 a 的 onmouseover 被触发,由事件传递链,向上又发送到td, 因此 td 的 onmouseover 再次触发,于是就会有闪烁了。 有两种方法可以解决,第一,在 td 的onmouseout 中,对 event[详细]
-
css box-shadow阴影不透明的解决办法
所属栏目:[经验] 日期:2018-10-06 热度:163
你在使用box-shadow来实现阴影效果的时候,有没有注意到有些情况下,阴影并不是透明的效果 Copy to Clipboard 引用的内容:[www.veryhuo.com]!DOCTYPE HTML html head meta http-equiv=Content-Type content=text/html; charset=gb2312 title烈火学院/titl[详细]
-
CSS之a:hover下的span样式无效的解决方法
所属栏目:[经验] 日期:2018-10-06 热度:197
下面的例子中,a标签里包含了一个span,我们可能希望当鼠标移到a上时,span的样式发生变化,但是在ie6下发现无效 !DOCTYPE HTMLhtmlheadmeta http-equiv=Content-Type content=text/html; charset=gb2312title/titlestyle type=text/cssa:hover span{font-[详细]
-
纯CSS3文字渐变内发光投影效果
所属栏目:[经验] 日期:2018-10-06 热度:55
今天群上面同志们在讨论css3内发光效果,自己也就研究一下,写了个效果出来,涉及css3投影,渐变,蒙版,伪类等知识点,现在写下设计思路,仅供参考。发个效果图大家看先: 一般我们都是用css3的box-shadow来实现盒投影,用text-shadow来实现文字投影,box[详细]
-
纯CSS3透明水晶盒的实现
所属栏目:[经验] 日期:2018-10-06 热度:68
打过了趟深圳回来后,已经快半个月,在广州购书中心逛了下,发现2本前端书《重构HTML-改善WEB应用的设计》、《CSS3 实战》,看了一半《重构HTML》,发现看不下去,里面写的感觉不是很受用,可能是现在水平有限,参透不了,于是放下看《CSS3》。之前脑子里[详细]
-
[译文]避免常见的六种HTML5错误用法
所属栏目:[经验] 日期:2018-10-06 热度:84
原文链接请点击此处,作者为Richard Clark. 本文为原创翻译,同时对原文做了一些简化处理。本文遵循署名-非商业性使用协议。 一、不要使用section作为div的替代品 人们在标签使用中最常见到的错误之一就是随意将HTML5的section等价于div具体地说,就是直接[详细]
-
纯Css实现网页上的Tips提示之小三角箭头
所属栏目:[经验] 日期:2018-10-06 热度:101
使用纯Css实现的网页上一个Tips提示效果,相信大家都在一些大网站见到过,例如,我们经常在淘宝网上购物时看到的小提示功能,如图一,在本例子中我们仅实现了小三角箭头,并没有实现关闭功能,因为关闭功能还需要引入相应的JS才可以。 下边我们来看实例代[详细]
-
IE6中a标签location.href失效解决方法
所属栏目:[经验] 日期:2018-10-06 热度:144
今天遇见IE6一个location.href的bug,具体情况是这样的,IE6下,在a标签中,将href写成javascript:;javascript:void(0);,并且给这个标签绑定onclick事件,点击后,执行location.href实现页面跳转,例如下面的代码: a href=javascitp:; onclick=toURL()点[详细]
-
CSS中各个浏览器兼容的解决办法
所属栏目:[经验] 日期:2018-10-06 热度:194
1. CSS中几种浏览器对不同关键字的支持,可进行浏览器兼容性重复定义 !important 可被FireFox和IE7识别 * 可被IE6、IE7识别 _ 可被IE6识别 *+ 可被IE7识别 区别IE6与FF: background:orange;*background:blue; 区别IE6与IE7: background:green !important;[详细]
-
html5给文本框实现email域名自动完成效果
所属栏目:[经验] 日期:2018-10-05 热度:180
产品反馈用户总是输错email的域名,因此服务器得到的email的地址是错误的。比如,有许多用户总将xxx@qq.com输入成xxx@qq.con。 这让后端很烦恼,因为这个email地址是合法的,但是错误也是那么明显的(常识判断,至于qq.con域名是否存在我也不知道)。 为了解[详细]
-
CSS3转换功能transform主要属性值分析及实现
所属栏目:[经验] 日期:2018-10-05 热度:69
css3的到来,让css技术进一步提高了,以前在css2不能实现的功能,现在都可以实现了,例如: 圆角,文字阴影,透明度,渐变,转换,过渡,动画等等。这些功能使用起来很方便。 今天我想介绍一下转换的用法: transform主要包括以下属性值: rotate(旋转度数)[详细]
-
CSS教程:scrollbar的属性及样式分类
所属栏目:[经验] 日期:2018-10-05 热度:96
1.overflow内容溢出时的设置(设定被设定对象是否显示滚动条) overflow-x水平方向内容溢出时的设置 overflow-y垂直方向内容溢出时的设置 以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。 2.scrollbar-3d-light-color立体滚动条亮边的颜[详细]
-
用CSS画三角形,纯CSS绘制三角形的代码
所属栏目:[经验] 日期:2018-10-05 热度:165
1、新建一个元素,随便什么元素,不过我习惯性的会用块元素来做。如果行内元素就display:block它。 div class=triangle/div 2、把它的宽高设置为height:0px; width:0px; 3、设置边框border属性,用来实现三角形。 首先要了解border具体是怎么样的,我写了[详细]
-
图片热区详解 与切片的优势比较
所属栏目:[经验] 日期:2018-10-03 热度:194
切片和图片热区是什么?图片切片是将很大的网页图片,切成类似拼图的那种形式,之后运用 HTML 代码,再完美的拼接起来的一种加快网页图片显示的手法,图片切片之后你还可以在不同的切片上加入链接等等,从而达到点击不同图片区域跳转到不同页面的效果。图[详细]
-
CSS 滤镜 -webkit-filter 的介绍和使用
所属栏目:[经验] 日期:2018-10-03 热度:144
大家可能对 Instagram 这款 iPhone APP 上的滤镜效果很感兴趣,其实 CSS3 开始也有滤镜(不是 IE 的那种滤镜),这些滤镜效果最初是用于 SVG 的,W3C 将其引入到 CSS3 中,然后制定了 CSS Filter Effects 1.0 的规范,Webkit 率先支持了它。 -webkit-filte[详细]
-
如何实现IE6下块级元素的内容自动收缩
所属栏目:[经验] 日期:2018-10-03 热度:170
近期在做提示层组件的开发,遇到了一个IE6常见的bug....想出了几个解决的办法,挺有意思的,这里分享给大家。 由于IE6浏览器中,display:inline-block只能触发IE的haslayout属性使得元素具有布局属性,当对div元素使用display:inline-block,div元素仍然为[详细]
-
display:inline-block下的IE元素
所属栏目:[经验] 日期:2018-10-03 热度:128
通常我们想让内联元素为行块布局显示,有2种方法,最常见的是方法是.selector {display:block;float:left;......},第二种方法是.selector {display:inline-block;......},对于第二种方法,在 IE浏览器 中得到支持,测试结果会认为IE能识别display:inline-[详细]
-
HTML5网页让所有浏览器都能识别HTML5标签样式
所属栏目:[经验] 日期:2018-10-03 热度:175
如今HTML5愈来愈引发大家的关注了,但目前支持HTML5的浏览器还不是主流,特别是国内用户近50%以上仍旧使用IE6,由于支持HTML5的 IE9 不支持Xp系统安装,这样未来很长一段时间,HTML5的开发者将必须考虑向下兼容的问题。HTML5的标签或CSS选择器兼容性的做法[详细]
-
关于HTML条件注释你可能不知道的一些事儿
所属栏目:[经验] 日期:2018-10-03 热度:171
最近经常看到类似这样的HTML代码片段,很多前端开发人员应该都熟悉: 1 !--[if lt IE 7] html class=ie6 ![endif]--2 !--[if IE 7] html class=ie7 ![endif]--3 !--[if IE 8] html class=ie8 ![endif]--4 !--[if gt IE 8]!-- html !--![endif]-- 这段代码[详细]
-
怎么调用iframe的父窗口的父窗口?
所属栏目:[经验] 日期:2018-09-30 热度:192
问题: 怎么调用iframe的父窗口的父窗口?做个AJAX上传图片 Copy to Clipboard 引用的内容:[www.veryhuo.com]iframe src=ajax_upimage.html name=iframeUpload1 width=350 height=80 frameborder=0 SCROLLING=no style=border:1px red solid/iframe ajax_u[详细]
-
纯CSS圆角框2:透明圆角化背景图片
所属栏目:[经验] 日期:2018-09-30 热度:175
在上面的案例中,我只给出最为原始的圆角框模型,它还是存在一些不足之处。比如不能将图片应用到圆角框内。而在本例中,我会在上面的基础上作出一些创新。就是将背景图片也圆角化,好像目前在网络上还没有这样的功能应用,我只见过用js方式来实现的,可以[详细]
-
纯CSS圆角框:基本的圆角框
所属栏目:[经验] 日期:2018-09-30 热度:141
序言:在我的文章《超圆滑圆角框的半完美解决方案》中已经总结了七种不同的圆角框解决方案,基本上总结完了目前网络上比较流行的圆角框实现方案。而在我的另一篇文章《无图片山顶角》中又是一个另类的实现方法。 纯CSS实现圆角框是一件大家都说烂了的事件[详细]
-
XHTML+CSS布局img图片元素出现空白的问题
所属栏目:[经验] 日期:2018-09-30 热度:157
在进行页面的XHTML+CSS排版时,遇到IE6(当然有时 Firefox 下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的,对于该问题的解决方法也是见机行事,根据原因的不同要用不同的解决方法,这里把解决直接把解决image图片布局下边的多余空隙的[详细]
-
CSS中英文无法自动换行的解决办法
所属栏目:[经验] 日期:2018-09-30 热度:151
问题: 在一个设定好宽度的div中,当我们输入的中文文字长度超过了设定宽度时,会自动换到下一行。但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致div的宽度远远超出设定的大[详细]
-
CSS Sprites:实用技巧,还是潜在危险?[译]
所属栏目:[经验] 日期:2018-09-30 热度:126
无处不在的CSS sprites是为数不多的几个可以绕过逐渐流行阶段,而直接让自己成为CSS最佳实践的Web设计技巧中的一个。尽管在A List Apart对它进行一个解释以及赞同认可这种方式之前,它还没有真正地流行。它最早是由Petr Stancek.在2003年7月提出来作为一个[详细]
