美文网首页
HTML实现简单的春联效果!

HTML实现简单的春联效果!

作者: DragonersLi | 来源:发表于2017-08-15 19:16 被阅读42次

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>春联</title>  
</head>

<body>
<style>
.font{ font-family: 隶书; font-size: 36pt; color: #000000; font-weight: bold; 
               background-color: #FF0000 }
.font1{ font-family: 隶书; font-size: 36pt; color: #000000; font-weight: bold }
-->
</style>

<div style="position: absolute; top: 80; left: 217; width: 320; height: 386; font-size: 240pt; color: red">◆</div>
<div style="position: absolute; top: 152; left: 292; width: 160; height: 160; font-size: 120pt; font-family: 隶书">春</div>
<div style="position: absolute; top: 10; left: 120; width: 527; height: 388">
  <table border="0" cellpadding="0" cellspacing="0" width="527" height="231">
    <tr>
      <td height="21" width="46"></td>
      <td height="21" width="449">
        </td>
      <td height="21" width="51"></td>
    </tr>
    <tr>
      <td height="211" width="46" align="center" class="font">
        <p align="center">
        学<br>
        海<br>
        无<br>
        涯<br>
        勤<br>
        可<br>
        渡</td>
      <td height="211" width="449" align="center"></td>
      <td height="211" width="51" align="center" class="font">
        书<br>
        山<br>
        万<br>
        仞<br>
        志<br>
        能<br>
        攀</td>
    </tr>
  </table>
</div>

</body>
</html>



Paste_Image.png

相关文章

网友评论

      本文标题:HTML实现简单的春联效果!

      本文链接:https://www.haomeiwen.com/subject/dpmmrxtx.html