随笔分类 - div/css
摘要:Fiddler一个很强大的http流查看工具http://www.fiddlertool.com/fiddler/Httpwatch数据分析工具,头消息接受/发送的查看,POST数据查看.等等http://www.httpwatch.comIE Developer ToolsbarIE下的FireBug.HTML及CSS调试工具http://www.windowsmarketplace.com/d...
阅读全文
摘要:我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此。比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键误操作在未完成表单填写的时候就触发了表单提交。要控制这些行为,不需要借助JS,浏览器已经帮我们做了这些处理,这里总结几条规则:1、如果表单里有一个type=”submit”的按...
阅读全文
摘要:这贴比较长,没有耐性的朋友请直接拖到帖子末尾的代码示例,或者直接去玩我提供的Demo。Demo页面:主页面iframe_a.html,被包含页面iframe_b.htm和iframe_c.html下面开始讲:通过Google搜索iframe 自适应高度,结果5W多条,搜索iframe 高度自适应,结果2W多条。我翻了前面的几十条,刨去大量的转载,有那么三五篇是原创的。而这几篇原创里面,基本上只谈到...
阅读全文
摘要:基本上快被这个问题搞疯了,症状如下症状描述:在ie下(6或7,8没有试过)当出现中英文混排,都采用默认字体时,并使用 li 列表做float时,会出现如上图的症状,文字排列上下不对齐的情况。影响了布局的美观性,造成上图情况的原因是中英文的文字基线不同,arial字体的下边缘要比宋体(同为12号)低一个象素,上边缘比宋体矮两个象素,而且英文还有i,y这种上下基线不同的情况。所以当中英文混排对齐时,就...
阅读全文
摘要:在IE6下使用浮动可能会出现文字重复的情况.引发这种BUG有几个条件1.是注释引起的,删除所有注释即可.2.hidden的input直接放在form下.3.display为none的div也有可能引发此bug.2,3可以通过外面再包一次DIV解决
阅读全文
摘要:原文:http://ued.taobao.com/blog/2008/11/05/grid_system_research_4/前三篇文章中,明确了栅格系统的设计细节和适用范围。这一篇将集中讨论960栅格系统的技术实现。Blueprint的实现Blueprint是一个完整的CSS框架,栅格系统是它的一部分功能。我们来看demo页面:以上三栏布局的代码为:上面是基本功能,Blueprint还支持ap...
阅读全文
摘要:原文:http://ued.taobao.com/blog/2008/10/28/grid_system_research_3/研究(2)中讨论了栅格系统的基础知识。这一篇将集中探讨栅格系统的粒度问题。(注:如非特别指明,栅格系统均指24列960栅格系统)淘宝的首页(截图)目前尚未严格遵守栅格系统,如果重构的话,宽度方向可以考虑采用下面的栅格布局(只考虑页面主体部分,忽略高度的比例):(图1)纷乱...
阅读全文
摘要:原文:http://ued.taobao.com/blog/2008/10/22/grid_system_research_2/首先澄清一个应用场景问题。研究(1)中指出,对于结构复杂的网站,不少设计师们喜欢采用960固定宽度布局。但要注意的是,960并不是万能钥匙,大部分网站没有也不需要栅格系统。Amazon采用的是宽度自适应布局,最大限度的呈现信息。Google更是简简单单,主题部分就一个列表...
阅读全文
摘要:原文:http://ued.taobao.com/blog/2007/01/24/css_float_banner/CSS部分:*{margin:0;padding:0;}* html{height:100%;overflow-y:hidden;}* html body{height:100%;overflow-y:auto;}#TargetTOP{position:fixed;bottom:10...
阅读全文
摘要:原文地址:http://ued.taobao.com/blog/2008/01/09/css-notes-6-css-framework/个人总结了在开发css框架中的一点经验,献丑了。希望大家的讨论能使我们共同进步。:)1、css框架中国的互联网行业已经发展了10年,浏览器也从最早流行的NS到现在的FF3.IE7等等……前端开发工程师的职位也诞生了。近几年在web开发...
阅读全文
摘要:原理css盒模型一个盒子包括: margin+border+padding+content– 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三角, 小梯形等.– 调整宽度大小可以调节三角形形状.示例1一般情况下, 我们设置盒子的宽高度, 及上下左右边框, 会呈现如下图示例2在上面基础上, 我们把宽高度都设为0时, 会呈...
阅读全文