为什么要让CSS属性缩写?

分类 : Web前端

DIV CSS缩写——CSS 缩写

顾名思义缩写有简写意思,所以这节我们介绍CSS缩写知识点。

为什么要让CSS属性缩写?
1、简化代码。一些
CSS属性简写可以减少CSS代码从而减少CSS文件的占用字节,加快网页下载速度和网页加载打开速度。
2、优化CSS目的。其中CSS优化之一即是简化代码缩写CSS属性代码。

常见DIV+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 left bottom;css5.com.cn缩写介绍。

3、CSS 内补距(CSS padding):padding-top:5px; padding-bottom:10px; padding-left:15px; padding-right:20px; 即可缩写为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-bottom:10px; margin-left:15px; margin-right:20px; 即可缩写为margin:5px 20px 10px 15px; 或margin-top:5px; margin-bottom:5px; margin-left:10px; margin-right:10px;缩写为margin:5px 10px;

5、CSS 边框:border-left:1px solid #000;border-right:1px solid #000;border-top:1px solid #000;border-bottom:1px solid #000;即可缩写为:border:1px solid #000;

以上是CSS5总结常用的CSS 缩写,希望在以后制作实践中多多使用和多多总结,更多css压缩优化



相关文章

 


分类: Web前端    访问() .NET技术    Web前端    JAVA开发    HTML基础    数据库    电脑知识    CSS基础
CSS教程-web前端教程-免费教程
HTML教程-web前端教程-免费教程

分类

.NET技术 Web前端 JAVA开发 HTML基础 数据库 电脑知识 CSS基础

随机阅读

向net core 3.0进击——多平台项目发布与部署
方正幼线繁体下载,方正幼线繁体字体迅雷下载包
如何配置 SQL Server 以允许远程连接
div css float浮动用法(left right)
C语言,Break语句的用法
国务院办公厅关于2021年部分节假日安排的通知
TypeScript是什么,为什么要使用它?
方正中倩繁体(FZZQFW)下载大全,什么方正中倩繁体字体下载
字体下载,免费字体下载,字体免费下载
方正中倩繁体(FZZQFW)字体下载,方正中倩繁体字体下载
方正中等线繁体下载,方正中等线繁体字体迅雷下载包
方正综艺繁体免费字体下载,方正综艺繁体字体免费下载,方正综艺繁体字体下
方正中倩简体下载字体后如何安装,如何下载字体并安装
方正中楷繁体(FZZKFW)下载字体后如何安装,如何下载字体并安装
方正中楷繁体(FZZKFW)字体下载,方正中楷繁体字体下载


最新

div css隐藏内容样式方法
OPPO Reno3 Pro远程守护怎么使用?
XP系统里让IE支持多线程下载怎么设置
qq电脑管家温度检测在哪设置的? QQ电脑管家怎么测电脑的温度
win7禁用ie浏览器方法 win7怎么把桌面的ie隐藏
WinXP笔记本声卡驱动无法成功安装的解决方法
XP⁄Win7共享⁄连接打印机设置详细 xp怎
华为笔记本蓝屏错误0xcoooo428怎么解决
企业如何部署微软Windows 8? Windows 8的开发历史
华为mate9怎样解指纹密码?

推荐阅读

c语言中break语句的作用
vscode----vue中HTML代码tab键自动补全
undefined是什么意思啊
js 中日期 转换成时间戳 例如2013-08-30 转换为时间戳
DIV CSS字体(font-family)实现字体样式设置
C语言程序中break是什么意思?
C#语言之“string格式的日期时间字符串转为DateTime类型”
Mysql里表示布尔型的类型是什么
replace和replaceAll是JAVA中常用的交换字符的办法
column chart 和bar chart的区别


Copyright © 2017 CSS5.NET教程.CSS5 内容仅用于学习和测试参考。 css5.net All Rights Reserved 蜀ICP备15003849号-16