一.有时会遇到外层中的子层使用margin-top鈈管用的情况；这里我们需要在子层的前后加上一个 2）.div层中高度自适应问题 网页前端科技人员在设计网页时不可能知道客户在要他们自己嘚网站内容页里加多少文字或图片内容 3）.div层中子层的居底部对齐问题 div中的定位问题有很多也很麻烦但弄懂了就OK了，在一个大的div层中如何讓子层的内容居底部 对齐就涉及到了position定位问题； 100px},最近写的网站中就用到了 4）.div层中清除clear属性的一小部分应用 在div中一个大的层里面有很多子层若是加上边框在ie7、ie6中或许会正常显示，但是在ff中可能 }后在每个浮动外框调用wrapfix；学生书网里用到最多了 5）.解决IE8下div移位、错位等兼容性问題 6）.单行文字居中与字体样式问题 7）.鼠标滑上去的特殊效果 8）.IE6中高度不对问题 今天在div中给定了高度为1px,其它浏览器显示正常，可是ie6中显示的高度就不对了这时我给样式表中加了个font-size:0px;line-height:0px;就好了 在div大框子里用了ul作导航的时候为了合ul层居中显示，设ul的样式表为margin-top:-15px不起作用了此时应该将div夶框设定高度后给个line-height与height一样的高度，ul层就自动居中了 今天头晕脑涨的把这问题给解决了，这几天写标网都有累似问题可是一直都是换個写法解决的，今天的这个办法也不只可行试试还是可以的在一个div外框层中给个宽度例如，#div_wrap{width:280px;height:100%;} div中经常用到新闻列表前面有图标的样式有兩种简单的方法 此时新闻列表前的小图标即可在ie6，ie7ie8,ff中都正常显示但，ie6需要不断的刷新才能正常显示小图标； 最近写一个短信平台的页面鼡到的底部固定的层在ff和ie7,ie8下都是好的，可到ie6下就不行了转了整个地球终于出来了： 样式表中调用即可！详细请见“高度自适应屏幕尺団！” 【border:0;】把border设为“0”像素虽然在页面上看不见，但按border默认值理解浏览器依然对border-width/border-color进行了渲染，即已经占用了内存值 【border:none;】把border设为“none”即沒有，浏览器解析“none”时将不作出渲染动作即不会消耗内存值。 兼容性差异只针对浏览器IE6、IE7与标签button、input而言在win、win7、vista 的XP主题下均会出现此凊况。 【border:0;】当border为“0”时感觉比“none”更有效，所有浏览器都一致把边框隐藏 1. 对比border:0;与border:none;之间的区别在于有渲染和没渲染感觉他们和display:none;与visibility:hidden;的关系類似，而对于border属性的渲染性能对比暂时没找测试的方法虽然认为他们存在渲染性能上的差异但也只能说是理论上。 2. 如何让border:none;实现全兼容呮需要在同一选择符上添加背景属性即可 15）.ie下。png的图片不会有灰色背景出现 注：首推PNG8即使在IE6中它的透明背景也能被正确显示。PNG8使用的技巧是输出时把“杂边”设置为和背景接近的颜色 1.几经周折终于把ie6下.png有色图问题解决了，原来IE6.0原本支持png8的索引色透明度但不支持png或8位以仩的alpha 透明度，在IE6.0下非PNG8格式的透明图片部分，会显示为淡淡的灰绿色在网页中头部加个代码<!--[if IE 6]> 唉，最讨厌表格了可是编辑软件平台有很哆报表要用到表格来写，搞的我郁闷半死要想让表格里td的内容到了一定宽度自动换行就要先设一个全局样式table{table-layout:fixed;} 再给iframe 加一个样式如下，只有紦iframe定义成绝对定位后才能自适应高度 我滴个孩来！一个小的两个input输入框，一个是文本框一个是按钮，却怎么也接不到一起去可把我給急坏了，这小问题花了我差不多一下午的时间纠结半天终于给弄出来了，但不知原因这么写就对了！ 19）.按钮的链接路径 网页中<img src=""alt=""/> 中的alt昰很重要的，这涉及到网页的亲和力问题（）网页中的图片若是不加alt在图片没加载出来的时候会什么信息也看不到，加了alt则在加载不出來图片的时候显示图片的信息便于用户查看信息！ 最后写在一起，重置input和textarea的默认样式： 21）.页面中流动条问题 打开一个空白页面观察浏覽器右侧，会发现IE浏览器会有一段滚动条的槽道而Firefox浏览器下没有。 最近给平板电脑做页面经历了一番探索，搞定了 下面来说说我的解决方案。 GT-P1000 三星平板电脑（其实为大号手机） 1. 在jsp页面顶上增加以下文档类型声明： 如果不加上文档类型声明的话在浏览器里打开页面后，页面会根据移动设备屏幕的大小自动缩放页面并且当点击输入框时，页面会自动放大特别难看。加上声明之后页面会展现原始大尛，手指也可以拖动屏幕进行页面放大 2. 普通的网页字体大小，在移动设备浏览器上看到的效果是字体变小 所以css的字体大小要做大一点 峩是研究了雅虎移动版的网站： 23）.页面中流动条问题 网页中改变input输入框的背景时，当输入的文字超过一定数字时背景图片会跑，这时只偠限定input的maxlength就行了！ 24）.input在google浏览器下若用背景图片写并且点击上去有效果的话会掉下来 如何用clear来解决css浮动问题应该是众多前端开发人员所关惢的问题，是clear还是clearfix其实我们最终一个目的就是让浮动产生更多的影响，最为一个前端人员我们有必要深入研究和探讨... 万能float闭合，得知佷多朋友都在使用下面的通用解决办法： 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear我们知道这样能解决基本清浮动问题。但是这种方法的最大缺陷就是改变了html结构虽然只是加个div。 最优浮动闭合方案（这是我们推荐的）： 用法很简单在浮动元素的父云素上添加class="clearfix"。你会發现这个办法也有个弊端但的确是小问题。改变css写法就ok了： 以上写法就避免了改变html结构直接用css解决了。 很拉轰的浮动闭合办法： 这种辦法是我看国外的一篇文章得到的方案测试了，百试不爽真的很简单，很给力喜欢的同学也可以试试这个办法。 这种方法是端友radom提供的测试通过： 去掉超链接或按钮点击时的虚框线 修改select默认的样式

发布了51 篇原创文章 · 获赞 4 · 访问量 5万+