【gulp-css-spriter 雪碧图合并】教程文章相关的互联网学习教程文章

CSS(html)背景图优化合并深入探讨

图片本身的优化: 图像质量要求和图像文件大小决定你用什么格式的图片,用较小的图片文件呈现较好的图像质量。 当图片色彩过于丰富且无透明要求时,建议采用jpg格式并保存为较高质量。 当图片色彩过于丰富又有透明或半透明要求或阴影效果时,建议采用png24格式,并对IE6进行png8退化(或在不得已情况下使用滤镜)。 当图片色彩不太丰富时无论有无透明要求,请采用png8格式,大多数情况下建议采用这种格式。 当图片有动画时,只能使...

gulp-css-spriter 雪碧图合并【代码】

相信做前端的同学都做过这样的事情,为优化图片,减少请求会把拿到切好的图标图片,通过ps(或者其他工具)把图片合并到一张图里面,再通过css定位把对于的样式写出来引用的html里面。gulp-css-spriter 让这一切别的更简单了。本文只介绍gulp-css-spriter的使用,其它相关文章请自行Google了解^_^。  第一步: npm install gulp-css-spriter第二步:(主要就看三行代码即可,注意:合并之前的html页面里面的标签宽高必须要和背景图宽...

PHP根据传入参数合并多个JS和CSS文件的简单实现

HTML(使用方法):复制代码代码如下:<link rel="stylesheet" type="text/css" href="cssmin.php?get=base,style1,style2,global&path=css/&v=20131023" /><script type="text/javascript" src="jsmin.php?get=jquery-1.6.4.min.js,minjquery.js,minjquery.ui.js,test.js,global.js&path=js/&v=20131023"></script>PHP:复制代码代码如下://输出JSheader ("Content-type:application/x-javascript; Charset: utf-8");if(isset($_GE...

ASP.NET MVC4细嚼慢咽---(5)js css文件合并

MVC4增加了一些新功能,接下来,我们来研究下MVC4中的新增功能,我们在新建一个MVC4项目的时候,会发现在项目下多出了一个App_Start文件夹,文件夹下面有4个文件,BundleConfig.cs,FilterConfig.cs,RouteConfig.cs,WebApiConfig.cs,其中BundleConfig.cs文件就是我们这一节要讲的的文件。 众所周知,浏览器在向服务器发送请求的时候,请求的文件连接数量是有限制的。使用BundleConfig可以将多个文件请求和并成一个请求...

CSS Sprite小图片自动合并工具【代码】

css-sprite是将css样式中零星的小图标,小图片合并成大图显示,这样能减小服务器并发连接数,减小服务器负载和带宽使用,有很高的实用价值。这里介绍一些自动合并图片并生成样式的工具。NodeJS css-spritecss-sprite是一个基于NodeJS实现的css切图自动合并工具,能自动将小图片合成大图,支持retina sprites和base64输出格式。注* retina sprites视网膜屏幕指的是接近人眼能够直观感受到的基础色素级别的输出格式。Base64是将图片转...

ASP.Net一键自动化更新代码、编译、合并dll、压缩js、css、混淆dll、zip打包、发布到测试环境的bat批处理【代码】

不废话,直接代码:D: cd D:\src\testproj\PrecompiledWeb svn revert ../ -R svn update ..rmdir BS /S /Q C:\Windows\Microsoft.NET\Framework64\v4.0.30319\MSBuild.exe ..\testproj.sln /p:DeployOnBuild=true /p:PublishProfile=..\BS\App_Data\PublishProfiles\publish.pubxml /m "C:\Program Files (x86)\Microsoft SDKs\Windows\v10.0A\bin\NETFX 4.6 Tools\aspnet_merge.exe" .\BS -o Site -a -rdel BS\bin\*.pdbcd .. n...

使用Tengine concat模块合并多个CSS,JS 请求【代码】【图】

用淘宝改良的Nginx(Tengine)提供web服务 今天在本博客上顺利把Nginx换成了Tengine;并启用了动态加载模块 mod_concat,对本博客使用的知更鸟主题各个页面head模板中大量调用的多个CSS,JSS请求进行了合并,即客户端浏览器只需通过一次http请求,即可从服务器返回所需要的多个CSS,JS文件;下面是配置步骤: 编译安装Tengine 1,停止web服务,备份原来的Nginx目录(我是lnmp一键安装的,所以直接备份/usr/local/nginx目录即可) ser...

把JS和CSS合并到1个文件

合并JS文件和CSS文件很多人都知道,也用过,目的是为了减少请求数。但有时候我们觉的把JS合并到1个文件,CSS又合并到另外1个文件也是浪费,我们如何能把CSS和JS一起合并进1个文件了?这里需要使用1个常见的注释符<!-- 主要是利用css,js解析器对<!-- 进行不同的解析来实现JS和CSS合并的。 1. CSS解析器 会忽略<!--符号, 2. JS解析器会把<!--当作注释符号,与// 注释相同。看看下面的列子: <HEAD> <TITLE>test</TITLE> ...

CSS外边距合并(塌陷/margin越界)【代码】【图】

原文  简书原文:https://www.jianshu.com/p/5f18f12cd162大纲  1、什么是外边距合并?(折叠外边距)  2、外边距带来的影响  3、折叠的结果  4、产生折叠的原因  5、出现的情况1、什么是外边距合并?(折叠外边距)  外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。而左右外边距不合并。  在CSS当中,相邻的两个盒子(可能是兄弟关...

grunt-css-sprite css 代码中的切片合并【代码】

安装插件:npm install grunt-css-sprite --save-devgrunt-css-sprite主要功能:1.对 css 文件进行处理,收集切片序列,生成雪碧图2.在原css代码中为切片添加background-position属性3.生成用于高清设备的高清雪碧图,并在css文件末尾追加媒体查询代码4.生成高清设备雪碧图,使用 image-set5.支持选择器提取,进一步优化CSS文件大小6.在引用雪碧图的位置打上时间戳7.在样式末尾追加时间戳8.按照时间戳命名文件 配置说明:imagepath必...

高性能WEB开发JS、CSS的合并、压缩、缓存管理【图】

存在的问题: 合并、压缩文件主要有2方面的问题: 1. 每次发布的时候需要运行一下自己写的bat文件或者其他程序把文件按照自己的配置合并和压缩。 2. 因生产环境和开发环境需要加载的文件不一样,生产环境为了需要加载合并、压缩后的文件,而开发环境为了修改、调试方便,需要加载非合并、压缩的文件,所以我们常常需要在JSP中类似与下面的判断代码:<c:if test="${env==prod}"> <script type="text/javascript" src="/js/all.js">...

PHP根据传入参数合并多个JS和CSS文件的简单实现_PHP教程

HTML(使用方法): 代码如下:PHP: 代码如下://输出JSheader ("Content-type:application/x-javascript; Charset: utf-8");if(isset($_GET)) { $files = explode(",", $_GET['get']); $str = ''; foreach ($files as $key => $val){ $str .= file_get_contents($_GET['path'].$val); }$str = str_replace("\t", "", $str); //清除空格 $str = str_replace("\r\n", "", $str); $str = str_replace("\n", "", $str); // 删除单行注...

phpjscss加载合并函数宋正河整理

<meta http-equiv="Content-Type" c/html; charset=utf-8" /> 无标题文档123以上就介绍了php js css加载合并函数 宋正河整理,包括了方面的内容,希望对PHP教程有兴趣的朋友有所帮助。

nginxjs/css合并请求(nginx-http-concat-master)模块shoemastermaster达人kangmaste【图】

nginx-http-concat-master 是淘宝研发的针对 nginx 的文件合并模块,主要用于合并前端代码减少 http 请求数。如果你的应用环境中部署了 nginx,那么可以考虑尝试此模块减少请求数。那 nginx-http-concat-master 模块中主要包含两个配置参数,concat 和 concat_unique ,concat 则用于开启或关闭请求合并功能,可以应用于http,server,location;而concat_unique 用来配置是否只允许同类型文件(相同MIME文件)合并,应用于http,s...

phpjscss加载合并函数宋正河整理,css宋正河_PHP教程

php js css加载合并函数 宋正河整理,css宋正河无标题文档123http://www.bkjia.com/PHPjc/1017650.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/1017650.htmlTechArticlephp js css加载合并函数 宋正河整理,css宋正河 ?php//phpjscss加载合并函数宋正河整理//转载请注明出处define(COMBINE_JS,true);define(COMBINE_CSS,tru...