CSS代码格式化和压缩的方法与技巧

第一步:需要掌握css的缩写技巧
参考下面的文章即可
CSS缩写优化CSS文件的体积
CSS常用属性缩写实例[推荐]第二步:用css在线格式化与压缩工具第三步:测试,看看经过压缩后的css文件,会不会导致页面变形等问题,一般情况下不会,不排除特殊情况。别忘了备份样式文件啊。

下面是一般用于css压缩的代码,一般情况下,喜欢脚本的朋友看下。具体的应用上面的两部即可。

CSS代码格式化和加密化

CSS代码格式化和加密化


/*请将CSS代码复制到这里,下面是示例*/
input,button{
height:20px;background-color: #ffffff;/*border:1px solid #333333;*/
}
textarea{background-color: #ffffff;border: #3872b4 1px solid;}
select{
height:20px;font-size: 12px;background-color: #ffffff;border:1px solid #333333;
}
a{
/*color:#794820;color:#000000;*/color:#004f8a;text-decoration: none;text-transform: capitalize;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
.input{border: #3872b4 1px solid;height:20px;line-height:20px;font-size:12px;}
#result_dao{
border-right: #b3cad6 1px solid; padding-right: 0px;border-top: #b3cad6 1px solid; padding-left: 2px;font-size: 12px; float: left; padding-bottom: 0px; margin: 2px 0px; border-left: #b3cad6 1px solid; padding-top: 0px; border-bottom: #b3cad6 1px solid; background-color: #e6eff4;width:100%;text-align: left;text-indent:20px;color:#333333;}
#content{
white-space: pre;
}
/***rss***/
.rss_b{/*border:1px solid #99ccff;*/ padding:1px;line-height:18px;font-size:12px;width:95px;height:18px;text-align:center}
.rss_l{border:1px solid #99ccff;background:#99ccff;margin:0px;margin-right:3px;padding-left:2px;padding-right:2px;color:#ffffff;}
.rss_a{border:1px solid #99ccff;background:#e8f3fd;margin:0px;padding-left:1px;padding-right:1px;color:#ffffff;}
.rss_a:link{color:#99ccff;}
.rss_a:visited{color:#99ccff;}
.rss_a:hover{background-color: #e8f3fd;text-decoration: none;color:#008ed2;border:1px solid #99ccff;}
/********rank*********/
.mo_{
background-color: #ffffff;width:48px !important;width:50px;border:1px solid #99ccff;cursor:pointer ; text-align: center;font-size:12px;float:left;border-top:1px solid #99ccff;border-bottom:1px solid #99ccff;text-decoration: underline;color:#cccccc;}
.mu_{
background-color: #e8f3fd;width:48px !important;width:50px;cursor:pointer ; text-align: center;font-size:12px;float:left;border:1px solid #99ccff;border-top:1px solid #ff9966;border-bottom:1px solid #99ccff;text-decoration: underline;}
.ms_{
background-color: #ffffff;border:1px solid #99ccff;border-top:1px solid #99ccff;border-bottom:1px solid #ffffff;width:48px !important;width:50px;height:25px !important;height:27px;cursor:default; text-align: center;font-size:14px;line-height:25px;float:left;}
.mx_{
float:left;height:260px !important;height:250px;
}
#Hot_Div span{float:left;height:26px !important;height:27px;border-bottom:1px solid #99ccff;width:2px;
}
.top{background-image: url(bg2.gif);background-position: center -145px; background-repeat: repeat-x;padding-left:5px;margin-top:5px;width:730px;float:left;margin-left:8px;/*border:1px solid #e8f3fd;*/border-top:1px solid #99ccff;/*background-color: #e8f3fd;*/padding-bottom:5px;}
.top h1{ font-family: arial, helvetica, sans-serif;font-size:15px;text-indent:5px;}
.top li{float:left;width:48%;/*background-color: #e8f3fd;height:20px;*/}
.belong_topic{
margin-left:15px;text-align:center;font-size:14px;
}
#article{
margin-left:10px;width:700px;margin-top:20px;word-break:break-all;overflow:scroll !important;overflow:default;float:left;background-color: #FAFAFA;
}
#copyright{width:700px;margin-left:20px;background-color: #F7F7F7;color:#8B8B8B;padding:10px;}
#bd_more{display:none;}
#page_p_div{width:100%;padding:auto;text-align: center;}
#page{margin:0 auto;}
/*
#i_1{background-color:#fdf7ff;}
#i_1 li{background-color:#fdf7ff;}
#i_1 li{color:#333;}
#i_1 li a{color:#333;}
*/
#i_1 .list2{border-top:1px solid #cc00ff;background-color: #ccccff;}
#i_1 .list2 h1{color:#333;}
#i_1 h3 a{color:#333;}

|

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • CSS代码格式化和压缩的方法与技巧

    第一步:需要掌握css的缩写技巧参考下面的文章即可CSS缩写优化CSS文件的体积CSS常用属性缩写实例[推荐]第二步:用css在线格式化与压缩工具第三步:测试,看看经过压缩后的css文件,会不会导致页面变形等问题,一般情况下不会,不排除特殊情况.别忘了备份样式文件啊. 下面是一般用于css压缩的代码,一般情况下,喜欢脚本的朋友看下.具体的应用上面的两部即可. CSS代码格式化和加密化 CSS代码格式化和加密化 /*请将CSS代码复制到这里,下面是示例*/ input,button{ height

  • Asp.net程序优化js、css实现合并与压缩的方法

    本文实例讲述了Asp.net程序优化js.css实现合并与压缩的方法.分享给大家供大家参考.具体实现方法如下: 访问时将js和css压缩并且缓存在客户端, 采用的是Yahoo.Yui.Compressor组件来完成的,用户可以点击此处本站下载. 创建一个IHttpHandler来处理文件 复制代码 代码如下: public class CombineFiles : IHttpHandler {         private const string CacheKeyFormat = "_Cac

  • 用于CSS代码压缩与格式化的javascript函数代码

    复制代码 代码如下: var lCSSCoder={ format : function(s){//格式化代码 s=s.replace(/\s*([\{\}\:\;\,])\s*/g,"$1"); s=s.replace(/\,[\s\.\#\d]*{/g,"{"); s=s.replace(/([^\s])\{([^\s])/g,"$1 {\n\t$2"); s=s.replace(/([^\s])\}([^\n]*)/g,"$1\n

  • 一款js和css代码压缩工具[附JAVA环境配置方法]

    TBCompressor的安装很简单,点击install.cmd就可以了,安装后会在里的右键菜单里出现"Compress CSS or JS"选项,需要压缩文件时只需选取目标文件然后右键点选"Compress CSS or JS"即刻.压缩后的文件会自动重命名. 这里对jQuery1.3 Development版进行压缩测试,效果如下:可以看到效果还是非常不错的:) TBCompressor下载 需要注意的是使用TBCompressor必须要有JAVA环境的支持,需

  • JS代码的格式化和压缩

    曾经为看别人写的杂乱代码而头痛吗?曾经为看BWindow代码而烦恼吗?曾经为减小JS体积和JS的可读性之间的矛盾而左右徘徊吗?最好的办法是有个代码格式化和代码压缩的程序,今天总算有了,它是纯JS编写的,当然也就是开源的了.由于写的仓促,还有些小BUG,请经常注意更新! Format document.getElementById("display").innerHTML = xx.format(); -------------------------------------------

  • javascript 动态生成css代码的两种方法

    javascript 动态生成css代码的两种方法 有时候我们需要利用js来动态生成页面上style标签中的css代码,方法很直接,就是直接创建一个style元素,然后设置style元素里面的css代码,最后把它插入到head元素中.但有些兼容性问题我们需要解决.首先在符合w3c标准的浏览器中我们只需要把要插入的css代码作为一个文本节点插入到style元素中即可,而在IE中则需要利用style元素的styleSheet.cssText来解决.还需要注意的就是在有些版本IE中一个页面上style

  • CSS代码检查工具stylelint的使用方法详解

    CSS不能算是严格意义的编程语言,但是在前端体系中却不能小觑. CSS 是以描述为主的样式表,如果描述得混乱.没有规则,对于其他开发者一定是一个定时炸弹,特别是有强迫症的人群.CSS 看似简单,想要写出漂亮的 CSS 还是相当困难.所以校验 CSS 规则的行动迫在眉睫.stylelint是一个强大的现代 CSS 检测器,可以让开发者在样式表中遵循一致的约定和避免错误.本文将详细介绍CSS代码检查工具stylelint 概述 stylelint拥有超过150条的规则,包括捕捉错误.最佳实践.控制可

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

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

  • 详解Nginx服务器的配置中开启文件Gzip压缩的方法

    gzip(GNU- ZIP)是一种压缩技术.经过gzip压缩后页面大小可以变为原来的30%甚至更小,这样,用户浏览页面的时候速度会块得多.gzip的压缩页面需要浏览 器和服务器双方都支持,实际上就是服务器端压缩,传到浏览器后浏览器解压并解析.浏览器那里不需要我们担心,因为目前的巨大多数浏览器都支持解析gzip 过的页面. Nginx的压缩输出有一组gzip压缩指令来实现.相关指令位于http{-.}两个大括号之间. 下面大致讲一下配置开启gzip压缩的方法: 1.Vim打开Nginx配置文件 v

  • C#格式化json字符串的方法分析

    本文实例讲述了C#格式化json字符串的方法.分享给大家供大家参考,具体如下: 将Json字符串转化成格式化表示的方法: 字符串反序列化为对象-->对象再序列化为字符串 使用Newtonsoft.Json提供的API,下载地址:http://www.newtonsoft.com/json 很多时候我们需要将json字符串以 { "status": 1, "sum": 9 } 这种方式显示,而从服务端取回来的时候往往是这样 {"status"

随机推荐