原标题:CSS代码的压缩方法

在建站的时候,很多网站都对他们的代码进行压缩,今天主要来讲解下CSS代码的压缩,压缩后的CSS代码所占用字节数会减少,要是访问量比较小的网站看不出明显的区别,比较大型的网站,就能节约很多内存资源。

对于压缩代码工具,网上也有很多CSS压缩工具可以下载,今天我要说的是教大家直接使用最常用的前端编辑器Dreamweaver进行压缩代码 。

方法:

1、打开CSS文件

2、删除空格压缩代码,

使用快捷键“Ctrl+F”,调出查找与替换工具选项卡

查找处输入一个英文半角小写“空格”

在“查找”输入框中输入一个空格,“替换”的输入框中无需填入任何字符或代码,这样在执行替换时候,相当于把空格替换为没有字符,相当于删除空格位置。

点击“替换全部”即可将多余的空格位置删除完成,完成压缩一部分。

3、将多余的分号删除

在CSS代码中,每个CSS选择器内的最后一个CSS样式的结束是不需要“分号”结束的。

避免删除错其它“分号”,这个时候在“查找与替换”选项卡中“查找”输入框中填写“;}”(分号+后花括号),在“替换”输入框中只输入“}”(后花括号),然后点击“替换全部”,即可完成删除多余分号符号。

4、删除多余空行,让代码都排成一排紧贴一起

可以手动删除空行,也可以使用DW软件快速删除空行,具体删除压缩如下。首先将鼠标光标移动到选择器开头,然后点击鼠标左键不放同时往上拉到上一个选择器结束前(上一个CSS样式选择器后花括号后),这个时候即可选中空行,此时选中空行为蓝色区域。

调出“查找与替换”工具

在选中后松开鼠标左键后,使用快捷键“Ctrl+F”,即可调用出“查找与替换”选项卡,此时“查找与替换”选项卡的“查找”输入框中即可自动填上刚刚选取好的空行。点击“替换全部”完成压缩在“替换”输入框无需再输入什么字符或代码,直接点击“替换完成”,完成替换。返回搜狐,查看更多

责任编辑:

css样式压缩了怎么还原,CSS代码的压缩方法相关推荐

  1. 动态加载html 添加样式表,使页面动态加载不同CSS样式表,从而实现不同风格模板的方法...

    我们在制作网页时,有时会制作多种风格模板,而想把这些模板都用起来,而又不知道方法,通过以下两种方法,你就可以实现相同网站不同CSS模板的方法. ASP.Net中利用CSS实现多界面两种方法. 方法一: ...

  2. 第4章编辑css样式,第4章 使用CSS样式.ppt

    第4章 使用CSS样式 4.1 学习任务:认识CSS样式表 4.2 学习任务:CSS规则的定义和创建 4.3 学习任务:在网页文档中使用CSS样式 4.4 上机实训--用CSS美化网页 4.1 学习任 ...

  3. 快速生成CSS样式语法(HTML、CSS)

    快速生成CSS样式语法(HTML.CSS) <!DOCTYPE html> <html lang="en"><head><meta cha ...

  4. jq动态修改css样式表,jquery 动态改变css样式

    jquery 几乎成了现在开发WEB应用的标准JS库,这与其简单性和易用性是分不开的.作为一个后端开发人员,要做一些前端页面时,CSS 样式的控制是少不了需要掌握的.如果是静态的CSS,当然是可以直接 ...

  5. html页面变成黑白,修改CSS样式实现网页变灰色/黑白代码的几个方法整理

    今天上午有网友提到希望将网站整体的色调换成灰色.黑色色调,这个记得在以前纪念一些日子的时候会有用到,早年老蒋在自己的博客中也有使用的.记得那时候直接是修改CSS就可以实现,既然有用户需要,老蒋这里抽点 ...

  6. 修改CSS样式实现网页变灰色/黑白代码的几个方法整理

    今天上午有网友提到希望将网站整体的色调换成灰色.黑色色调,这个记得在以前纪念一些日子的时候会有用到.记得那时候直接是修改CSS就可以实现,既然有用户需要,这里抽点时间再整理一下看看是否有其他更好的方法 ...

  7. 多个css样式合并到一个“目录”css文件中

    执行访问jsp后发现没有效果 同样的代码,在html中效果对比如下: 具体原因:不清楚,暂时记着~~~在jsp中不支持@import这种css样式的引用 转载于:https://www.cnblogs ...

  8. CSS样式引入方式和部分CSS样式的设置

    一.三种引入方式以及其应用场景 1.行间样式,当样式非常少.在一组选择器内需要优先样式,缺点是不是人看的代码样式,影响布局结构的视觉效果 a.写在起始标签的style属性里,各样式之间用": ...

  9. 网页制作 css样式,网页设计与制作-CSS样式.ppt

    网页设计与制作-CSS样式 第四章CSS样式 4.1 CSS样式的定义和使用 4.1.1什么是CSS CSS(Cascading Style Sheet,层叠样式表)是一种格式化网页的标准方式,它扩展 ...

最新文章

  1. MIT公布“著名黑客之死”调查报告
  2. vmware-tools安装说明
  3. Python--day43--增删改查补充和limit以及order by
  4. Python实现微信消息防撤回
  5. Node提示:error code Z_BUF_ERROR,error error -5,error zlib:unexpected end of file
  6. Master Data Service调用API创建Model
  7. Log binomial 回归在队列中的应用
  8. 面向dba的linux shell 脚本简介,面向dba的linuxshell脚本简介.doc
  9. php mysql保存unicode_使用PHP和MySQL存储和显示unicode字符串(हिन्दी)
  10. HTML与CSS(图解6):超链接
  11. android 补签控件,墨墨背单词怎么补签 看完你就懂了
  12. CentOS7安装Nagios
  13. OpenBlock:针对EveryBlock.com源码的开源拓展项目
  14. Python-文件的管理
  15. 一个OpenMP的学习程序
  16. java基于ssm的农产品网上销售系统
  17. 安装VMware,出现没有虚拟网络适配器的问题
  18. vue3视频播放插件vue3-video-play的具体使用方法
  19. layui教程,非常全,常用代码一键复制粘贴
  20. python自动控制原理_自动控制原理(山东联盟-中国石油大学(华东))知到答案2020年MOOCPython语言程...

热门文章

  1. html 中箭头的代码,HTML中利用div+CSS实现简单的箭头图标的代码
  2. DDD的创新思想:开发即设计思想
  3. 机器学习06|两万字:决策树 【jupyter代码详解篇】
  4. Android 虚拟按键与沉浸式的适配
  5. 使用 Springboot websocket 实现聊天室
  6. 如何使用Arduino开发板读/写SD卡模块的数据
  7. 关于TopoJSON以及制作方法
  8. vue大括号里接受一个函数_vue双花括号的使用方法 附练习题
  9. 2019第十届蓝桥杯——I.胖子迷宫
  10. win10 截屏方法