发表于： 2019-08-14 23:00:47
2 890
今天完成的事情：完成任务7的三个页面，并做部分修改
明天计划的事情：了解任务8的要求，整理开发顺序，并切图
遇到的问题：
1.添加音频播放功能，搜狗正常，但本地网页在chrome自动播放失败，但上传后在chrome又可以播放，未找到原因及有效方案
搜到的一种方案：在Chrome浏览器中输入chrome://flags/#autoplay-policy，然后在高亮的选项中，将Default换成No user gesture is required
但在我的chrome中无法搜到autoplay-policy
2.无法出现滚动条
设定滚动区域的高度，溢出后滚动，留意设置两个方向的溢出效果，x方向要隐藏，y方向滚动
3.滚动内容被遮挡
因为底部有固定定位的footer，需要用padding-bottom撑高滚动区域，防止被遮挡。
4.九宫格区域在拉伸的过程中会从一行三个变成两个，宽度设置还有问题，
后面设置单独一行3个方格，用flex方式排布，可以解决这个问题。
5.水民文字无法垂直居中
每个格固定22vh高度，再按比例分配高度给水民文字和号码，接着将水民div的行高与高度保持一致，即可垂直居中
6.每个玩家方块上，hover时出现4个操作选择，每个选择图的间隔太大
去除inline-block元素间间距，选择用负margin解决
收获：
1.多个页面，抽取常用样式
2.pre元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
3.常见形状的绘制：圆形/三角形
4.点击按钮可跳转页面的效果，用a包住button也可以实现
返回列表
评论