求助高手，想实现一个背景是四色球的效果，但是中间的文字一直无法按照正常的格式显示请问怎么改？

Question

背景是一个四色球，然后分两行显示文字

第一行是 我的

第二行是 名字

类似这样的

我的
名字

背景的这个球实现完了，请问文字怎么变成上面的格式，无法实现出来

<div class="circle fl">
                            <div>你的</div>
                            <div>名字</div>
                        </div>

.message-board .circle {
    border-radius: 10px; 
    border-style: solid; 
    border-width: 10px; 
    border-bottom-color: red; 
    border-left-color: green; 
    border-right-color: blue; 
    border-top-color: yellow; 
    height: 0px; 
    width: 0px; 
    /*批准*/ 

    -webkit-transform: rotate(45deg); 
    -moz-transform: rotate(45deg); 
    -ms-transform: rotate(45deg); 
    -o-transform: rotate(45deg); 
    transform: rotate(45deg);
    box-sizing: content-box;



}

Answer 1

你这个我不知道怎么改，我重新做了一个，不需要css3，请看链接：四色球效果