html - 旋转标题 CSS3

Question

您好可信赖的 StackOverflow 用户，

我正在创建一个示例网页，并且想知道如何在 css3 中延长延伸到页面之外的旋转标题。如有必要，我可以提供更多代码。我会展示一张我正在寻找的图片，但没有积累足够的代表(刚刚获得足够的代表来展示图片)......提前感谢您的帮助!

这是我想要的:

'h4' 是我试图延长的 header ，这是我现在正在做的事情:

h4 {
    color: #fbff00;
    background-color: #858585;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    float:left;
    text-align:center;

    -webkit-box-shadow: 0px 0px 10px #d1cfd1;
    -moz-box-shadow: 0px 0px 10px #d1cfd1;
    box-shadow: 0px 0px 10px #d1cfd1;
   }

-内特

Answer 1

是否this接近你想要的？

思路是:

• 为标题指定一个明确的像素宽度(以管理其“大小”)
• 给它一个负的左边距，让它紧贴左边缘(数量取决于给定的宽度)
• 给它一个正的左填充，让文本自然定位(也取决于给定的宽度)