发表于: 2021-03-05 00:06:18
1 1030
今天完成的事情:
学习了chrome开发者工具
1.elements可以查看页面的所有元素
style可以查看对应元素的css样式,其中toggle element state可以设置元素的状态,new style rule可以新增一个样式,在样式中可以直接编辑修改页面渲染或者临时去除某个样式
2.sources可以看到页面加载的所有文件,包括html,css,js,img,可以对js进行断点
3.network查看页面发出请求的,过滤器中XHR可以筛选AJAX请求
4.application中存放了浏览器的一些数据,其中session storage会在窗口关闭时清除
5.console 可以在里面运行脚本,或者输入某个参数值
完成了任务1
学习了3种处理滚动条挤压空间的处理方式
1.针对chrome浏览器可以设置body的overflow:overlay,即滚动条悬浮不占用页面空间
2.利用vw和cale()函数设置bodymargin-right为calc(100% - 100vw)可以自动补偿滚动条宽度
3.使用absolute方法保证body宽度
明天计划的事情:
viewport知识内容理解,修改外联css样式,搭建git和svn,上传代码
遇到的问题:
滚动条挤压页面空间导致div排列变化
收获:
解决滚动条挤压页面
评论