PHP側のプルダウンメニューは美しく、左右に展開可能、FF、IE_PHPチュートリアルをサポート-PHPチュートリアル-php.cn

/upload/20091015171901353.jpg
IE8必须增加子菜单、隐藏

复制代码代码如下:

//
mysql_select_db($database_lr, $lr);
$query_num="select count(*) from smallclass where bigclassid='$bigclassid'";
$rs_num=mysql_query($query_num);
$myrow_num = @mysql_fetch_array($rs_num);
$smallclass_num=$myrow_num[0];
if ($smallclass_num>0){
echo "id=arrow";
}
?>>
"クラス="ビッグクラスリンク" >
mysql_select_db($database_lr, $lr);
$query_small = mysql_query("SELECT * FROM smallclass where bigclassid='$bigclassid' 並べ替え順");
if ($smallclass_num==0)
{
echo "
- href=>
";
}
else
{
?>
- " class="smallclasslink">

CSS文例

复制代代码如下:

 
UL { 
PADDING-RIGHT: 0px;パディング左: 0px;パディングボトム: 0px;マージン: 0px;パディングトップ: 0px; LIST-STYLE-TYPE: なし 
} 
LI { 
PADDING-RIGHT: 0px;パディング左: 0px;パディングボトム: 0px;マージン: 0px;パディングトップ: 0px; LIST-STYLE-TYPE: なし 
} 
.c_l { 
FLOAT: left;幅: 200ピクセル;背景:url(../images/right_menu_bg.jpg); 
} 
.menu { 
Z-INDEX: 9999;マージン-ボトム: 10px;幅: 198ピクセル; 
} 
.menu LI { 
FONT-WEIGHT: 太字;FLOAT: 左;幅: 198ピクセル;行の高さ: 26px;高さ: 26px ; 
/* 
背景: url(../images/line01.gif) リピート-x 50% 下; 
*/ 
} 
.menu LI A { 
LINE-HEIGHT: 26px;高さ: 26px ; 
/* 
背景: url(../images/line01.gif) リピート-x 50% 下; 
*/ 
} 
#arrow{ 
背景: url(../images/aw02.gif) no-repeat 185px 10px; 
線の高さ: 26px;高さ: 26px ; 
} 
.menu LI A:hover { 
BACKGROUND: #eeeeee;行の高さ: 26px;位置: 相対的。高さ: 26px 
} 
.menu UL UL { 
Z-INDEX: 9999;右: 185ピクセル;位置: 絶対的。 TOP: -10000000px;background:url(../images/right_menu_bg.jpg);/*smallclass right kongzhi celafangxiang*/ 
} 
.menu UL UL LI { 
DISPLAY: block;フォントの重み: 通常。背景: url(../images/aw02.gif) 繰り返しなし 10px 10px;線の高さ: 25px!重要;トップ: 0px!重要;高さ: 25ピクセル!重要 
} 
.menu UL UL .b_top { 
BORDER-LEFT-WIDTH: 0px;幅: 199ピクセル; 
} 
.menu UL UL .b_top A { 
DISPLAY: ブロック 
} 
.menu A { 
PADDING-RIGHT: 0px;表示ブロック;パディング左: 0px;フロート: 左;パディングボトム: 0px;幅: 198ピクセル;テキストインデント: 18px;パディングトップ: 0px;テキスト装飾: なし 
} 
.menu A:visited { 
PADDING-RIGHT: 0px;表示ブロック;パディング左: 0px;フロート: 左;パディングボトム: 0px;幅: 198ピクセル;テキストインデント: 18px;パディングトップ: 0px;テキスト装飾: なし 
} 
.menu UL UL LI A { 
表示: ブロック;背景: なし透明スクロール繰り返し 0% 0%。色: #000;トップ: 0px!重要;高さ: 25ピクセル!重要 
} 
.menu UL UL LI A:visited { 
DISPLAY: ブロック;背景: なし透明スクロール繰り返し 0% 0%。色: #000;トップ: 0px!重要;高さ: 25ピクセル!重要 
} 
.menu UL UL LI A:hover { 
DISPLAY: ブロック;背景: url(../images/aw02.gif) #eee no-repeat 10px 10px;幅: 198ピクセル;色: #d15400;ボーダートップスタイル: なし。ボーダー右スタイル: なし。ボーダー左スタイル: なし。トップ: 0px!重要;高さ: 25ピクセル!重要; BORDER-BOTTOM-STYLE: none 
} 
.menu TABLE { 
PADDING-RIGHT: 0px;パディング左: 0px;パディングボトム: 0px;幅: 0ピクセル;パディングトップ: 0px; BORDER-COLLAPSE: 折りたたむ。 HEIGHT: 0px 
} 
* HTML .menu A:hover { 
POSITION: 相対 
} 
.menu LI:hover { 
POSITION: 相対 
} 
.menu UL :hover UL { 
TOP: -1px 
} 
。メニュー UL LI:ホバー > A { 
背景: #eee;位置: 相対的。テキスト装飾: なし 
} 
.menu UL LI UL LI:hover > A { 
ボーダートップスタイル: なし;ボーダー右スタイル: なし。ボーダー左スタイル: なし。位置: 相対的。トップ: 0px; BORDER-BOTTOM-STYLE: none 
} 

その中メニュー UL UL の左または右制御方向右または方向左显表示子菜单