前面章节方法论,从本章节开始实践。
布局中的层级关系,主要体现在主干结构、栅格结构、组件模块结构三部分,本篇讲主干结构。
主干结构按级别分成“站点”和“页面”,即site
和page
。如电商或门户站点,站点有统一的头尾、悬浮挂件,站点有很多不一样的子站和栏目。
站点主干结构
1
|
<div class="site__topbar">
|
页面主干结构
1
|
<div class="page">
|
class="site__*" 、class="page__*"
作为主干结构部分,不声明 border, margin, padding, float
等样式属性,主干结构主要用来表意,做各页面进出切换效果,节假日、做促销活动时可以挂个情景背景。
(本篇结束)
许可协议:自由转载-保持署名-非商业性使用-禁止演绎 (CC BY-NC-ND 4.0)
By 小可 from https://xinlu.ink/tech/pro-web-reconstruction-8-tree-trunk.html