涓嬮潰鏄湅鍙嬪彂缁欐垜鐨勯樋閲屽反宸碪ED鍓嶇寮鍙戠殑缃戜笂娴嬭瘯棰橈紝鎰熻寰堟湁鎰忔濓紝鎶婃垜鎵鍐欑殑绛旀璐村嚭鏉ュ垎浜竴涓嬶紝涓昏棰樼洰涓4閮紝绗竴涓槸涓浜涜亴涓氬彂灞曞惧悜鐨勫績鐞嗘祴璇曪紝璺宠繃涓嶈锛岀劧鍚庢槸涓閬揅SS甯冨眬棰樼洰锛屾瘮杈冪畝鍗曪紝涓嬮潰缁欏嚭棰樼洰瑕佹眰锛
鎴戝垪鍑烘垜鐨勪唬鐮侊細
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<meta http-equiv=”x-ua-compatible” content=”ie=7″ />
<meta name=”author” content=”XiaoJue”>
<title>鐢–SS瀹炵幇甯冨眬</title>
<style>
*{margin:0px; padding:0px;}
div{background:#CDD8DA;}
.left_t,.left_d{width:90px;}
div.left_t{height:152px;}
div.left_d{height:117px;margin-top:10px;}
div.main{width:217px;height:279px;left:100px;top:0px;position:absolute;}
</style>
</head>
<body>
<div class=”left_t blow”>a</div>
<div class=”left_d”>b</div>
<div class=”main blow”>c</div>
</body>
</html>
浣跨敤浜嗙粷瀵瑰畾浣嶅拰涓涓笅杈硅窛锛岃繖涓洜浜鸿屽紓浜嗭紝3涓爣绛炬瀯寤哄竷灞锛屼綘鍙互鍐欏叏灞忓箷鐨勭瓑绛夌瓑绛夛紝浣嗘槸鎴戝仛鐨勬槸鎸夌収瀹冪粰鍑哄浘鐗囩殑鏍峰瓙锛岃繘琛岀殑甯冨眬銆
涓嬮潰涓閬撴槸JS闂锛屾瘮杈冩湁鎰忔濓紝涔熸槸鐫閲嶈涓涓嬶紝鐪嬮鐩姹傘
鍏抽敭瀛楀皝瑁呫傚鐢ㄣ傛彁绀猴細鍙互浣跨敤浠讳綍寮婧愪唬鐮併備篃灏辨槸妗嗘灦搴撲簡銆
鎴戜负浜嗗揩閫熷疄鐜帮紝閫夋嫨浜嗘渶鐔熸倝鐨刯query锛屼负浜嗕綋鐜板皝瑁呭拰澶嶇敤锛岄夋嫨浜唈query鐨勬彃浠舵満鍒舵潵杩涜灏佽鍜屽鐢ㄣ
涓嬮潰鏄唬鐮侀瑙堝湴鍧锛
http://www.designsor.com/demo/albb.html
鍏蜂綋浠ｇ爜鍙互鏌ョ湅杩炴帴閲岀殑椤甸潰婧愪唬鐮侊紝瀹炵幇鏂规硶鏈夊緢澶氾紝鍦ㄤ笉鍋欻TML椤甸潰淇敼鍜屼笉褰卞搷鎵鏈夊叾浠栦笢瑗跨殑鍓嶆彁涓嬶紝浣跨敤浜咼S鏉ュ疄鐜拌姹傦紝鍏煎FF/IE锛屽叾浠栨病鏈夋祴璇曪紝浣嗘槸鎵鏈夋柟娉曞潎鏄痡query鐨勬柟娉曪紝鎵浠ュ吋瀹规т及璁″簲璇ュ彲浠ヤ繚闅溿
灏佽涔嬪悗鐨勮皟鐢ㄤ唬鐮佹牱渚嬶細
$(function(){
$(‘.blow’).jblow({“b_size”:25}); //璋冪敤灏佽鐨勬柟娉曪紝鍙娆¤皟鐢ㄤ笉褰卞搷HTML缁撴瀯
})
HTML锛
<body>
<div class=”left_t blow”>a</div>
<div class=”left_d”>b</div>
<div class=”main blow”>c</div>
</body>
濂戒簡锛屾渶鍚庣粰鍑洪潰璇曢鍦板潃锛
