css扁平化博客学习总结（一）模块分析

一、模块分析

1.每开发一个项目之前，首先要对项目进行一个大致规划，它到底要做什么功能，它有什么具体需求。

2.所以需要进行模块化分析，把这些东西具象化，把一个问题模块化，对需求有一个宏观的了解。

3.有一个模块的概念后，把模块进行细分，细分成更小的模块，然后逐一击破。

不进行模块分析的恶劣影响：

不做模块分析，一上手就想到哪儿做到哪儿，很容易一叶障目，不能看到全貌，你会发现做着做着就失控了。因为有些地方出现了矛盾，你会发现要修改的成本很高，还不如推倒重写。

新手很容易着眼于细节，首先不应该从细节开始做。

二、整体分析

首先做一个页面分析：

1.body下只含page-wrapper和menu；

2.page-wrapper含一个header、一个footer和五个section：banner、one、two、three、cta。

三、组件分析

1.header下有一个h1、nav

2.一个页面最好只有一个h1，nav下含一个ul，ul里含li，li里含a，目前只有一个a标签，但为了之后的可扩展性，还是要这么灵活的写。

3.banner下含inner，和向下滚动的按钮a；inner含p，ul、li、a按钮；

4.one下有一个inner div，为了约束内容的宽度，让内容不会溢出。div下有一个header、一个ul下有三个同级图片li

5.two下有3个section，每个section下分别有一个image和一个content区域

6.three下有一个inner div，div中有一个header、6个div

7.cta与上面没什么差异

8.footer下有2个span

时间： 2024-08-09 07:44:01

css扁平化博客学习总结（一）模块分析的相关文章

css扁平化博客学习总结（三）header代码实现

页头.banner.正文.页脚的宏观布局 1.布局顺序的重要性: 由大到小,着眼最大的部分,慢慢细分. <body> <header> <nav></nav> <div id="banner"></div> </header> <div class="content"><!-- 内容开始 -

css样式重置方法一:不推荐使用,这么写会让网页解析速度变慢. *{ margin: 0; padding: 0;} 方法二:大家常用的写法,比较流行. body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol,li, dl, dt, dd, form, a, fieldset, input, th, td{margin: 0; padding: 0; border: 0; outline:

struts2博客学习之旅

1.博客学习笔记(感谢博主):http://www.cnblogs.com/xiaolongSunny/ 2.struts检验器[使用 visitor 校验复合属性 ](感谢博主):http://takeme.iteye.com/blog/1667716

django参考博客学习

网上发现其他人的一个django系列博客,和我学的一样是黑马的,写的挺不错的,转载学习一下 https://blog.csdn.net/u014745194/article/category/6989943 原文地址:https://www.cnblogs.com/regit/p/9023081.html

android fragment 博客学习记录

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37992017 上篇博客中已经介绍了Fragment产生原因,以及一些基本的用法和各种API,如果你还不了解,请看:Android Fragment 真正的完全解析(上). 本篇将介绍上篇博客提到的:如何管理Fragment回退栈,Fragment如何与Activity交互,Fragment与Activity交互的最佳实践,没有视图的Fragment的用处,使用Fragment创

mybatis博客学习的方式

1.参考完整的博客笔记:http://www.cnblogs.com/xdp-gacl/tag/MyBatis%E5%AD%A6%E4%B9%A0%E6%80%BB%E7%BB%93/ 2.补充博客1中的mybatis多对多查询:http://www.cnblogs.com/chenliyang/p/6548400.html

[转载]关于CSDN, cnblog, iteye和51cto四个博客网站的比较与分析

CSDN:http://blog.csdn.net/ cnblog: http://www.cnblogs.com/ iteye: http://www.iteye.com/blogs/ 51cto: http://blog.51cto.com/ 1. 基本功能博客(又名网络日志),顾名思义,最早的基本功能就是支持用户在网站上写日志,并进行修改.删除.分类管理,以及对他人博客的阅读和评论等.以上功能所有的博客网站都必须具备,为了更好地完成以上功能,这里对更细致的条目进行了比较: csdn

使用CSS代码修改博客模板

在修改设置使公告栏里的头像更新为新的头像时发现里边还有“页面定制CSS代码”这一选项,查了一下发现这东西可以对页面做一些个性化的调整.正好目前我使用的这个模板标题和导航栏的字体实在难看,顺手修改了一下. 因为我之前是对CSS这方面完全不了解,所以只能连蒙带猜.首先,这CSS代码估计就是设置一下某些参数的值,应该跟.ini之类的文件形式比较类似.看了一下别人写的一些简单的代码,大概了解了一下格式,跟预想的差不多.接下来是要找到模板本身自己的CSS代码,不然我怎么知道要修改谁呢?一开始我是直接从浏览

博客学习资料

http://blog.csdn.net/jaccen2012/article/details/50301707 机器学习(Machine Learning)&深度学习(Deep Learning)资料(Chapter 1)http://jacoxu.com/?p=1139 计算机IT求职学习Listhttp://diducoder.com/帝都码农http://www.tuicool.com/articles/vEv6Jz6 Ubuntu14.04搭建ELK日志分析系统http://