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. 对于改善 MySQL 数据装载操作有效率的方法是怎样

    多时候关心的是优化SELECT 查询,因为它们是最常用的查询,而且确定怎样优化它们并不总是直截了当.相对来说,将数据装入数据库是直截了当的.然而,也存在可用来改善数据装载操作效率的策略,其基本原理如下 ...

  2. 【PHP操作sphinx】

    [index.php] [find.php] <?php header("Content-type:text/html;charset=utf-8"); $keyword = ...

  3. JavaEE基础(二十三)/递归

    1.File类递归练习(统计该文件夹大小) 需求:1,从键盘接收一个文件夹路径,统计该文件夹大小 2.File类递归练习(删除该文件夹) 需求:2,从键盘接收一个文件夹路径,删除该文件夹 3.File ...

  4. SDUT 2411:Pixel density

    Pixel density Time Limit: 1000MS Memory limit: 65536K 题目描述 Pixels per inch (PPI) or pixel density is ...

  5. YTU 2295: KMP模式匹配 一(串)

    2295: KMP模式匹配 一(串) 时间限制: 1 Sec  内存限制: 128 MB 提交: 32  解决: 22 题目描述 求子串的next值,用next数组存放,全部输出 输入 输入一个字符串 ...

  6. Unity Adam特性整理

    1.Wind 小工具,一个绘制箭头Gizmos的脚本 2.TubeLight柱形光照 蛮NB的技术,实现动态柱状光照,但相机必须挂上PostProcessing 默认场景拖出来之后是这样的,然后给相机 ...

  7. Javascript正则表达式笔记

    一.字符类 将单独的直接字符放进[]内,就组成了字符类.一个字符类和它所包含的任何字符都匹配. 例如:/[abc]/ 与abc三个字母的任意一个匹配. 同时,还可以定义否定字符类.利用^字符.例如:/ ...

  8. Android中@id与@+id区别

    Android中的组件需要用一个int类型的值来表示,这个值也就是组件标签中的id属性值. id属性只能接受资源类型的值,也就是必须以@开头的值,例如,@id/abc.@+id/xyz等. 如果在@后 ...

  9. 多态,虚拟方法,重写,接口,类库,委托,is,as运算符,泛型集合,万能变量

    多态:简而言之就是龙生九子,各有不同 有了继承,才有了多态 1.虚方法 virtual重写 override父类中的方法,在子类中并不适用,那么子类需要自主更改继承的方法或者是属性,那父类中加了vir ...

  10. linux Centos 6.5 FTP服务原理及vsfptd的安装、配置(转)

    本篇随笔将讲解FTP服务的原理以及vsfptd这个最常用的FTP服务程序的安装与配置... 一.FTP服务原理 FTP(File Transfer Protocol)是一个非常古老并且应用十分广泛的文 ...