css解决方案
iteye_2245
这个作者很懒,什么都没留下…
展开
-
css问题解决方案之table中td内容换行
css问题解决方案之table中td内容换行 1.设置表格的宽度为100%2.设置表格的样式中的table-layout:fixed3.设置td的word-wrap:break-word2011-12-14 17:46:53 · 264 阅读 · 0 评论 -
关于去掉a标签点击后的虚框的解决方案
我们时常在一些场景遇到a标签点击后需要去掉虚线框,这边我们给出一个解决方案: 1、首先来兼容IE //增加hidefocus的属性<a hidefocus id="test"></a> 2、非IE的设置: a{outline:0 none;}...2012-06-23 16:54:20 · 314 阅读 · 0 评论 -
IE下页面变灰
应用场景:IE下站内页面变灰! 代码: html{ filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);} 原理: grayscale的值有两个: 1 ----- 灰度效果0 ----- 默认值,原始色彩 ...原创 2013-01-07 11:01:40 · 1701 阅读 · 0 评论 -
IE下的图片翻转90度倍数的case
场景:IE下对图片进行*90度的旋转 代码: <img alt="logo" src="../logo.png" id="image" style="filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);"/> 原理: rotation的几个值: 0 ...原创 2013-01-07 11:11:21 · 160 阅读 · 0 评论 -
设置type="range"为vertical
如何设置type=“range”为vertical? 默认是horizontal的 -webkit-appearance:slider-vertical; 扩展阅读: http://swatelier.info/at/forms/range.asp http://stackoverflow.com/questions/500...原创 2013-02-21 16:56:04 · 311 阅读 · 0 评论 -
css解决方案之--- 模拟textarea高度自适应
本文来自zhangxinxu的博客:《div模拟textarea文本域轻松实现高度自适应》 个人做积累学习用,感谢作者! 首先,我也去web.qq.com调研了一下: <div id="content" contenteditable="true"></div> 下面就是css: min-...原创 2013-03-11 19:40:02 · 126 阅读 · 0 评论 -
关于初始加载页面的动画震动
本文主要来自:http://css-tricks.com/transitions-only-after-page-load/ 问题: 对于页面上结构化元素,当页面加载、绘制布局的时候,动画会触发。 解决方案: 给body元素增加一个class<body class="preload">...原创 2013-03-22 18:20:51 · 100 阅读 · 0 评论 -
QR二维码相关
前言: 本文主要整理采用Google chart来生成QR二维码相关 正文: 内容参考来自:https://google-developers.appspot.com/chart/infographics/docs/qr_codes google chart服务: 根路径: https://chart.googleapi...2013-03-25 14:36:41 · 116 阅读 · 0 评论 -
css3案例之---采用rgba实现背景透明内容不透明
前言: 部分内容来自doy的博客:《CSS3 RGBA不是简单的RGB与opacity相加》,感谢作者! 个人做积累学习用 正文: 前面我也有一篇简单整理过rgba,如果不熟悉的可以看看那个。 我们来看下面这个例子: <div id="up-wrap"> 我是上面这层的文字...原创 2013-03-28 17:44:28 · 306 阅读 · 0 评论 -
IE6下模拟fixed在scroll的时候有闪动
IE6下,我们模拟fixed的时候会出现一种情况: -------- 当滚动页面的时候,会有震动的现象! 解决方案: html,html body{ _background-image:url('about:blank'); _background-attachment:fixed;} ...原创 2013-04-01 18:13:58 · 116 阅读 · 0 评论 -
-ms-filter
本文简单记录一下-ms-filter 部分内容来自:http://msdn.microsoft.com/library/ms530752.aspx 例子:http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/filter_8.htm 结论:...原创 2013-04-01 18:14:17 · 829 阅读 · 0 评论 -
IE下的采用filter进行翻转
本文简单记录一下:IE下使用filter来进行翻转: 水平翻转 html{ filter:FlipH; //水平翻转} 垂直翻转 html{ filter:FlipV; //垂直翻转} ...原创 2013-04-01 19:09:22 · 202 阅读 · 0 评论 -
如果画圆角图片效果
原效果在 http://smashingconf.com/ 主要的点: <li> <a class="image-link" href="http://smashingconf.com/speakers/lea-verou"> <img src="http://smashingconf.c...2013-10-18 16:19:12 · 81 阅读 · 0 评论 -
css框架简介之YAML
前言: 本文只是开篇,简单介绍一下,后期深入实践认知。前面也简单介绍过bootstrap,YUI CSS等,YAML还是有自我的一些特点,比如有非常优秀的文档! 正文: 1、YAML是什么? -------------------- Yet Another Multicolumn Layout 另一种多栏布局 用作者的注释: ...原创 2012-10-15 16:47:20 · 249 阅读 · 0 评论 -
浅谈:-moz-placeholder
本文是个人记录,来自zhangyaochu.iteye.com :-moz-placeholder represents any form element displaying placeholder text.This allows web developers and theme desgners to customize the appearance of...2012-02-06 10:13:14 · 669 阅读 · 0 评论 -
关于IE7下select的高度设置问题
1、IE7下select的高度不能通过设置height? 可以设置font-size来解决这个问题。 select{ height:28px; *margin-top:4px; line-height:28px;}2012-02-08 11:27:50 · 298 阅读 · 0 评论 -
去除button的虚线框
有的时候为了去掉Button的虚线框,而且兼容各大浏览器,并且排除到type=text button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inne...2012-02-10 10:33:35 · 422 阅读 · 0 评论 -
关于X-UA-Compatible
1、what is X-UA-Compatible ? 是针对IE8的一个设置,只有IE8能识别,为IE8指定不同的页面渲染模式。 2、常见的值: <meta http-equiv="X-UA-Compatible" content="IE=7" /> ------- 无论页面是否包含<!DOCTYPE>指...2012-07-07 16:28:13 · 198 阅读 · 0 评论 -
清除浮动的一种方式
贴一个自己用的比较多的清除浮动的代码: .clearfix:after{content:'.';display:block;height:0;clear:both;visibility:hidden;}.clearfix{display:inline-block;}* html .clearfix {height: 1%;} .clearfix {display: blo...2012-04-05 14:38:47 · 79 阅读 · 0 评论 -
关于reset.css的一些思考与探究
项目多了,大家多会有自己积累的一些reset.css的经历或者自己改进的代码,其实初衷还是很简单的,达到复用,重置浏览器的一些默认样式,实现跨浏览器兼容。 1、最早关注的还是YUI的Reset CSS, 在线的压缩版本地址:http://yui.yahooapis.com/3.4.1/build/cssreset/cssreset-min.css 直接上代码吧: ...2012-04-08 16:16:50 · 133 阅读 · 0 评论 -
IE7下图片缩放失真fix
此篇主要是介绍ie7下图片被拉伸导致的锯齿 解决方法: 增加这个样式规则 -ms-interpolation-mode: bicubic 语法: -ms-interpolation-mode nearest-neighbor ------ use nearest neighbor interpolation modebi...2012-04-16 16:26:39 · 98 阅读 · 0 评论 -
介绍一下normalize.css
前面写过一篇关于reset.css的一些思考与探究 这篇主要是介绍一下 normalize.css ----- A modern,HTML5-ready alternative to CSS resets 下面部分内容来源于http://necolas.github.com/normalize.css/ 本人简单地做一些简单的翻译工作:...2012-04-17 10:28:24 · 220 阅读 · 0 评论 -
关于页面跨平台字体样式探究
前面写了一篇“Mac下的字体”,去各大网站关注了一下css代码,下面是QQ空间的处理方式,记录下来。 .os_winXp{font-family:Tahoma}.os_mac{font-family:"Helvetica Neue",Helvetica,"Hiragino Sans GB",Arial}.os_vista,.os_win7{font-family:"Micro...原创 2012-07-29 18:28:11 · 193 阅读 · 0 评论 -
整理部分IE hack
前面也简单地写过一篇简单整理IE的hack,但是那篇只是简单地区分了一下IE6|7|8 这篇开始主要加入IE各个版本一些问题的处理: 1、IE 8: 单独IE8识别的:在规则的值后面加上\0/ .test{ background:#fff\0/;} th不会自动 继承上级元素的text-align ...原创 2012-05-19 19:25:35 · 84 阅读 · 0 评论 -
IE6下div的高度设置小于12px的情况
我们在IE6下如果设置一个div的高度小于12px的话,IE6会显示12px. #element{ background: yellow; border: 1px solid red; width: 300px; height: 4px; margin: 30px 0; } 效果图: 解决方案: 加上...2012-05-19 21:24:38 · 97 阅读 · 0 评论 -
触发hasLayout
触发hasLayout: position:absolutefloat:left|rightdisplay:inline-blockwidth:非autoheight:非autozoom:非normal原创 2013-04-11 14:39:03 · 119 阅读 · 0 评论