温馨提示:文本由机器自动转译,部分词句存在误差,以视频为准
00:00
在上次课程当中啊,咱们已经实现了点击这些商品参数之后的文字颜色排查效果。那本次课程呢,咱们将继续来完成绘制点击参数之后结果的布局,嗯,因为咱们还有上方点击之后结果的一个布局了,来咱们找到对应的一个位置之前呢,咱们已经留出来。位置了啊,来写到这选择之后结果的一个区域,给它写一个div叫做点。Truth,诶选择嘛,对吧,嗯,然后在这个truth里边呢,咱们需要来加上一个div,嗯,定一个名,咱们叫做mark标记,诶标记假设啊,咱们写上一个黑色。除了文字之后,发现旁边是不是还有一个叉对吧?诶几个叉啊,那这呢,我用一个A标签把herf给它拿掉,来上一个叉,好一共是四个,咱们先都给它复制粘贴1234啊,因为毕竟呢,这个位置里边的数据是咱们点击之后产生的,嗯,是咱们点击之后产生的啊来咱们现在只是为了来进行布局。
01:23
好,那么现在这个内容有了之后啊,我就需要来打开咱们的Les文件,找到对应的位置,把样式表给它填进去。前面写好的部分一样收起来,收起来,这儿呢是路径导航。嗯,这个是中间的左边整体收起来,然后右边的上半部分,嗯,下半部分在这儿了啊好在这儿。加上一个咱们的选择之后的区域。
02:00
嗯,把这个位置写一下啊,这是点choose。那么在点choose当中啊,有一个mark的标记,Mark里边呢,有一个A好结构写好了之后啊,咱们需要打开咱们的一个参数,在这个位置第七项,他说内容详情筛选,动态添加choose效果,诶,这也是为什么我这个div啊,咱们叫做choose的一个原因啊,Mark标签他说啊,高度为三十来吧,我们抄一下啊。在上边mark的高度为30像素,然后背景颜色no啊。边框border意像素实线ddd,嗯,内边距pading上下方向为零,然后左右方向为20。右外边距margin-RIGHT20像素,嗯。
03:02
好了,删除按钮呢在这儿,诶文字颜色是红色,左外边距margin-LEFT20,好,那么这个文字它里边的这个内容呢,肯定是需要上下左右居中的,所以咱们提前给它设置进来。打开之后咱们观察一下样式是出现了,但是有一点点的不太对劲,诶人家是啥呀,是这种浮动的效果对吗?嗯,浮动啊,我们还得再加一句话。加一个。Float left,嗯,加一个浮动啊,好,那么现在浮动好了之后呢,它的样式是OK了,但是对应下面的这个布局又影响到了,所以怎么着给这个choose是不是得加上一个fix,诶,清除一下咱们的浮动好了,那么现在这个布局咱们是不是已经做好了呢?那么后续的功能咱们将点击对应真实的一个商品参数,来把你选择的这个文字显示到对应的位置上面。
04:18
好了,本次课程呢,咱们就已经将布局实现完毕了。
我来说两句