淘先锋技术网

首页 1 2 3 4 5 6 7

一、背景

作为一个后端开发,总有一些后台服务需要包揽前后端的活,而前端(html+css+js)不够熟悉的情况下开发,就生产了大量丑的不忍直视的页面,虽说功能实现了,但是给人第一感觉就是low穿地心。只要花少量的时间美化下页面,就给自己做出的成果提升了一个档次,Pm等外行会觉得牛批很多,其实没啥技术含量。。

二、摘要

1.使用bootstrap快速搭建前端页面框架,先设计好静态页面,和相关js控制,后台action等留白

2.最后再改造成动态JSP、vm或者其它,避免每次修改页面呈现效果都需要重启服务。

三、开发流程

1.online页面设计

http://www.ibootstrap.cn/  包含了布局设置基本CSS工具组件JAVASCRIPT 四个类别的组件

网站可以拖动式设计自己的页面框架和元素样式,设计好自己想要的大致页面框架,点击下载即可复制html代码。

  • 页面布局

使用第一个导航item 布局设置 bootstrap 栅栏式 可嵌套的布局,完全够用了

  • 基本CSS 

包含了最常用的html元素,作为一个后端开发,最常用的就是表单、表格

  • 工具组件

包含了按钮组、下拉菜单、导航、路径导航、分页、标签、徽章、巨幕、页头、文本、缩略图、进度条、媒体、列表组、面板,

  • JavaScript

最常用是遮罩窗体


导航栏、选项卡、提示框、手风琴切换、幻灯片