摘要：
网站变色，用css3和用的Microsoft的滤镜方法<style type="text/css">body{ -webkit-filter:grayscale(100%); -moz-filter:grayscale(100%); -ms-filter:grayscale(100%); -o-filter:grayscale(100%); filter:grayscale(100%); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); filter:gray;}</st.. 阅读全文
随笔分类 - css
形状的CSS 2.0
2012-04-11 17:53 by NEVERGIVEUP-, 157 阅读, 收藏,
摘要：
以下只使用一个单一的HTML元素。任何种类的CSS，只要它至少在一个浏览器支持。三角形向上#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red;}三角形向下#triangle-down { width: 0; height: 0; border-left: 50px solid transparent; borde... 阅读全文
CSS z-index 属性的使用方法和层级树的概念
2012-03-07 23:14 by NEVERGIVEUP-, 200 阅读, 收藏,
摘要：
CSS中的z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面, 这是我们对 z-index 属性普遍的认识. 与此同时, 我们总是对堆叠顺序捉摸不透, 将 z-index 的值设得很大也未必能将节点显示在最前面. 本文将通过一些例子对 z-index 的使用方法进行分析, 并且为各位带入 z-index层级树的概念.这个星期我们团队做了一次内部的技术分享,南瓜小米粥为我们分享了他对 CSS z-index 的理解和引入层级树这个概念. 这个分享的现场效果很好, 所以我也将 z-index 和层级树话题搬到博客来谈一谈.本文谈及多个影响节点显示层级 阅读全文
IE6 PNG不透明问题
2011-12-12 14:05 by NEVERGIVEUP-, 233 阅读, 收藏,
摘要：
方案1 - 滤镜解决方案：介绍：滤镜从IE4.0被微软正式引入，所以我们可以使用滤镜解决IE6的PNG透明问题，滤镜不仅可以实现目前CSS3的一些旋转效果而且还可以引入图片。注意：此方法在部分版本的IETest中无效，建议使用标准的IE6来进行测试！目录说明：思路： 1、书写正常的CSS代码，通过background导入图片，这样所有的浏览器均使用了此PNG图片； background:url(../images/W3CfunsLogo.png); 2、通过滤镜对引入图片，滤镜引入图片的时候是相对于HTML文件，而不是相对于CSS文件，语法如下： filter:progid:D... 阅读全文
使用谷歌浏览器模拟手机浏览器
2011-12-05 10:12 by NEVERGIVEUP-, 461 阅读, 收藏,
摘要：
说明：谷歌Chrome浏览器，可以很方便地用来当3G手机模拟器。在Windows的【开始】->【运行】中输入以下命令来启动谷歌浏览器，即可模拟相应手机的浏览器去访问3G手机网页，执行命令前要关掉所有Google Chrome窗口哦～操作：模拟谷歌Android：chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1& 阅读全文
css 清除浮动方法
2011-11-28 11:34 by NEVERGIVEUP-, 151 阅读, 收藏,
摘要：
1.使用空标签清除浮动<style type="text/css">.clear{clear:both;font-size:0px;height:0px;line-height:0px;overflow:hidden;} </style><div style="background:blue;"> <div style="float:left;width:400px;height:300px;background:red;">red</div> <div style=& 阅读全文
图片比例缩小图片css
2011-11-28 11:12 by NEVERGIVEUP-, 167 阅读, 收藏,
摘要：
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>图片比例缩小图片css</title></head><body><style type="text/css">img{max-width:300px;width:expression(document.body.clientW 阅读全文
图片垂直水平居中 支持IE6、IE7、IE8、FF等
2011-11-10 10:15 by NEVERGIVEUP-, 470 阅读, 收藏,
摘要：
最近做购物网制作方式,商品图片要垂直水平居中第一种css里面View Code第二种css里面View Code第三种View Code第四种View Code 阅读全文
浙公网安备 33010602011771号