CSS の div を左フローティングと相対配置に同時に設定できますか? _html/css_WEB-ITnose

<ul>                <li><a class="current_nav" href="#">网站首页</a>                	<ul>                    	<span class="arrow"></span>                    	<li class="twomenu"><a href="#">域名查询</a></li>                    	<li class="twomenu"><a href="#">管理域名记录</a>                        	<ul>                            	<span class="arrow"></span>                            	<li><a href="#">域名查询</a></li>                                <li><a href="#">管理域名记录</a></li>                                <li><a href="#">域名查询</a></li>                                <li><a href="#">管理域名记录</a></li>                                <li><a href="#">域名查询</a></li>                            </ul>                        </li>                        <li class="twomenu"><a href="#">域名查询</a></li>                    	<li class="twomenu"><a href="#">管理域名记录</a></li>                        <li class="twomenu"><a href="#">域名查询</a></li>                	</ul>                </li>                <li><a href="#">产品介绍</a></li>                <li><a href="#">新闻资讯</a></li>                <li><a href="#">成功案例</a></li>                <li><a href="#">解决方案</a></li>                <li><a href="#">关于我们</a></li>                <li><a href="#" class="last_nav">客户服务专区</a></li>            </ul>

この水平サブメニューを実装したいと考えています。
このように書くと
.navfifth ul li {
float: left;
Position:relative
}
li は水平配置を実現できません。

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

この種のナビゲーションは、解決するのが簡単です。URL: http://wrongwaycn.github.com/bootstrap/docs/ を使用することをお勧めします。

<div id="topnavall">    <div id="topnav">      <ul>        <!--<li><a href="#"></a></li>-->        <li><a href="#">关于我们          <!--[if IE 7]><!--></a><!--<![endif]-->          <!--[if lte IE 6]><table><tr><td><![endif]-->          <ul>            <li><a href="#">标准</a></li>            <li><a href="#">教程</a></li>            <li><a href="#">技术文章</a></li>            <li><a href="#">常见问题</a></li>            <li><a href="#">布局教程专题布局教程专题布局教程专题布局教程专题布局教程专题</a></li>            <li><a href="#">CSS菜单</a></li>            <li><a href="#">浏览器兼容</a></li>            <li><a href="#">滚动条相关</a></li>            <li><a href="#">圆角矩形专题</a></li>            <li><a href="#">CSS特效欣赏专题</a></li>          </ul>          <!--[if lte IE 6]></td></tr></table></a><![endif]-->        </li>        <li><a href="#">公司荣誉</a></li>        <!--<li><a href="#"></a></li>-->        <li><a href="#">关于我们关于我们          <!--[if IE 7]><!--></a><!--<![endif]-->          <!--[if lte IE 6]><table><tr><td><![endif]-->          <ul>            <li><a href="#">标准</a></li>            <li><a href="#">教程</a></li>            <li><a href="#">技术文章</a></li>            <li><a href="#">常见问题</a></li>            <li><a href="#">布局教程专题</a></li>            <li><a href="#">CSS菜单</a></li>            <li><a href="#">浏览器兼容</a></li>            <li><a href="#">滚动条相关</a></li>            <li><a href="#">圆角矩形专题</a></li>            <li><a href="#">CSS特效欣赏专题</a></li>          </ul>          <!--[if lte IE 6]></td></tr></table></a><![endif]-->        </li>        <li><a href="#">人才招聘</a></li>        <li><a href="#">联系我们</a></li>      </ul>    </div>      </div>

ブラウザの互換性も確認してください。水平に配置したい場合は、次のように変更します。 ; }

相対配置を実現するには条件があります。つまり、その前の要素をデフォルトの配置にすることはできません。つまり、その親要素をデフォルト以外の配置属性に変更すると、相対配置を実現できます

li 自体。 float: left

li 内に div を作成して、position:relative を実装します


つまり、li は float: left
の関数のみを想定します。