css深入挖掘
xj_li
记录、分享、成长~~
展开
-
为什么给行内块级元素inline-block添加margin-top为负值的时候不起作用?
一个盒子为行内块级元素,即 display:inline-block; 给该元素添加margin-top:-10px;负值不起作用,这是为什么呢?解决办法(我使用的最多):1.给该盒子的父级添加属性:font-size:0;(这个方法比较简单,但是也有一些问题,会影响到子元素的字体大小)这个方法同样适用于取消inline-block盒子之间的空隙的问题同时总结一下i原创 2016-05-24 13:57:52 · 1883 阅读 · 0 评论 -
图片铺满整个浏览器,兼容ie8的写法
.bg-ie8 { display:none;display /*\**/:inline\9 ;z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}原创 2016-05-24 14:35:47 · 997 阅读 · 0 评论 -
如何做像百度图片那样,图片大小无规则的排版?
3 解决方法(具体下面会有图示)①确定一个变量。由于当前的浏览器宽度是固定的,因此可以根据浏览器宽度范围制定一个标准高度,类似CSS的媒体查询(media query);②初次变换。所有图片宽度根据这个标准高度作宽度的等比例缩放;③创造容器。每行建立一个div,并装入尽可能多的图片,直到容器装不下;④第一步调整。每行根据自己与目标宽度(当前浏览器宽度)的差值,再等比转载 2016-05-24 14:48:32 · 1291 阅读 · 0 评论 -
css中网页图片下方多出几像素问题分析
css中网页图片下方多出几像素问题分析网页的图片下方会多出来 3 ~ 5 个像素,无论那个浏览器都是这样的。其实 img 属于 inline 元素,inline 因为受到字号和行间距的影响底部留出了一段距离,距离与字体大小有关,为了解决字母占位不同所导致的问题,那解决办法就很多了,比如:img { display: block;}或者:.box转载 2016-05-24 16:58:00 · 1118 阅读 · 0 评论 -
常用的CSS Hack技术集锦
常用的CSS Hack技术集锦一、什么是CSS Hack?不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题。而这个针对不同的浏览器写不同的CSS 代码的过程,就叫CSS Hack。CSS Hack常见的有三种形式:CSS属性Hack、CSS选择符Hack以及IE条件注释Hack, Ha转载 2016-05-27 13:31:20 · 532 阅读 · 0 评论