如何制作星球大战介绍形状的文本区域？答案

【问题标题】：How do I make a Star Wars introduction shaped textarea?如何制作星球大战介绍形状的文本区域？
【发布时间】：2014-01-11 03:29:30
【问题描述】：

通常，textareas 只是无聊的老长方形：

但是有可能制作一个形状像星球大战介绍的文本区域吗？

**注：灵感来自SO #20734620: unusual shape of a textarea——参见 cmets。*

更新：感谢 Niet the Dark Absol，我能够让它工作。只需要玩字体和颜色。

textarea {
width:600px;
height:500px;
transform:perspective(1000px) rotateX(45deg);
display:block;
margin:0 auto;
text-align: center;
line-height:200%;
color: yellow;
background-color: black;
font-size: 1.75em;
}

【问题讨论】：

这个问题是SO #20728150 的逐字副本，一直到原始帖子中蔬菜水果商的撇号。唯一的区别是标题、图像和预期效果。一个非常仁慈的解释是，您的意思是它是原始问题的后续问题；如果是这样，您可能只是承认这一点，而不是大量复制它并暗示那里的 cmets 巧合。 :(
@wormtown 在 StackOverflow 上“激怒别人”非常非常。如果您认为帖子有轻微可能会激怒某人，则帖子可能会在一个小时内关闭或删除。
@RyanCarlson 我一定会记住这一点。谢谢。
@wormtown 这可以理解；从您对另一个问题的评论中，您并不清楚这是为了致敬还是模仿。我认为投票关闭的任何人都没有试图成为杀人狂或反动者，所以如果你在问题中解释它可能会重新开放？
没问题。就像@Ryan 说的那样，在这里（或者实际上，在整个互联网上）很容易激怒羽毛，听起来你只是试图做出善意的致敬尝试，结果有点平淡。很容易做到！ :)

标签： javascript jquery html css

【解决方案1】：

尝试 3D 变换：

#starwarstextareaofawesome {
    width:600px;
    height:500px;
    transform:perspective(1000px) rotateX(45deg);
}

Demo

【讨论】：

我想出了同样的答案。他是一个带有 div 的演示：jsbin.com/oteJIru/1/edit?html,css,output
滚动速度应该与任何其他带有滚动条的元素相同。你想如何滚动它？
@yitwail 是的，但你必须投入整个团队。
愿原力与我们同在
@yitwail 至少不会损坏。你只会有一个普通的文本区域。