发表于: 2018-12-25 23:59:25

1 916


今天完成的事情:年底,略忙,好久没好好写了,快忘了。。。断断续续写完了任务13,还差一个侧边栏。
明天计划的事情:继续写任务13中的侧边栏,以及预习下一个任务点。
遇到的问题:1.在使用sass继承时,发现A类继承的如果是B类的话,则B类内嵌套的子类会和A类内嵌套子类用逗号相组合,共用B类内嵌套的子类属性,所以换成了占位符%来写公共的属性,再应用到A类和B类。2.在写注释的时候,发现sass报错Error: Invalid GBK character "\xE7",百度后才知道可以在scss文件第一行添加@charset “utf-8”;。
收获:

1.关于对BEM的理解:
    B,也就是块,是个模块,父级标签,可能是包含按钮的导航栏、包含有功能元素的父级元素等等,例子:header,container,menu,checkbox,input,换句话说就是房子的墙(外墙)。
    E,也就是元素,常常用于功能元素,比如input之类的,例子 menu item,list item,checkbox caption,header title,换句话说就是房子的墙(承重墙)。
    M,也就是修改,在原有的基础上再来改变外观或行为(覆盖),例子 :disabled,highlighted,checked,fixed,size big,color yellow,换句话说就是房子的墙(隔断墙)。

如果发现结构太深,这导致不必要的长类名,你可能需要定义一个新的组件,而不是一味的走到黑。

2.这三个页面的css我把它们归纳到一个样式表,这样就少了请求数量。在css的命名方面采用了BEM方法来命名,可读性相对于之前有些提升。之前想这个元素如果只是用了单个属性且重复性搞得话,就直接上原子类了,但回头一想这样感觉会增加繁琐,所以直接在sass上弄些公共的占位符,其中包含了公共属性,到时候那个类有相同的属性就直接拿来继承了。



返回列表 返回列表
评论

    分享到