CSS ´¹Ö±¾ÓÖÐ
1.ͼƬµÄ´¹Ö±¾ÓÖÐ
.box
{
/*·ÇIEµÄÖ÷Á÷ä¯ÀÀÆ÷ʶ±ðµÄ´¹Ö±¾ÓÖеķ½·¨*/
display: table-cell;
vertical-align: middle; /*ÉèÖÃˮƽ¾ÓÖÐ*/
text-align: center;
/* Õë¶ÔIEµÄHack */
*display:block;
*font-size:175px;/*ԼΪ¸ß¶ÈµÄ0.873£¬200*0.873 ԼΪ175*/
*font-family:Arial;/*·ÀÖ¹·Çutf-8ÒýÆðµÄhackʧЧÎÊÌ⣬Èçgbk±àÂë*/
width:200px;
height:200px;
border:1px solid #eee;
}
.box img
{
/*ÉèÖÃͼƬ´¹Ö±¾ÓÖÐ*/
vertical-align: middle;
}
<div class="box">
<img src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" mce_src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" />
</div>
²Î¿¼ÎÄÕ£º
http://www.planabc.net/2008/05/26/img_vertical_center_solution/
http://www.student.oulu.fi/~laurirai/www/css/middle/
Ïà¹ØÎĵµ£º
ǰÑÔ£ºCSS²¼¾ÖÓ봫ͳ±í¸ñ(table)²¼¾Ö×î´óµÄÇø±ðÔÚÓÚ£ºÔÀ´µÄ¶¨Î»¶¼ÊDzÉÓñí¸ñ£¬Í¨¹ý±í¸ñµÄ¼ä¾à»òÕßÓÃÎÞɫ͸Ã÷µÄGIFͼƬÀ´¿ØÖÆÎIJ¼¾Ö°æ¿éµÄ¼ä¾à£»¶øÏÖÔÚÔò²ÉÓòã(div)À´¶¨Î»£¬Í¨¹ý²ãµÄmargin,padding,borderµÈÊôÐÔÀ´¿ØÖưæ¿éµÄ¼ä¾à¡£
(Ò») CSS2ºÐÄ£ÐÍ
ºÐÄ£ÐÍÖ÷Òª¶¨ÒåËĸöÇøÓò£ºÄÚÈÝ(content)¡¢±ß¿ò¾à(paddin ......
jsûЧ¹û:Èç¹ûÔÚÒÔUpdatePanelµÄ·½Ê½µÄ¾Ö²¿»Ø´«ÖУ¬ÆÕͨµÄJavascript´úÂëÔÚÕâÖÖ¾Ö²¿»Ø´«ÖоͲ»»áÔÚ´¥·¢ÁË£¬¾Í±ØÐëʹÓÃscriptmanager.RegisterClientScript·½·¨£¨ÔÚ<form>ºóÃæ×¢²á<script>£©ºÍscriptmanager.RegisterStartupScript·½·¨£¨ÔÚ</form֮ǰע²á<script>£©
ÔÚÄãµÄÓû§¿Ø¼þµÄºó¶ËµÄij¸öºÏÊÊÎ ......
ÓÃcssʵÏÖÍøÒ³±³¾°½¥±äµÄ´úÂëÈçÏ£º
Ò»¡¢´ÓÉÏÍùϽ¥±ä
Example Source Code [www.mb5u.com]
body{
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);
}
¶þ¡¢´Ó×óÉÏÖÁÓÒϽ¥±ä
Example Source Code [www.mb5u.com]
body{
FILTER: Alpha( style=1, ......
Ê×ÏÈÊÇHTML´úÂë:
<div id="outer">
<div id="leftFrame" style="width: 20%;">
<div style="height: 30%" id="packageListFrame" title="All Packages" >
Package list goes here
</div>
&n ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<!-- www.div-css.com ÍøÕ¾±ê×¼»¯ 2007-4-16 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
......