发表于: 2021-04-12 20:41:51

1 961


今天完成的事情:任务十三完成,任务十四制作自己的组件库(进行中)。

明天计划的事情:任务十五进行,知识总结。

遇到的问题:组织自己的组件库方向不明确,个别网页样式的代码不熟。
收获:

sass制作CSS架构:任务中三个页面通用的一些样式和属性,写到一个sass文件内,然后引用。

下面为任务十三通用的样式,和一些架构。

htmlbody {                             /CSS默认属性重置/
    margin: 0;
    padding: 0;
    height: 100%;
    min-width: 370px;
    background-color: rgb(240240240);
}                                              
header{                                 /任务中三个页面通用的一些属性和结构/
    position: fixed;
    top: 0;
    z-index: 99;
    display: flex;
    justify-content: space-between;
    width: 100%;
    background-color: rgb(105210235);
}
.header-top {
    padding: 10px 0;
}

footer.fixed-footer {                 /任务三个网页页面通用的属性值/
    position: fixed;
    bottom: 0;
}
.gap.bottom-l.bottom-rlabel.activespan.wrapper.span-two.box-l {
    display: inline-block;
}
span.box-top.span-two {
    background-repeat: no-repeat;
}
.bottom-l.bottom-r.form.center-llabel.bottom.box-top {
    text-align: center;
}
.form.center-l.active {
    border: 1px solid rgb(219219219);
}

制作自己的组件库,目前自己需要的样式,属性,都汇总到自己的组件库中。

设置基础CSS重置和基础样式,

设置全局需要依赖的样式:变量、颜色、度量等。

网格布局(介入的媒体查询)使页面在不同宽度下的不同样式。



返回列表 返回列表
评论

    分享到