做响应式布局的时候，如果有背景图，我们当然希望他能够全屏100%显示，这样显得页面非常的爆满，不过这又出现了一个问题，图片的尺寸多大合适呢，现在的浏览器分辨率参差不齐，对于Firefox等高级的浏览器，使用Background-size设置为100%即可，而IE浏览器就需要不同设置。 在Firefo ...
分类：
Web程序 时间：
2017-09-26 17:50:00
阅读次数：
219
<script>var w = $(window).width();//获取窗口宽度var h = $(window).height();//获取窗口高度 $(".box").width(w);//赋值给图片外包$(".box").height(h); function carousel(){ va ...
分类：
Web程序 时间：
2017-09-24 20:18:26
阅读次数：
442
1、图片不够大，又background属性不能拉伸图片； 2、只能用个div，把其z-index值设为负，并使这个div大小为整个body大小，在div里用<img> 3、body的background属性去掉，要不然会被遮住 例子： <!DOCTYPE html PUBLIC "-//W3C//D ...
分类：
Web程序 时间：
2017-09-21 16:40:06
阅读次数：
301
随着终端设备的日益丰富，无法针对设备类型、尺寸或浏览器进行自适应调整的图像会严重减慢网站的访问速度，最终导致用户流失。谈到图片自适应，很多前端开发人员会不假思索的来一句“宽度100%”，就是这么一行简短的代码！部分前端开发者认为这行代码既简洁又高效，很好地解决了图片自适应问题，但有部分前端开发者认为... ...
分类：
其他好文 时间：
2017-09-17 17:28:43
阅读次数：
130
一、CSS百分比padding都是相对宽度计算的 在默认的水平文档流方向下，CSS margin和padding属性的垂直方向的百分比值都是相对于宽度计算的，这个和top, bottom等属性的百分比值不一样。 这么设计的原因在我的新书（应该不出几个月就要出版了）中会有说明，这里不展开。 对于pad ...
分类：
Web程序 时间：
2017-09-10 16:38:08
阅读次数：
231
<div style="background-image: url(http://your-image.jpg);"> <img src="http://your-image.jpg" style="opacity:0;" /></div> 用图片去占位，把div高度撑开就可以显示背景图片 同时改变 ...
分类：
其他好文 时间：
2017-09-07 19:40:30
阅读次数：
130
我之前写九宫格自适应布局的时候，每个格子是使用媒体查询器（@media）或者js动态设置css，根据不同的手机屏幕宽度，适配不同手机，但是这样有个很大的缺点，那就是移动端的屏幕尺寸太多了，就得写很多代码，才能实现我们想要的效果。 今天突发奇想，使用了纯css实现了我想要的效果，下面就和大家来分享，上 ...
分类：
Web程序 时间：
2017-08-21 20:34:37
阅读次数：
340
<div style="width:360px;height:200px;border:red 1px solid; margin-left:100px; margin-top:300px; position:relative; "><img style="position:absolute;lef ...
分类：
其他好文 时间：
2017-08-08 17:53:37
阅读次数：
109
效果图例如以下： 功能：使图片自适应居中位于容器内 限制：容器须要给定大小 用法： 1、引入jQuery。然后引入fitimg插件 2、给须要图片自适应的容器固定宽高 3、header .account .img { width: 40px; height: 40px; margin: 5px 5p ...
分类：
Web程序 时间：
2017-08-06 12:34:55
阅读次数：
149
1、 3、缩放工具：工具栏上放大镜图标：<1>上面图标栏可以选择激活放大还是缩小。<2>按住alt键可以切换，可以点击，也可以滚动滚轮<3>ctrl加"+"放大，ctrl加"-"缩小4、适应屏幕：（1）ctrl加0,全部显示图片；ctrl加1，100%视图（2）双击抓手图标，图片自适应屏幕；双击放大 ...
分类：
其他好文 时间：
2017-07-08 20:21:26
阅读次数：
180
