<link type="text/css" href="https://www.jb51.net/jquery.imgareaselect-0.9.10/css/imgareaselect-default.css" /> <br><script type="text/javascript" src="https://www.jb51.net/jquery.imgareaselect-0.9.10/scripts/jquery.imgareaselect.pack.js"></script>
2、下载的插件里有三个样式表
imgareaselect-default.css – 这是默认的样式表,
imgareaselect-animated.css – 这个样式与默认的样式表基本是一样的，只是它能够让选择区域边框变化
imgareaselect-deprecated.css – 只有你想使用不赞同的选项时才用这个样式表。
你只需要在html头部将其中的一个样式表添加进来就可以。这css文件夹中还包含４张gif图片，它们是用来显示边框的。
3、元素分布如图所示
此插件通过创建几个div元素来表示选择区域，包括边框、可调整手柄以及未选择的区域。这些元素已经指定了特定的类名了，所以你可以通过CSS或者jQuery选择器来获得并操作它们。
其中的前缀"imgareaselect"是默认的前缀，可以通过"classPrefix"选项来修改。这在当有许多选择框需要分别操作（比如修改样式）的时候特别有用。
4、选项
用户在这个插件的很多方面都可以进行定制，用户通过插件选项来达到这个目的（这些选项会在插件初始化的时候起效）。这些选项包括：
选项 描述 aspectRatio 长宽比，以后在选择时候就会维持不变。 e.g. "4:3" autoHide 如果设为true，那么在选择完后区域会消失。 Default:false classPrefix 预先给插件元素的前缀（详见下面：５、元素与类） Default:imgareaselect disable 如果设置成true，这个插件将不起作用（但是图像还是可见的） enable 如果设置成true，这个插件又将重新起作用 fadeSpeed 若设置成大于零的某个数，将"渐隐/渐现"这个插件 Default:true handles 若设置成true，在改变大小的时候显示改变框（就是角点有些小"矩形"） Default:false hide 若设置成true，则隐藏选择框 imageHeight 图像的真实高度（因为有可能被CSS缩放过了） imageWidth 图像的真实宽度（因为有可能被CSS绽放过了） instance 若设为true，imgAreaSelect()函数会返回一个对选择区域图像的一个引用，以便能够进一步使用API。（详见８、API方法） keys 启用/关闭键盘支持（详见７、键盘支持） Default:false maxHeight 限制选择框（以像素为单位），设置最大、最小的高度、宽度。 maxWidth minHeight minWidth movable 设置是否支持选择框移动 Default:true parent 指定此插件默认所附加到的父元素 Default:body persistent 若设置成true，点击选择区域外将开始一个新的选项（换言之，是否让用户只能移动/缩放选择区域） Default:false remove 若设置成true，则该插件将完全移除 resizable 决定选择区域是否可以改变大小 Default:true resizeMargin 当选择区域宽度超过多少像素时将启用"可改变大小"模式 show 如果设置成true，选择区域将可见 x1 y1 初始化时选择框左上角的坐标 x2 y2 初始化时选择框右下角的坐标 zIndex