ホームページ >ウェブフロントエンド >htmlチュートリアル >Li の位置合わせの問題。_html/css_WEB-ITnose

Li の位置合わせの問題。_html/css_WEB-ITnose

WBOYオリジナル: 2016-06-24 11:58:311301ブラウズ

.Wfbotmain{min-width:1200px;color:#666666;font-size:12px;padding-top:20px;background:#F9F9F9;margin:0px auto; text-align:center;}
.Wfbotmain ul{ line-height:18px;height:110px;padding:0 20px 25px 25px; フロート:左; }
.Wfbotmain ul a,#foot_text a{color:#666666;}
.Wfbotli{border-right:1px dashed #ddd;}
.Wfbotli li { float:left;}
.WfbotliSpan{padding:0 0 13px 15px;表示:インラインブロック; float:left;}
.color99{padding-left:3px;}
531ac245ce3e4fe3d50054a55f265927
@*5d6aa43dda8128c9d33de1d15a2a96be *@
5c8b8020021c112d9a8e9248fefdb5de
d0b476895b4487566c45cb7d0f84ebae9a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.S_ADDS_Footer_CustomerServices0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d11407e2a4fdaeb60d92b9f7ed7533c0ffe0@ADDS_Lan.S_ADDS_Footer_UserJY5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
adc03d99a2d9d11e6318f7b8e046ddd49a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.S_ADDS_Footer_Follow0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d11407e2a4fdaeb60d92b9f7ed7533c0ffe0@ADDS_Lan.S_ADDS_Footer_MicroletterAttendet5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb< br />
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1146200e5ce834b5947498516b69d4f85fe@ADDS_Lan.S_ADDS_Footer_Platform5db79b134e9f6b82c0b36e0489ee08ed

25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d114835bc49fef16c2383db00758982895ad@ADDS_Lan.S_ADDS_Footer_Business5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
4096960cee5e120086e71a84c76366479a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.S_ADDS_Footer_AdvertisingSer0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_Pricesystem5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632ebdf250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_Advertising5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632ebdf250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_Servicesguarantee5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689

4096960cee5e120086e71a84c76366479a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.S_ADDS_Footer_UseTheHelp0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114

             25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1．54bdf357c58b8a65c66d7c19c8e4d11424e10050ceb92742561e417e1c16dbb4@ADDS_Lan.S_ADDS_Footer_RegistrationandLogin5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb< br />
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_Retrieval5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_DownloadandView5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
4096960cee5e120086e71a84c76366479a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.S_ADDS_Footer_Contact0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148aa2918506a11e8a886e85949f1eb079@ADDS_Lan.S_ADDS_Footer_Email service@botudata.com.cn5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d114@ADDS_Lan.S_ADDS_Footer_TelPhone 0731-8411-8472bed06894275b65c1ab86501b08a632ebdf250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d1148:30-11:30,13:30-17:30(@ADDS_Lan.S_ADDS_Footer_WorkDay)bed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
ff6d136ddc5fdfeffaf53ff6ee95f1859a9b551b2d3d53d50b69dfe7e934f9ffa4b561c25d9afb9ac8dc4d70affff419@ADDS_Lan.BI_AS_Language0d36329ec37a2cc24d42c7229b69747a54bdf357c58b8a65c66d7c19c8e4d114df250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1。54bdf357c58b8a65c66d7c19c8e4d114afa729fde4a5746c02a09e555e0876fa英語5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632ebdf250b2156c434f3390392d09b1c9563
25edfb22a4f469ecb59f1190150159c61434900cf48b63e2949e86585428a1c1  。54bdf357c58b8a65c66d7c19c8e4d114 929d1f5ca49e04fdcb27f9465b944689

在360、谷歌、火狐都能对齐、在IE下第一个LI没对齐。

回复讨论(解决方案)

自己代码有问题

ae345956c261e98d0beb2c3ce37b57eb 9a9b551b2d3d53d50b69dfe7e934f9ff

私在スパン前加个li 也还是一样。

発行完整的上来
代码本身存在很多问题 bed06894275b65c1ab86501b08a632eb 076402276aae5dbec7f672f8f4e5cc81

能先把你的0c6dc11e160d3b678d68754cc175188a都去了么
把你的ul 里面的span 先都加上25edfb22a4f469ecb59f1190150159c6
别発razor 視图的代码

.WfbotliSpan{padding:0 0 13px 15px;display:inline-block; float:left;}
可直去掉了你既然是一行一条加浮動干嘛

br是用来强制换行的。

li 本身就换行而来不用br

....能加下QQ细聊吗。

出版者用の html ソースコード

[code=html]<style type="text/css">        .WfBottom        {            min-width: 1200px;            background: #F9F9F9;            border-top: 1px solid #E9E9E9;            margin: 0px auto;            text-align: center;        }        .Wfbotmain        {            min-width: 1200px;            color: #666666;            font-size: 12px;            padding-top: 20px;            background: #F9F9F9;            margin: 0px auto;            text-align: center;        }        .Wfbotmain ul        {            line-height: 18px;            height: 110px;            padding: 0 20px 25px 25px;			width:60px;			overflow:hidden;            float: left;        }        .Wfbotmain ul a, #foot_text a        {            color: #666666;        }        .Wfbotli        {            border-right: 1px dashed #ddd;        }        .Wfbotli li        {                    }          .color99        {            padding-left: 3px;        }    </style>    <div class="Wfbotmain" style="padding-left: 400px">        <ul class="Wfbotli" id="fulleft">            <li><span class="WfbotliSpan"><b>@ADDS_Lan.S_ADDS_Footer_CustomerServices</b></span></li>            <li><span class="color99">．</span><a href="" target="_blank">@ADDS_Lan.S_ADDS_Footer_UserJY</a></li>        </ul>        <ul class="Wfbotli">            <li><span class="WfbotliSpan"><b>@ADDS_Lan.S_ADDS_Footer_Follow</b></span></li>            <li><span class="color99">．</span><a href="" target="_blank">@ADDS_Lan.S_ADDS_Footer_MicroletterAttention</a></li>            <li><span class="color99">．</span><a href="../About" target="_blank">@ADDS_Lan.S_ADDS_Footer_Platform</a></li>            <li><span class="color99">．</span><a target="_blank" href="">@ADDS_Lan.S_ADDS_Footer_Business</a></li>        </ul>        <ul class="Wfbotli">                    <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Pricesystem</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Advertising</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Servicesguarantee</a></li>        </ul>        <ul class="Wfbotli">                   <li><span class="color99">．</span><a href="../CustomManager/CustomManagerLogin">@ADDS_Lan.S_ADDS_Footer_RegistrationandLogin</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Retrieval</a></li>                       <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_DownloadandView</a></li>        </ul>        <ul class="Wfbotli">                       <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Email service@botudata.com.cn</a></li>            <li><span class="color99">．</span>@ADDS_Lan.S_ADDS_Footer_TelPhone 0731-8411-8472</li><br />            <li><span class="color99">．</span>8:30-11:30,13:30-17:30(@ADDS_Lan.S_ADDS_Footer_WorkDay)</li>        </ul>        <ul>                       <li><span class="color99">．</span><a href="" onclick="ChangeCulture('English')" id="zh-EN"                name="multiLanguageSwitch">English</a></li>            <li><span class="color99">  ．</span><a href="" onclick="ChangeCulture('Chinese')"                id="zh-CN">Chinese</a></li>        </ul>    </div>

[/code]

出版者用の html ソースコード

[code=html]<style type="text/css">        .WfBottom        {            min-width: 1200px;            background: #F9F9F9;            border-top: 1px solid #E9E9E9;            margin: 0px auto;            text-align: center;        }        .Wfbotmain        {            min-width: 1200px;            color: #666666;            font-size: 12px;            padding-top: 20px;            background: #F9F9F9;            margin: 0px auto;            text-align: center;        }        .Wfbotmain ul        {            line-height: 18px;            height: 110px;            padding: 0 20px 25px 25px;			width:60px;			overflow:hidden;            float: left;        }        .Wfbotmain ul a, #foot_text a        {            color: #666666;        }        .Wfbotli        {            border-right: 1px dashed #ddd;        }        .Wfbotli li        {                    }          .color99        {            padding-left: 3px;        }    </style>    <div class="Wfbotmain" style="padding-left: 400px">        <ul class="Wfbotli" id="fulleft">            <li><span class="WfbotliSpan"><b>@ADDS_Lan.S_ADDS_Footer_CustomerServices</b></span></li>            <li><span class="color99">．</span><a href="" target="_blank">@ADDS_Lan.S_ADDS_Footer_UserJY</a></li>        </ul>        <ul class="Wfbotli">            <li><span class="WfbotliSpan"><b>@ADDS_Lan.S_ADDS_Footer_Follow</b></span></li>            <li><span class="color99">．</span><a href="" target="_blank">@ADDS_Lan.S_ADDS_Footer_MicroletterAttention</a></li>            <li><span class="color99">．</span><a href="../About" target="_blank">@ADDS_Lan.S_ADDS_Footer_Platform</a></li>            <li><span class="color99">．</span><a target="_blank" href="">@ADDS_Lan.S_ADDS_Footer_Business</a></li>        </ul>        <ul class="Wfbotli">                    <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Pricesystem</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Advertising</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Servicesguarantee</a></li>        </ul>        <ul class="Wfbotli">                   <li><span class="color99">．</span><a href="../CustomManager/CustomManagerLogin">@ADDS_Lan.S_ADDS_Footer_RegistrationandLogin</a></li>            <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Retrieval</a></li>                       <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_DownloadandView</a></li>        </ul>        <ul class="Wfbotli">                       <li><span class="color99">．</span><a href="">@ADDS_Lan.S_ADDS_Footer_Email service@botudata.com.cn</a></li>            <li><span class="color99">．</span>@ADDS_Lan.S_ADDS_Footer_TelPhone 0731-8411-8472</li><br />            <li><span class="color99">．</span>8:30-11:30,13:30-17:30(@ADDS_Lan.S_ADDS_Footer_WorkDay)</li>        </ul>        <ul>                       <li><span class="color99">．</span><a href="" onclick="ChangeCulture('English')" id="zh-EN"                name="multiLanguageSwitch">English</a></li>            <li><span class="color99">  ．</span><a href="" onclick="ChangeCulture('Chinese')"                id="zh-CN">Chinese</a></li>        </ul>    </div>

[/code]

你这可以了>?

ul的float 去掉

我追加ul的float 好了。 IEと360都可了。

谷歌有るもの么问题出版帪图看看

谷歌有るもの么问题発行个图看看

これは有るもの么问题么你是要居中还是要靠左什么的

这个有什么问题么私は要居中です、また、要残存です

何も得ていません.... 自己好解。

声明：

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

前の記事：テキストの長さに応じて選択幅を調整する方法_html/css_WEB-ITnose次の記事：テキストの長さに応じて選択幅を調整する方法_html/css_WEB-ITnose

続きを見る

Li の位置合わせの問題。_html/css_WEB-ITnose

回复讨论(解决方案)

関連記事