float:左变换:在div之间旋转自由空间

时间:2016-12-22 19:52:43

标签: html css3 rotation transform

是否可以在旋转的文本上绘制灰色框?我可以通过相对移位来做到这一点,但随后转移的div将会移动到新的一行。



#specSZ {
  position:relative;
  top:75px;
  left:-70px;
  transform: rotate(-90deg);
  float:left;
  width:190px;
}
.specBox {
  left:-100px;
  width:190px;
  height:190px;
  background-color:silver;
  float:left;
}

<!DOCTYPE html>

<body>
<div id="specSZ">ТЕКСТ</div>
<div class="specBox">
  <span>ТЕКСТ</span>
</div>
<div class="specBox">
  <span>ТЕКСТ</span>
</div>
<div class="specBox">
  <span>ТЕКСТ</span>
</div>

</body>
</html>
&#13;
&#13;
&#13;

0 个答案:

没有答案