切版 关于命名的极简主义标配瘦身图片规范如果涉及到多人协作文档响应式旋转 介绍
切版css1.0是切版网目前内部使用的框架，甚至于不算是一个框架，它只是提供了一个可靠的基础去创建你一个前端项目，提供了一段来自经验的css重写，并且约束了一些命名上的规范。
关于命名的极简主义
view–vw
nav–nv
left–lt
right–rt
head – hd
body –bd
foot –ft
list–lst
wrap–wp
标配
.about_view_left{
width:auto;
}
.about_list_right{
width:auto;
}
瘦身
.ab_vw_lt{
width:auto;
}
.ab_lst_rt{
width:auto;
}
图片规范
图片命名以img_01.png 依次往后面顺，大banner图片，数据图片均保存为jpg图片，透明图片、小图标之类都存储为png24图片。
结构用途的图片放入img目录，数据图片放入images目录下。
如果涉及到多人协作
如果涉及到多人协作，通过 style_wz（人名首字母）.css命名；图片命名以人名（wz_1.png）命名。
文档
<!DOCTYPE html> <html> <head> <Meta charset="utf-8"> <Meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <Meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/> <title>切版</title> <!--基础样式--> <link rel="stylesheet" href="css/qieban.css"> <!--css3动画库--> <link rel="stylesheet" href="css/animate.min.css"> <!--自己书写css的地方--> <link rel="stylesheet" href="css/style.css"> <!--书写响应式代码的地方--> <link rel="stylesheet" href="css/responsive.css"> <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" /> <!--低版本浏览器添加html5支持--> <!--[if lt IE 9]> <script src="js/html5.js"></script> <![endif]--> </head> <body> <!--添加jquery库文件--> <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> <!--好用小巧的响应式幻灯片--> <script type="text/javascript" src="js/jquery.glide.js"></script> <!--添加css3前缀支持--> <script type="text/javascript" src="js/prefixfree.min.js"></script> <!--快速让网站绚丽起来--> <script type="text/javascript" src="js/wow.min.js"></script> <!--自己写JS的地方--> <script type="text/javascript" src="js/script.js"></script> </body> </html>
响应式
@media only screen and (max-width:800px) {
}
旋转
/*360旋转*/
@keyframes spin {
0% {
transform:rotate(0deg);
}
100% {
transform:rotate(-360deg);
}
}
切版 关于命名的极简主义标配瘦身图片规范如果涉及到多人协作文档响应式旋转 官网
http://git.oschina.net/qieban/qieban
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
