前端设计爬坑

1.framework7的使用

这是一个更符合移动端页面要求的UI模板库，做PC端页面设计的时候只需要引入framework7-bundle.css、framework7-bundle.js即可，修改的地方写在app.css、app.js里面。
1.1单page页面布局

<div id="app">
	<div class="view">
		<div class="page">
			<div class="side-navbar">
			...
			</div>
			 <div class="main-navbar">
			 ...
			 </div>
			 <div class="page-content">
			 ...
			 </div>
		 </div>
	</div>
</div>
 

一个单页面至少必须要有app->page->page-content，navbar视情况看放在page-content里面还是page和page-content的中间
1.2编写规范

例如

<div class="item-content item-input ">
	<div class="item-inner">
		<div class="item-input-wrap">
			<label for="">..</label>
			<input type="text" placeholder="请选择" readonly="readonly" id="demo-calendar-range1" />
		</div>
	</div>
</div>

不要去修改模板中已经命名好的class名称，直接用就行了，要改样式在自己写的css里修改。这样是为了更好利用别人写好的厉害的模板，避免名词重叠造成更多麻烦。