1:设计图---》分出几个独立模块---》颗粒化布局---》文档流控制整体布局---》固定位置的元素绝对定位,段落这种元素不可绝对定位。-----》加上和后台交互用的js代码----》会采用常规的交互写法。

头部:header

登录表单:form_list

按钮:but

文本:con_text

  商品:goods

  说明:text_explain

2:独立模块内部还可细分---》抽象出公共部分。

 例如按钮

but:共同样式

 small_but:小按钮独有样式

big_but:大按钮独有样式

 <button class="but small_but"></button>:巧用多类选择器.

3:按钮---->span--->a--->用的较多。

提交表单:button标签,需加type属性;

  跳链接按钮:a标签---》适用性较好;

  获取验证码:<input type="button" />  span标签也好使;

4:前端展示的数据---》留个span标签--》方便后台调用。

5:css中各模块注释----》最好使用英文-----》  /*header s*/

6:边框---》border:1px solid #fff;---->手机屏幕分辨率最低为1px---->宽度为1px时候不用写成rem的形式。

7:提前问问有公共样式吗----》防止和自己的样式表重叠。

8:按钮提交后----》成功状态---》失败状态---》不全的话和设计要-----》直接写在相应位置注释掉即可。

9:切图---》考虑一致性---》考虑后续可能更改---》尽量大点----》为后续更改留空间。

10:svn--->下载软件和中文包---》安装---》登录---》先更新再提交---》提交时候必要加上修改注释否则提交不上。

11:在SVN上修改后,注意更新提交相关修改过的---》不要漏---》如样式表----》图片---》HTML----》js.

12:svn中css js 图片地址要转换成服务器绝对地址。

13:搞定后和后台说下,就像设计和你说一样。

jj前端项目1th总结的更多相关文章

  1. 用gulp构建你的前端项目

    前言 前端技术发展日新月异,随着模块化.组件化的提出,前端变得越来越复杂,静态资源越来越多,那么对静态资源的处理,如压缩,合并,去掉调试信息.. 如果还是人工去处理,效率非常之低且还容易出错,于是自动 ...

  2. 前后端分离之前端项目构建(grunt+require+angular)

    前言 前段时间做了一个项目,前端开发页面,然后把代码给到后端同学,后端同学通过vm再来渲染页面.后来才发现,这种方式简直是太low了,因为前端代码在服务端同学那里,每次前端需要更改的时候都需要去到服务 ...

  3. 前端项目构建工具---Grunt

    什么是Grunt? grunt是javascript项目构建工具,在grunt流行之前,前端项目的构建打包大多数使用ant.(ant具体使用 可以google),但ant对于前端而言,存在不友好,执行 ...

  4. [front]有效开展一个前端项目

    今天的前端如果没有用到 npm,效率是比较低的:所以要从使用的工具来讲. 1. 一切都依赖于 nodejs: 下载一个 linux 的源码包就可以开始安装了. $ wget https://nodej ...

  5. gulp 配置前端项目打包

    项目发布时,需要对项目js文件进行压缩,混淆,连接等操作以减小项目http请求,加快访问. gulpjs.com中有很多插件可以用来配置打包部署. 需要用的常用插件有: gulp-jsmin  压缩j ...

  6. 使用gulp来构建一个前端项目

    什么是gulp? gulp是一个前端项目构建工具,是自动化项目的构建利器,它不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成.你可以使用gulp及其插件对你的项目代码 ...

  7. gulp + webpack 构建多页面前端项目

    修改增加了demo地址 gulp-webpack-demo 之前在使用gulp和webpack对项目进行构建的时候遇到了一些问题,最终算是搭建了一套比较完整的解决方案,接下来这篇文章以一个实际项目为例 ...

  8. 从一个前端项目实践 Git flow 的流程与参考

    Git flow 出自 A successful Git branching model,这里使用了一个前端项目配合本文稿实施了 git flow 并记录流程作出示例和参考,对 hotfix 与持续部 ...

  9. 前端项目部署之Grunt

    如果你的前端项目很小或都者项目不需要通过专门的运维同学走流水线上线部署的话,那么可以略过以下的繁文. ok,Let's go! 我们看看如何使用grunt来部署上线项目? 前端项目一般分为两种类型:T ...

随机推荐

  1. java利用zxing编码解码一维码与二维码

    最近琢磨了一下二维码.一维码的编码.解码方法,感觉google的zxing用起来还是比较方便. 本人原创,欢迎转载,转载请标注原文地址:http://wallimn.iteye.com/blog/20 ...

  2. JavaEE基础(十六)/集合

    1.集合框架(去除ArrayList中重复字符串元素方式) A:案例演示 需求:ArrayList去除集合中字符串的重复值(字符串的内容相同) 思路:创建新集合方式 /** * A:案例演示 * 需求 ...

  3. thinkphp模板中截取中文字符串的方法分享

    前段用thinkphp写了一个系统,感觉thinkphp学起来比较容易,开发起来了比较顺手,其中一个关键的因素就是它的模版引擎相当强大,使用方法跟smarty类似,在模版中还可以用php代码,有模版包 ...

  4. mha的搭建步骤(一主一从架构)

    所需脚本文件到这里下载:http://note.youdao.com/share/web/file.html?id=ae8b11a61f7a8aa7b52aac3fcf0c4b83&type= ...

  5. textarea不能提交html格式的代码

    解决方法:web.config中<system.web>节点添加 <httpRuntime targetFramework="4.5" requestValida ...

  6. LINQ TO DATATABLE/DATASET基本操作之-简单查询

    废话不说,直接贴上代码: 其中:SerchLinqData();方法查询数据并返回一个datatable表.为数据源. #region 绑定数据 public static string BindDt ...

  7. springMVC配置freemarker

    这里呢,我首先来说明一下写该篇的目的. 我最近要用到freemarker因此研究了一下这个东西. 先来说说如何配置吧. 1.jar包.地址见下链接. http://pan.baidu.com/s/1j ...

  8. 会话标识未更新(AppScan扫描结果)

    最近工作要求解决下web的项目的漏洞问题,扫描漏洞是用的AppScan工具,其中此篇文章是关于会话标识未更新问题的.下面就把这块东西分享出来. 原创文章,转载请注明 ----------------- ...

  9. Ahui Writes Word

    Ahui Writes Word Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) To ...

  10. EditorWindow窗口大小锁死后没有边框的解决方法

    var window = GetWindow(typeof(MyWindow), true); window.minSize = , ); window.maxSize = window.minSiz ...