发表于: 2020-05-22 21:51:04

1 2070


今天完成的事:

1.

        html,
        body {
            height: 100%;
            width: 100%;
        }

positionabsolute;

可以使div100%占用

2.

vertical-align

margin-bottom

的关系与区别:二者作用相似;vertical-align会增加容器的高度,而margin-bottom负值则是减小

资料地址:https://www.zhangxinxu.com/wordpress/2012/07/bottleneck-css-study/

3.css代码规范


完成了任务5基本布局,不过关于中间的背景图还没设置好


遇到的问题:

1.感觉切图有问题,尝试将头像切成圆形,不过切片工具只能切成方形,切图不是很会

2.背景图大小有问题,背景图可以使用

background-sizecover;

放大解决,但头像图与背景图大小不合

3.背景图不设置高度不会显示,已经解决

4.一开始“专业技能”下面的代码每个都设置分别的类选择器,多而杂乱,看的眼花。后来将以下

        <div class="row3">
            <div>从业年限</div>
            <p>|</p>
            <div class="black">0~3年</div>
        </div>
        <div class="row3">
            <div>工作时间</div>
            <p>|</p>
            <div class="black">全天</div>
        </div>
        <div class="row3">
            <div>服务价格</div>
            <p>|</p>
            <div class="red">25元/小时</div>
        </div>
        <div class="row3">
            <div>自我介绍</div>
            <p>|</p>
            <div class="black">可以洗衣做饭照顾老人,可以洗衣做饭照顾老人,可以洗衣做饭照顾老人,可以洗衣做饭照顾老人,可以洗衣做饭照顾老人
            </div>
        </div>

分为一类,用10几行就完成了样式布局


明日的计划:

完成背景图的设置

将代码检查并规范化,尽量去掉无效代码


返回列表 返回列表
评论

    分享到