html - CSS Angular 一个div

Question

我在另一个 div 中有一个 div，我正在尝试调整 div 的 Angular ，以便左侧接触左侧，右侧接触顶部。与 CSS 有什么关系？

这是我的代码:

.background { 
    background-color:black; 
    height:368px; 
}

.sold { 
    background-color:red; 
    font-size:26px; 
    width:200px; 
    text-align:center; 
    height:40px; 
    color:white; 
    line-height:40px;
}

<div class="background">

<div class="sold">Sold Out</div>

</div>

这是我的 jfiddle:http://jsfiddle.net/vakcgvtu/

Answer 1

您可以为此使用transform:

.background {
    background-color:black;
    height:368px;
    position: relative;
    overflow: hidden;
}
.sold {
    background-color:red;
    font-size:26px;
    width:200px;
    text-align:center;
    height:40px;
    color:white;
    line-height:40px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 37px;
    left: -43px;
    position: relative;
}

<div class="background">
    <div class="sold">Sold Out</div>
</div>