screen.width*0.7) {this.resized=true; this.width=screen.width*0.7 this.alt= ' Click here to open new Window\nctrl+mouse Wheel to zoom in/out ';} ' Border=0>
function:
1. The picture can be scaled, and the outer frame changes.
2. Image scaling, bottom alignment.
3. The mouse slides up and the border has dotted lines.
structure:
screen.width*0.7) {this.resized=true; this.width=screen.width*0.7 this.alt= ' Click here to open new Window\nctrl+mouse Wheel to zoom in/out ';} ' Border=0>
Source code:
<!--================================================================== General XHTML 1.0-main Style sheet- Design 2007-05-18 Author-ouhee made by album Adaptive Writing ================================================================= =--> <! 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" > <pead> <meta http-equiv= "Content-type" content=; Charset=utf-8 "/> <meta name=" description "content=" Mapbar "/> <meta name=" keywords "content=" Mapbar "/> <meta name= "Author" content= "www.mapbar.com"/> <meta name= "robots" content= "All"/> <title> album adaptation </title> <style type= "TEXT/CSS" >/* ================================================================== General XHTML 1.0-main Style sheet-liquid design 2007-05-18 Author-ouhee Backa made by album Adaptive notation ================== ================================================ * * {margin:0px;padding:0px;font-size:12px;list-style:none;float:none;font-weight: Normal Color: #727272;} html,body {height:100%;background: #fff;} Body {text-align:center;margin:0px;padding:0px;background: #fff;} Body > Div{text-align:center; margin-right:auto; margin-left:auto;text-align:left;} Div,form,img,a img,ul,ol,li,dl,dt,dd{border:0px; text-align:left;} H1,h2,h3,h4,h5,h6,p{text-align:left;} table,td,tr,th,br{font-size:12px;} Img{vertical-align:middle;} Strong{font-weight:bold;} . Clear {clear:both;overflow:hidden;width:1px;height:1px;margin:0px-1px-1px 0px;border:0px;padding:0px;font-size: 0px;line-height:0px;} A{font-size:12px;color: #2d94ff;} A:link{text-decoration:underline;} A:visited{text-decoration:underline;} A:hover{text-decoration:none;color: #fe7bb9;} . sideblock{float:left;width:150px;height:150x;padding:10px 0px;text-align:center;border:1px solid #fff; margin : 10px;} . Sideblock P{height:24px;line-height:24px;text-aLign:center;} . sideblock table{margin-bottom:3px;margin:0px Auto; . sideblock table td{height:125px; . Sideblock. T2{background:url (http://hiphotos.baidu.com/ouhee/pic/item/ce38fdcdfae7c9540eb34552.jpg) repeat-x Right top;} . Sideblock. B2{background:url (http://hiphotos.baidu.com/ouhee/pic/item/2c0860cbea2ba51abf09e652.jpg) repeat-x Right bottom;} . Sideblock. t1{height:6px;font-size:6px; . Sideblock. M1{background:url (http://hiphotos.baidu.com/ouhee/pic/item/800911461372e90c6a63e552.jpg) repeat-y # FFF;} . Sideblock. M2{background:url (http://hiphotos.baidu.com/ouhee/pic/item/6ce9cf074a94b1c87a894752.jpg) repeat-y top right;padding:2px 9px 3px 20px;} . sideblock. m2 img{vertical-align:top; . Sideblock. b1{height:7px;font-size:4px; . Sideblock. b1 img{vertical-align:top!important;vertical-align/* */:bottom; . bordercolor{border:1px dashed #000;} /* Border slide over color/bordercolornone{border:1px solid #fff;} /* Border sliding color/</style> <script> function g_b_ccn (obj, AddClass, DELCLass) {var addReg = new RegExp ("\\b" + addclass + "\\b"); var DelReg = new RegExp ("\\b" + Delclass + "\\b"); Obj.classname = Obj.className.replace (DelReg, "); if (!obj.classname.match (AddReg)) {if (Obj.classname!= "") Obj.classname + = ("" +addclass); else obj.classname + = AddClass; } </script> </pead> <body> <div class= "Sideblock" onmouseover= G_B_CCN (This, ' bordercolor ' , ' Bordercolornone '); "onmouseout=" G_B_CCN (This, ' bordercolornone ', ' bordercolor '); " > <table width= "100%" border= "0" cellspacing= "0" cellpadding= "0" > <tr> <td al ign= "center" valign= "Bottom" > <!--1-top border--> <div class= "T2" > <!--2 levels-bottom border--> <div class= "B2" > <!--3-top border-left picture--> <div class= "T1" ></div> <!--3-center left border--> <div class= "M1" > <!--4-middle content right border--> <div class= "m2" > </div> </div> <!--3-bottom border-left picture --> <div class= "B1" > </div> </div> </di v> </td> </tr> </table> <p> Bottom bottom margin </p> <p> bottom edge </p> <p> ; bottom edge </p> </div> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
