Watch 1 Star 11 Fork 0

qietuwang / quicklyHTMLMIT

Join us
Explore and code with more than 2 million developers,Free private repositories !:)
Sign up
快速前端切图响应式css框架 spread retract

http://qietu.com/quickly/v1.4

Clone or download
mobile.html 3.12 KB
Copy Edit Web IDE Raw Blame History
qietuwang authored 2019-11-28 19:38 . no commit message
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>移动端 - quickly切图框架</title>
<meta name="keywords" content="quickly快速切图css框架,中文css框架,css框架,开源css框架,css框架下载"/>
<meta name="description" content="quickly切图框架是一款基于html5技术的网站跨屏自适应框架,基于jquery和vue数据双向绑定。"/>
<meta content="width=device-width,initial-scale=1" name="viewport">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="assets/css/quickly.css">
<link rel="stylesheet" href="assets/css/prettify.css" >
</head>
<body>
<div class="qui-container" id="app" v-cloak>
<div class="qui-naver-wrap">
<div class="qui-naver">
<div class="qui-wrapper">
<div class="brand">
<a href="./index.html"><img src="assets/imgs/logo.png"/></a>
<span>{{kpData.kpLogotxt}}</span> </div>
<div class="qui-gh">
<a href="#"></a> </div>
<div class="module">
<ul>
<li v-bind:class="{ selected: item.link == currPage }" v-for="(item,i) in kpData.kpNavs">
<a :href="item.link" :target="item.target">{{item.title}}</a>
<ul v-show="item.subMenu">
<li v-for="(itm,n) in item.subMenu">
<a :href="itm.link" :target="itm.target">{{itm.title}}</a>
</li>
</ul>
</li>
</ul>
</div>
<div class="sub">
<ul>
<li v-for="(item,i) in kpData.kpNavsRt">
<a :href="item.link" :target="item.target">
<i :class="'iconfont ' + item.icon "></i>{{item.title}}</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="qui-heading qui-heading-sm">
<div class="qui-wrapper">
<h1>移动端</h1>
<h3>作为响应式下移动端定义的补充</h3>
</div>
</div>
<div class="qui-wrapper">
<div class="qui-row">
<div class="qui-col9">
<h2 id="important">重要说明</h2>
<p>所有的移动端的样式定义均以<code>qui-m-*</code>格式,无一例外。 </p>
<h2 id="font">字体定义</h2>
<p>定义了常用移动端字体大小 qui-m-fs12 , qui-m-fs14,qui-m-fs16 ... qui-m-fs30</p>
</div>
<div class="qui-col3">
<ul class="qui-sidebar">
<li class="selected">
<a href="#important">重要?</a></li>
<li><a href="#font">字体</a></li>
</ul>
</div>
</div>
</div>
<div class="qui-wrapper qui-footer">
{{kpData.kpCopyRight}}</div>
</div>
<script src="assets/js/vue.js"></script>
<script src="assets/js/jquery-1.7.1.min.js"></script>
<script src="assets/js/prettify.js"></script>
<script src="assets/js/quickly.js"></script>
<script src="assets/js/kpdata.js"></script>
<script>
new Vue({
el:'#app',
data: {
kpData:kpData,
currPage : 'start.html'
},methods:{
},
mounted(){
},
created:function(){
},
})
</script>
</body>
</html>

Comment ( 0 )

Sign in for post a comment

HTML
1
https://gitee.com/qietuwang/quickly.git
git@gitee.com:qietuwang/quickly.git
qietuwang
quickly
quickly
master

Help Search