ドロップダウン メニューの行が元の行よりも長くならず、効果がより良くなるように CSS コードを変更する方法_html/css_WEB-ITnose

ドロップダウン ナビゲーション コードにより、ドロップダウン ナビゲーションの水平線がクリックされるか、効果と同じサイズになります

/* MENU */

#main-menu-1
{
float: left; : 0 0 0 -30px;
フォントの太さ: 太字
.usoft-menu-dropdown ul
{ font-size: 14px; ;
z-index: 9999;
}

/*
レベル 1
*/
.usoft-menu-dropdown
{

}
.usoft-menu-dropdown li
{
フォント-サイズ:100%;
ズーム: 1;
背景: 透明;
.usoft-menu-dropdown a:hover
{
color: #fff; :active
{
color : #fff;
.usoft-menu-dropdown li a
{
パディング: 10px 12px;
z-index:9999;
.usoft-menu-dropdown li:last-child a
{
border-right: none;
}
/* IE では動作しません */
.usoft-menu-dropdown li.hover, .usoft-menu-ドロップダウン li:hover
{
色: #dee;
位置: 相対;
.usoft-menu-dropdown li.hover a
{
色: #dee;

}

。 usoft-menu-dropdown li a:hover
{
背景: #70A8DB;
カラー: #fff; }

/*
レベル 2
*/
.usoft-menu-dropdown ul
{
width: 115px ;
可視性: 非表示;
位置: 絶対;
パディング: 0;
マージン: 0; 96%;
背景: #4484C1;
フロート: なし;


}

/* IE 6 および 7 はインライン ブロックが必要です */ .usoft-menu-dropdown ul li a
{
width : 100%;
display: inline-block;
border-top:1px Solid #ccc; }

/*
LEVEL 3
*/
.usoft-menu-dropdown ul
{ text -decoration:none ;
left: 100%;

.usoft-menu-dropdown li:hover >



ディスカッションに返信)

自分で下にもう 1 つ描いてください

親タグをposition:relativeに設定します

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。