某跳动面试官：实现一下单个div一半红一半蓝叭。

注意点：
1.只能使用一个div标签，也就是不能嵌套标签，
2.左边一半为红色，右边一半为蓝色。

代码

        /* border边框 */
        .color {
            width: 0px;
            height: 100px;
            border-left: 100px solid red;
            border-right: 100px solid blue;
        }

        /* 渐变 */
        .color1 {
            width: 200px;
            height: 100px;
            background: linear-gradient(to right, red 0%, red 50%, blue 50%, blue 100%);
        }
        
        
        <div class="color"></div>
        <br>
        <div class="color1"></div>

效果

还有什么实现方式嘛？欢迎大家留言哒。

记录记录！