它是一个短的时间前端。在CSS领域,我们走得越久越远,我们看到的技能和知识是我们永远不会忘记的。CSS体系结构不同于人与人,因为项目的规模而不是最优的。




前言
前有短时间,CSS在这方面是越来越远了,回头看,有很多的知识和技能将不会被忘记,如无图片实现三角形,即实现半透明效果等等;但有些东西是在时间的实际需要和项目起来,然后,墙壁,然后总结,慢慢的找到自己的路,然后按照这个方法去发展,有一个乘数效应。本文属于后者。因为它是整个CSS的总方向。对于初学者或缺乏实践经验的项目学生,建议不要过于介意。他们可以跳过或离开问题。经验丰富的老将也可能有一个小Tucao,感觉不同于你。但我想说的是,CSS结构因项目的规模不同而不同,这不是最佳的,只有合适的。

从语义学开始
看到CSS禅园这种好书会发现,打开将涉及到HTML的语义。什么是HTML的语义事实上,HTML只是几个标签。表标记用作制表符、p标记、段落、h标记,而不是除A之外的所有HTML页面。必须指出,XHTML在定义标记方面有一些限制,因此在HTML5中添加了许多结构标记。从这个角度来看,HTML语义也是非常重要的,它已经被确立为一个规范。

为什么要实现HTML语义
严格地说,这是到最后一段的长度,它之所以单独出来,是因为它与本文的目的密切相关,但现在仍然不能说,不是猜测,但如果这一次,很难说出,我们将看雾。如果你有耐心,继续寻找,你就会明白。

图形和文学---我的CSS体系结构概念




(图1)




(图2)

图1是当前项目的CSS目录结构。图2是一个图,我切断了MindManager,和两个图将有助于下面的文章。从图2。
1,CSS一般图书馆(全球。CSS):样式表可以用在所有的网站,只要它是一个网站,你可以导入的样式表。它涉及到CSS的各个方面,如CSS重置CSS布局样式,字体,大小,边缘对齐,通用的CSS库对CSS样式分离原则的直接体现(风格相结合的原则,要在这里说的是两个复杂的概念,分离式有另外的空间来解释,需要一个很好的理解却仍然存在,并有时间来看看专家张欣旭的博客职位:前CSS样式和CSS样式分离,结合模块化。我的CSS一般的图书馆和互联网上的一样。如果你需要,你可以找到它直接在张欣旭的相关文章。以下是依恋我的CSS总库截图:



2。网站通用的CSS(ktv_style。CSS):样式表如下方式组成原理,什么风格可以把样式表是整个网站的通用模块,如网站一般文本和链接文本颜色、顶部导航、边框线、一般标题、站点底部、评论功能模块等,样式表是相互关联的,改变了风格,所有页面都是变化的,所以在这种风格下应该小心。
三.单页面的CSS(网页目录的所有样式表):像指数。CSS的网页样式表,每一页都是独立的,这样的目的是为了解决因重命名风格冲突的问题,这个问题将越来越突出的项目更大的和更复杂的页面结构。在不同的样式在页面上调用,即使HTML页面是同样式的命名没有冲突的问题。
4。所使用的插件是CSS:这个目录中使用的CSS基本上是js插件引用的相关样式表。它独立于文件夹,便于维护。
以上4点一般阐明了我的CSS体系结构。如果我非常仔细地解释,就会有许多事情要说,例如前两个点提到的模式分离和组合原理。如果我们不完全理解这篇文章,我们建议先阅读相关文章,文章到目前为止吗答案是否定的。

模块化你的样式表
从这里,我们可以讨论如何使HTML语义化。
你有写div、定义样式名、给div写另一个标签、定义样式名、然后把它写在相应的CSS上的习惯吗!但我不认为这是一个好办法:
1,你必须花很多精力思考风格的命名。这是一件令人讨厌的事。
2。放弃这种模块化的处理样式表,你会拥抱HTML语义原则。这不是一个错误的话,请下。

如何模块化样式表
模块的含义:在我的理解中,模块是一组功能相似或相近的业务逻辑,让用户看到这些元素应该放在一起;



这样的模块包括:标题栏,简单列表。
此模块的微博客的处理代码可以通过Firebug本身看。这相当复杂。如果我列出这个模块的代码,它是非常简单的。

复制代码代码如下所示:

可能感兴趣的人



寻找某人。

更多


如果你能明白我为什么写这看你,是每一行代码,包括风格命名的。我不是说在微博客前是不好写,因为根据项目做出相应调整的前端代码,后台数据显示,但如果你只是做前端的写作第一次写代码,应该足够简单和清晰的语义。上面的HTML代码,你可以设计你自己的风格:

复制代码代码如下所示:
friend_love H2 { }。
friend_love UL { }。
friend_love EM { }。
friend_love跨度{ }。
。friend_love更{ }。

你也可以在样式表中注释: / * * / friend_love;
如果你需要在另一个页面上调用这样一个模块,你可以很好地复制,所以一个模块,两种样式,你仍然担心命名吗也许他们的元素只需要填写浮动:左的风格,那么恭喜你,你需要写这种风格都没有,在结构上直接调用global.css风格:为什么标签FL,请在左浮动式的global.css定义。

正如我之前说过的,由于项目的规模,CSS体系结构各不相同。我没有理由让你采用这种做法,我尚未核实是否成熟或合理。这只是个人的感觉,它可以使用,这也是很好的使用和吸引砖和玉。