Maison > interface Web > tutoriel HTML > 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 12:13:10
original
1138 Les gens l'ont consulté

[img=http://b308.photo.store.qq.com/psb?/2a2c138b-2138-4b25-88ba-2e534a7d1b9d/q2X9ID5uXEbQrmmF47UhgMVmcK*H7WdJNnpTLEPrFto!/b/YWLGn7fxGAAAYmIkmLcbGQAA][/img]

最好是列表与列表的嵌套的,因为要后台传入数据。。


 

      

  •    

           
    • 品牌女装

    •      
    • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

    •      

    •       

               
      • 太虚

      •        
      • |

      •        
      • 太虚

      •        
      • 太虚

      •        
      • |

      •        
      • 太虚

      •       

           

    •    

      

  •   
  • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

  •   
  • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

  •   
  • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

  •   
  • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

  •   
  • 求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose

  •  


回复讨论(解决方案)

好吧 我承认我的语文学的不好

好吧 我承认我的语文学的不好
忽略我下面那个代码。。帮我写个一模一样的布局出来行吗?

引用 1 楼  的回复:

好吧 我承认我的语文学的不好

忽略我下面那个代码。。帮我写个一模一样的布局出来行吗?


关键是你的图片我也看不见啊

引用 2 楼 的回复:

引用 1 楼 的回复:

好吧 我承认我的语文学的不好

忽略我下面那个代码。。帮我写个一模一样的布局出来行吗?



关键是你的图片我也看不见啊
就淘宝商城的页脚上面一样...

引用 3 楼  的回复:
引用 2 楼 的回复:

引用 1 楼 的回复:

好吧 我承认我的语文学的不好

忽略我下面那个代码。。帮我写个一模一样的布局出来行吗?



关键是你的图片我也看不见啊

就淘宝商城的页脚上面一样...



你既然都有代码了 你怎么还要写呢???

<style>#category{ font-size:12px;}#category label{ font-weight:bold; height:30px; line-height:30px;}#category ul{ list-style-type:none;}#category > ul,#category li ul{ margin:0; padding:0px;  width:auto; overflow:hidden;}#category > ul > li{ float:left; width:21%; border:solid 1px #ccc; padding:1%; margin:1%;}li li{ float:left; margin:5px 3px; padding:0 5px;border-left:solid 1px #ccc;}li li:first-child{ border-left:none;}</style><div id="category">    <ul>        <li>             <label>品牌女装</label>             <img  src="my image path" / alt="求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose" >            <ul>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>            </ul>        </li>        <li>             <label>时尚男装</label>             <img  src="my image path" / alt="求高手帮我写个列表与列表之间的嵌套问题_html/css_WEB-ITnose" >            <ul>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>                <li>连衣裙</li>                <li>T?</li>                <li>衬衫</li>                <li>婚纱</li>            </ul>        </li>    </ul></div>
Copier après la connexion

引用 4 楼 的回复:

引用 3 楼 的回复:
引用 2 楼 的回复:

引用 1 楼 的回复:

好吧 我承认我的语文学的不好

忽略我下面那个代码。。帮我写个一模一样的布局出来行吗?



关键是你的图片我也看不见啊

就淘宝商城的页脚上面一样...




你既然都有代码了 你怎么还要写呢???
没有,我处理不好ul与ul的嵌套问题。。它总是会缩进

HTML code


HTML code


1:把 label 显示为块级元素,如下。 
#category label{ font-weight:bold; height:30px; line-height:30px;  display:block}

2: 给图片添加如下样式
li img{ display:block; margin:0 auto;}

谢谢~··ok

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal