ホームページ > 記事 > ウェブフロントエンド > 淘宝網ナビゲーション バー効果_案内を求める_html/css_WEB-ITnose
淘宝網ナビゲーション バー効果_案内を求める_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 12:24:13961ブラウズ
ul li hover ナビゲーション バー タオバオ CSS
この効果を実現する方法を教えてください。主に境界線を多角形にする方法がわかりません
ディスカッションへの返信 (解決策)
ポスターが追加されました。階層は何ですか? 効果はありません
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>.dpnone{ display:none;}#nav{ width:100px; height:50px; border-left:2px solid #C1C1C1; border-right:2pxsolid #C1C1C1; border-top:2px solid #C1C1C1; background-color:#09F ; position:relative; z-index:999; }#nav_child{ width:200px; height:100px; border:2px solid #C1C1C1; background-color:#F90; position:absolute; z-index:10; top:48px; }#nav:hover #nav_child{ display:block;}</style></head><body><div id="nav"> <a>adc</a> <div id="nav_child" class="dpnone"> <a>def</a> </div></div></body></html> 2 つの div がまとめられ、上のものは border-bottom:none; で、下のものは通常のボーダーで、上のものは下のものを覆います。絶対的な位置決め。
さらに、この世界には Firebug と呼ばれるアーティファクトがあり、それを試すことができます。
まず第一に、タイプミスなのか貼り付けられていないのかはわかりませんが、正しい DTD であることを確認する必要があります。次に、コードの有機的な分離とエフェクトの統合があります。
リーリー
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。