精简CSS代码,提高代码的可读性和加载速度
定义简洁的CSS规则:CSS的每条规则中都包含了规则的属性及属性值。定义简洁的CSS规则主要是指合并相关规则和定义简洁的属性值。
前言
定义简洁的CSS规则
1. 合并相关CSS规则
p.reader-title {
font-family: Georgia, serif;
font-size: 12px;
font-style: italic;
font-weight: bold;
line-height: 30px;
}
p.reader-title {
font:italic bold 12px/30px Georgia, serif;
}
2. 定义简洁的属性值
p.reader-title {
color: #FFFFFF;
font-size: 0.8em;
padding: 0em;
}
p.reader-title {
color: #F3E;
font-size: .8em;
padding: 0;
}
合并相同的定义
.library-title {
text-align: center;
font-weight: 700;
overflow: hidden;
text-overflow: ellipsis;
color: #FFF;
font-size: 1.2em;
line-height: 2em;
}
.search-title {
text-align: center;
font-weight: 700;
overflow: hidden;
text-overflow: ellipsis;
color: #FFF;
font-size: 1.4em;
line-height: 2.5em;
}
.library-title,.search-title {
text-align: center;
font-weight: 700;
overflow: hidden;
text-overflow: ellipsis;
color: #FFF;
}
.library-title {
font-size: 1.2em;
line-height: 2em;
}
.search-title {
font-size: 1.4em;
line-height: 2.5em;
}
删除无效的定义
.invalid-css {
padding-top:-20px;/* 无效的属性值 */
border: 1px soild #DDD;/* 拼写错误 */
}
原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。