SOURCE

<div class="box">
    <div class="box-item box-a">你</div>
    <div class="box-item box-b">的</div>
    <div class="box-item box-c">名</div>
    <div class="box-item box-d">字</div>
</div>

.box{
            position: relative;
            width:80px;
            height:80px;
            border-radius: 100px;
            overflow: hidden;
        }
        .box-item{
            position: absolute;
            width:40px;
            height:40px;
            line-height: 40px;
            text-align: center;
        }
        .box-a{
            top:0;
            left:0;
            background:red;
        }
        .box-b{
            top:0;
            left:40px;
            background:green;
        }
        .box-c{
            top:40px;
            left:0;
            background:blue;
        }
        .box-d{
            top:40px;
            left:40px;
            background:yellow;
        }