新手上路 - quickly切图框架

关于quickly

quickly快速切图框架曾用名 ThinkCSS,QuickCSS,是武汉切图网络技术有限公司基于多年前端开发经验，整理开发出来的一套css框架。

重要说明

1.1命名规则

quickly框架提供的样式组件均以qui-开头，无一例外。我们不期望一个框架可以解决所有问题，所以qui-开头的好处在于，将来如果您需要增加样式，只需要按正常命名就好了，不用担心样式冲突问题。

1.2命名体系

了解我们的命名体系，将有助于您更好的上手框架，您需要熟悉这些常用命名单词缩写：
fs 字体大小，lh 行高，ls 字体间距, pd 内间距 pdl 内左间距 pdt 内间距， mg 外间距 , mgt 外间距，bg背景，txt 文字， btn按钮等等。

图标是额外引用的，可以选择是否引用，在quickly.css文件的前几行，@import url("icon.css");

文件结构

quick快速切图css框架基于jquery和vue.js

 /*切图css框架/    
	├── assets/css/    
	│   ├── quickly.css     
	├── assets/js/
	│   ├── jquery.js
	│   ├── vue.js
	│   ├── quickly.js    
	└── img/  */

正确的加载

<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>untitled</title>
 
<!--用于iphone开发-->
<meta content="width=device-width,initial-scale=1" name="viewport"> 
<link rel="stylesheet" href="../assets/css/quickly.css"> 

<script src="../assets/js/jquery.js"></script> 
<script src="../assets/js/vue.js"></script>  
<script src="../assets/js/quickly.js"></script>  

</head>
<body>
<!--内容-->
</body>
</html>

使用许可

代码基于Apache License v2.0, 文档基于创作共享的署名-非商业使用-相同方式分享 2.5 协议发布

起步

quickly快速切图框架