大家应该都知道，Html可以用代码画出很多很多形状，今天就来介绍一下Html怎样使用代码画出一个爱心吧！

<div style="width:50px;height:50px;position:relative;">
<div style="width:20px;height:50px;border-radius:50px 50px 0 0;background-color:#f00;transform:rotate(-45deg);position:absolute;left:15px;"></div>
<div style="width:20px;height:50px;border-radius:50px 50px 0 0;background-color:#f00;transform:rotate(45deg);position:absolute;right:15px;"></div>
</div>

代码看似很简单，但是用正确的代码协作是需要一定技巧的哟~！

那么，我们加上文字应该怎么搭配呢？先看演示。

<div style="position:relative">
<div style="width:50px;height:50px;position:relative">
<div style="width:20px;height:50px;border-radius:50px 50px 0 0;background-color:#f00;transform:rotate(-45deg);position:absolute;left:15px;"></div>
<div style="width:20px;height:50px;border-radius:50px 50px 0 0;background-color:#f00;transform:rotate(45deg);position:absolute;right:15px;"></div>
</div>
<p style="text-align:center">爱你到永远！</p>
</div>

如上，我们在爱心代码盒子上面套了一个大盒子，这个大盒子可以控制盒子的位置，而文字则可以轻轻松松随心布置在任何你想放的地方。

好了，爱心加文字代码又交给你们啦！