jQuery是一个流行的Javascript库，通过它，开发人员可以快速实现各种交互效果和动画效果。本篇文章将介绍如何使用jQuery设计一个长方形，实现页面美化的效果。

首先，我们需要在HTML页面中添加一个容器，用于显示我们设计的长方形。代码如下：

<div ></div>

接下来，我们需要用CSS样式来设置这个容器的尺寸和背景颜色。代码如下：

.square {width: 200px;height: 100px;background-color: #ccc;}

现在，我们已经完成了长方形的基本样式设置。接下来，我们需要使用jQuery来给这个长方形添加一些动画效果。代码如下：

$(document).ready(function(){$(".square").hover(function(){$(this).animate({width: "400px",height: "200px"}, 500);}, function(){$(this).animate({width: "200px",height: "100px"}, 500);});});

上面的代码使用了jQuery的hover函数，当鼠标移动到长方形上时，执行第一个函数，当鼠标移开时，执行第二个函数。在这两个函数中，通过使用animate函数来实现长方形尺寸的动态变化。

通过上面的代码，我们已经成功的使用jQuery设计了一个长方形，给页面添加了一个美化效果。