[成都|内门弟子]CSS-何俊|2020年06月01日的日报-技能树.IT修真院

发表于： 2020-06-01 21:16:24

1 1244

今天完成的事：

1.重做任务6，下拉菜单部分全部重做，由ul.li的无序列表改成div.select

                <div>
                    <select class="center">
                        <option value="" class="a">食宿</option>
                        <option value="">500/月</option>
                        <option value="">1k/月</option>
                    </select>
                </div>

通过弹性盒子

                display: flex;
                justify-content: center;
                align-items: center;
                text-align: center;

将3个下拉菜单设置为一行100%宽的样式

左右两个边框通过将select高度设置较小于大盒子宽

            .navbar {
                height: 5rem;

            select {
                height: 4rem;

使select的border不占满边框

2.完成任务7 版本选择部分

百度查得此代码可以设置小三角样式

            .dot-right {
                font-size: 0;
                line-height: 0;
                border-width: 10px;
                border-color: red;
                border-right-width: 0;
                border-style: dashed;
                border-left-style: solid;
                border-top-color: transparent;
                border-bottom-color: transparent;