ホームページ > 記事 > ウェブフロントエンド > lists_html/css_WEB-ITnose 間のネスト問題の作成を手伝ってください。
[img=http://b308.photo.store.qq.com/psb?/2a2c138b-2138-4b25-88ba-2e534a7d1b9d/q2X9ID5uXEbQrmmF47UhgMVmcK*H7WdJNnpTLEPrFto!/b/YWLGn7fxGAAAYmIkmLcbGQAA][/img]
最好是列表与列表的嵌套的,因为要后台传入数据。。
82b07f364f30fd477f27a34de9cc55b0
19338573c3595bb924c6d18ba44016b8
b95e40d36e55495e24097eb888f84ea5
3a2ede92bc236b04b8504fabbf8050e1
25edfb22a4f469ecb59f1190150159c6品牌女装bed06894275b65c1ab86501b08a632eb
57f8a7b4773dba07bad67df35b26ad7f5a7dff8bfc165d9e5074563330b2c7614e2420bc8ad350c16386aa0063582a395db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
dbaac9af82be3b28abedc918926c2bf0
ff6d136ddc5fdfeffaf53ff6ee95f185
25edfb22a4f469ecb59f1190150159c6太虚bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6|bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6太虚bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6太虚bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6|bed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6太虚bed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
bed06894275b65c1ab86501b08a632eb
929d1f5ca49e04fdcb27f9465b944689
fca416cc628c16a3fc4e60a08aad649a
b95e40d36e55495e24097eb888f84ea53499910bf9dac5ae3c52d5ede73834853ab107ef3a2fcf97eef555925620f0b2fca416cc628c16a3fc4e60a08aad649a
b95e40d36e55495e24097eb888f84ea53499910bf9dac5ae3c52d5ede73834853ab107ef3a2fcf97eef555925620f0b25db79b134e9f6b82c0b36e0489ee08edfca416cc628c16a3fc4e60a08aad649a
b95e40d36e55495e24097eb888f84ea53499910bf9dac5ae3c52d5ede73834853ab107ef3a2fcf97eef555925620f0b25db79b134e9f6b82c0b36e0489ee08edfca416cc628c16a3fc4e60a08aad649a
b95e40d36e55495e24097eb888f84ea53499910bf9dac5ae3c52d5ede73834853ab107ef3a2fcf97eef555925620f0b25db79b134e9f6b82c0b36e0489ee08edfca416cc628c16a3fc4e60a08aad649a
a5dc42188835dcaefa8d683b6f7092e83499910bf9dac5ae3c52d5ede73834853ab107ef3a2fcf97eef555925620f0b25db79b134e9f6b82c0b36e0489ee08edfca416cc628c16a3fc4e60a08aad649a
929d1f5ca49e04fdcb27f9465b944689
16b28748ea4df4d9c2150843fecfba68
わかりました、私の文献学が良くないことを認めます
わかりました、私の文献学が良くないことを認めます
以下のコードは無視してください。 。正確なレイアウトを書いてもらえますか?
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" /> <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" /> <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>
4 階の回答より引用:
3 階の回答より引用:
2 階の回答より引用:
1 階の回答より引用:
はい、私の中国語が下手であることは認めます。
以下の私のコードは無視してください。 。正確なレイアウトを書いてもらえますか?
重要なのは、私もあなたの写真を見ることができないということです
タオバオモールのフッターと同じように...
コードはすでにあるのに、なぜまだコードを書くのですか? ? ?
いいえ、ul と ul の入れ子問題をうまく処理できません。 。常にインデントされます
HTML コード
c9ccee2e6ea535a969eb3f532ad9fe89
#category{ font-size:12px;}
#category label{ font-weight:bold; height:30px;}
#category ul{ list-style-type:none;}
#category > ul,#category li ul{ margin:0;......
画像とタイトルは 1 行にする必要はありません。 2行目を中心に〜どうやってやるの?
HTML コード
c9ccee2e6ea535a969eb3f532ad9fe89
#category{ font-size:12px;}
#category label{ font-weight:bold height:30px;}
#category ul{ リスト-style-type:none;}
#category > ul,#category li ul{ margin:0;......
画像とタイトルは同じ行に配置する必要はありませんが、2 番目の行の中央に配置する必要があります。ライン〜どうやってやるの?
1: 次のように、ラベルをブロックレベルの要素として表示します。
#category label{ font-weight:bold; height:30px; line-height:30px; display:block}
2: 画像に次のスタイルを追加します
li img{ display:block; }
ありがとう〜・わかりました