GoodShot的专栏

float position的测试案例

.closeImg{ cursor:pointer; position:absolute; right:9px; right:0px\9;//这是ie的样式 bottom:55px; display:none } @media screen and (-webkit-min-device-pixel-ratio:0){.closeImg{right:0px;} }

css的兼容性一般都是前端初学者面临的一个头疼的问题，难免写出来的css在各个浏览器下的效果均有不同，于是乎各种css hack写法出来了，其实在一个规范的项目开发中，css hack都是提倡能不用则尽量不用，因为产生兼容性问题的时候很多情况是写法不规范引起的，但也确实存在一些浏览器本身的bug，特别是万恶的IE。　　小知识：什么是CSS hack？　　由于不同的浏览器，比如IE6

当构建页面排版时，有不同的方法可以使用。使用哪一种方法取决于具体页面的排版要求，在不同的情况下，某些方法可能好过于其他的方法。比如，可以使用若干个浮动元素来构建一个整洁简洁的页面排版。或者，如果需要更复杂的排版要求，可以考略使用其他方法，比如使用相对定位和绝对定位。在这篇文章中，我们首先要讨论元素浮动；然后，我们要讨论如何使用x,y和z轴控制元素的位置。 元素浮动当构建一个页面的排版时，使用元素浮

做前端多年，虽然不是经常需要hack，但是我们经常会遇到各浏览器表现不一致的情况。基于此，某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的，要知道一名好的前端，要尽可能不使用hack的情况下实现需求，做到较好的用户体验。可是啊，现实太残酷，浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协，虽然这只是个别情况。今天，结合自己的经

在浏览器兼容性问题解决方法，已在IE、FF、Chrome测试中，已经对关于CSS的一些兼容性问题进行了总结，后来自己又整理了一些关于JS的兼容性问题，现在分享给大家。1）ChildNodes问题：    IE7、IE8正常，IE9、IE10、chrome、FF的 childNodes 中会插入空白文本节点解决：    可以通过document.getElem

一些内容比之前为了方便自己查询，省得每次遇到问题都要满世界搜，转篇实用的：DIV+CSS 与不同 IE 版本等的兼容性。一、!important (功能有限)随着 IE7 对 !important 的支持， !important 方法现在只针对 IE6 的兼容。（注意写法，记得该声明位置需要提前。）例如：#example {width: 100px !important; /*

类选择器允许以一种独立于文档元素的方式来指定样式。CSS 类选择器类选择器允许以一种独立于文档元素的方式来指定样式。该选择器可以单独使用，也可以与其他元素结合使用。提示：只有适当地标记文档后，才能使用这些选择器，所以使用这两种选择器通常需要先做一些构想和计划。要应用样式而不考虑具体设计的元素，最常用的方法就是使用类选择器。修改 HTML 代码在使用类选择器之前，

在浏览器兼容之JavaScript篇——已在IE、FF、Chrome测试和浏览器兼容性问题解决方法，已在IE、FF、Chrome测试中已经对浏览器中存在的CSS的兼容性和JS的兼容性进行了简单说明，现在继续对浏览器中存在的CSS的兼容性问题进行简单说明。1）列表不能换行的问题问题：        li设置为浮动，后面的li紧随其后，不能换行解决：

part1 —— 浏览器测试仪器，测试您现在使用的浏览器类型IE6 IE7 IE8 Firefox Opera Safari (Chrome) IE6 IE7 IE8 Firefox Opera Safari (

网页制作中规范使用DIV+CSS命名规则，可以改善优化功效特别是团队合作时候可以提供合作制作效率，具体DIV CSS命名规则CSS命名大全内容篇。常用DIV+CSS命名大全集合，即CSS命名规则DIV CSS命名目录命名规则说明重要CSS命名CSS命名参考表命名技巧我们开发CSS+DIV网页（Xhtml）时候,比较困惑和纠结的事就是CSS命名