ホームページ > ウェブフロントエンド > htmlチュートリアル > CSS は水平ドロップダウン menu_html/css_WEB-ITnose を実装します

CSS は水平ドロップダウン menu_html/css_WEB-ITnose を実装します

WBOY
リリース: 2016-06-24 12:18:05
オリジナル
1249 人が閲覧しました

css

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Untitled Document</title><style type="text/css">    body{        color: black;    }    .father{        height: 31px;        background-color: grey;        position: relative;    }    .father li{        float: left;        margin-right: 5px;    }    .son{        display: none;        background-color: red;        height: 30px;        top: 31px;        left: 0px;    }    .father li:hover ul{        display: block;    }    .son li{        float: left;        margin-right: 5px;    }</style></head><body><ul class="father">    <li>first</li>    <li>        <a href="#">father</a>        <ul class="son">            <li>son1</li>            <li>son1</li>            <li>son1</li>        </ul>    </li></ul></body></html>
ログイン後にコピー

これは私のコードですが、Chrome と IE では異なります。誰か専門家が解決するのを手伝ってくれますか? ありがとう

ディスカッション (解決策) への返信

元の投稿者が解決するのを手伝いました。 IE7+ は Google と似ていますが、CSS スタイルで直接制御する水平ドロップダウン メニューはあまり良くありません。元の投稿者に役立つことを願っています。

リーリー

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート