发表于: 2017-05-26 22:11:16
1 876
今天完成的事情:
上午编写完首页的四分之三,下午完成首页主体的静态页面的代码,开始编写找职位顶部轮播图,侧导航栏和顶部搜索框,目前轮播图已经完成,侧导航栏显示部分完成,需要hover或者点击再显示的自列表导航栏没有开始,搜索框基本完成,搜索框中的按钮底色和提示文字目前还没有完成。整体稍晚于今天的计划。
明天计划的事情:完成今天余下的找职位的顶部导航栏和搜索框的代码,开始找职位其他页面的静态效果代码,搜索公司静态页面效果。
遇到的问题:
昨天轮播图位置的问题,找到了两侧导航按钮位置的调整方法,通过调整宽度可以完成需要的效果。对轮播图的宽度写死,居中,调整了标题的div层次,尽量减少嵌套。
今天在服务模块浪费了一些时间,开始使用栅格系统,但布局出来以后和ui图不一致,中间的飞机logo也没办法按要求显示出来。最后推倒重来,自己按ui图写,不用栅格系统了。布局出来后,在添加飞机logo时有出现了问题,由于卡片和飞机logo的父级div都是设置成inline-block,设置vertical-align: middle,飞机logo是按卡片下方的文字进行对齐的,去掉垂直居中也没有其他方法实现飞机logo的居中显示,没有使用grid布局。试了有段时间,最后是使用vertical-align: bottom,配合设置计算好的高度进行实现的。虽然效果达到了,但是感觉还是方法上有些问题,目前就这样了,以后想到解决方法再处理。还有飞机logo前后————的设置,原来直接这样键盘输入就可以,自己以为很麻烦呢!
收获:对轮播图的嵌套关系和结构样式有了更清楚地的认识,对于display:inline-block情况下的处置更有想法,知道可能哪些地方可能出现问题,并朝这个方向进行研究,一般可以很快解决。
评论