顾名思义缩写有简写意思,那就总结一下CSS缩写知识点。
为什么要让CSS属性缩写?
1、简化代码。一些CSS属性简写可以减少CSS代码从而减少CSS文件的占用字节。加快网页下载速度和网页加载速度。
2、优化CSS目的。其中CSS优化之一即是简化代码缩写CSS属性代码。
一、CSS样式属性单词代码简写优化
(1)CSS文本:

font-size:12px;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
line-height:22px;
即可简写缩写成:
font:12px/22px bold Arial,Helvetica, sans-serif;

(2)CSS背景:

background-color:#F00;
background-image:url(图片地址);
background-position:bottom;
background-repeat:no-repeat;
即可将背景CSS属性缩写为:
background:#F00 url(图片地址) no-repeat bottom;

(3)CSS内补距(CSS padding):

padding-top:5px;
paddding-right:20px;
padding-bottom:10px;
padding-left:15px;
即可缩写为:
padding:5px 20px 10px 15px; 或者
padding-top:5px;
padding-bottom:5px;
padding-left:10px;
padding-right:10px;
缩写为:
padding:5px 10px;

(4)CSS外边距(CSS margin):

margin-top:5px;
margin-right:20px;
margin-bottom:10px;
margin-left:15px;
即可缩写为
margin:5px 20px 10px 15px; 或:
margin-top:5px;
margin-bottom:5px;
margin-left:10px;
margin-right:10px;
缩写为:
margin:5px 10px;

(5)、CSS 边框:

border-top:1px solid #000;
border-right:1px solid #000;
border-bottom:1px solid #000;
border-left:1px solid #000;
即可缩写为:
border:1px solid #000;

总结:总结常用的CSS 缩写,希望在以后制作实践中多多使用和多多总结。

CSS优化压缩的更多相关文章

  1. 常用CSS优化总结——网络性能与语法性能建议

    在前端面试中最常见的问题就是页面优化和缓存(貌似也是页面优化),被问了几次后心虚的不行,平然平时多少会用到一些,但突然问我,很难把自己知道的都说出来.页面优化明显不是一两句能够说完的,这两天总结了一下 ...

  2. CSS的压缩 方法与解压

    为什么要压缩CSS? 1.大网站节约流量 2.加快访问速度 工具:Dreamweaver(手工替换,个人感觉任何文本编辑器都可以)不过DW可以还原 CSS压缩与CSS代码压缩还原方法,CSS压缩工具有 ...

  3. (转)常用CSS优化总结——网络性能与语法性能建议

    原文地址:http://www.cnblogs.com/dolphinX/p/3508657.html 在前端面试中最常见的问题就是页面优化和缓存(貌似也是页面优化),被问了几次后心虚的不行,平然平时 ...

  4. ASP.NET MVC 4 RC的JS/CSS打包压缩功能 (转载)

    ASP.NET MVC 4 RC的JS/CSS打包压缩功能 打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载 ...

  5. 关于js优化和css优化

    css优化: 1.css代码的压缩. 2.css文件的合并. 3.不滥用float,因为float在渲染时计算量比较大,所以尽量减少使用float. 4.避免在html标签中写style属性. js优 ...

  6. 教你如何写出高效整洁的 css 代码——css优化(转载)

    css 写起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在 css 书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的 css 代码原则. css 优化的原则 1. ...

  7. CSS, JavaScript 压缩, 美化, 加密, 解密

    CSS, JavaScript 压缩, 美化, 加密, 解密 JS压缩, CSS压缩, javascript compress, js在线压缩,javascript在线压缩,css在线压缩,YUI C ...

  8. 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作

    前端自动化(三)   合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...

  9. js、css动态压缩页面代码

    1.js.css动态压缩页面代码 <%@ Page Language="C#" AutoEventWireup="true" CodeFile=" ...

随机推荐

  1. Hadoop(21)-数据清洗(ELT)简单版

    有一个诸如这样的log日志 去除长度不合法,并且状态码不正确的记录 LogBean package com.nty.elt; /** * author nty * date time 2018-12- ...

  2. 一个新晋IT行业的努力Duiker

      亲爱的朋友,你好!   我很开心能以这么一篇博客来开始我的IT努力之路.我叫Duiker,是一名软件工程专业的学生,想通过写博客来提升自己,充实自我. 首先,我要确立自己的学习编程目标: 1.将算 ...

  3. 2 web服务器:固定返回值

    1.老师给的思路 #tcp socket 服务端 socket = socket.socket() socket.bind() socket.listen() client_socket = sock ...

  4. Android StateListDrawable的坑

    有问题的代码: StateListDrawable background = new StateListDrawable(); CircleDrawable pressedDrawable = new ...

  5. 利尔达NB-IOT的PSM和eDRX低功耗模式笔记

    1. NB-IOT的技术优势,广覆盖,NB-IOT与GPRS和LTE相比较,最大链路预算提升了20dB,相当于提升了100倍,即使在地车车库.地下室.地下管道等普通无线网络信号难以到达的地方也容易覆盖 ...

  6. goroutine 并发之搜索文件内容

    golang并发编程 - 例子解析 February 26, 2013 最近在看<Programming in Go>, 其中关于并发编程写得很不错, 受益非浅, 其中有一些例子是需要多思 ...

  7. unity3d 摄像机跟随角色时被物体遮挡解决方案

    参考文章:http://www.xuanyusong.com/archives/1991 在看此文章时请先看上面的参考文章 看完以上文章后,你也许会想人家都已经给出所有代码了,你还写个毛啊 别急,现在 ...

  8. UIButton内部子控件自定义布局-“UIEdgeInsets”

    UIButton UIButton做frame动画时,不响应点击 在一个View内部加入几个按钮,然后改变这个view的frame来做动画,但是按钮不响应点击事件. 问题代码 __block CGRe ...

  9. Vm-Ubuntu下配置Qt开发环境

    在昨天的Ubuntu换降下,安装Qt发现编译的时候是缺少opengl的 奈何找了好多方式都无法安装opengl 今天看到另一位大神写的,才发下自己找的还是有问题 大神帖子网址:http://blog. ...

  10. 6.0 实现app登录

    1.0.0:学习ui自动化准备工作 待测app,我这里有准备两个apk,这两个都是我曾经做过的项目,后续的文章都是基于这两个app! 链接:https://pan.baidu.com/s/1I0vR9 ...