资讯专栏INFORMATION COLUMN

课时33.无序列表练习3(理解)

newtrek / 2022人阅读

摘要:蔬菜,水果同属于物品清单里的,并且蔬菜,水果谁先谁后都无所谓,所以是无序列表,而蔬菜里面又包含这几样,所以它们又是一个无序列表,水果同理,这是无序列表中又包含无序列表,这是这节课讲解都重点。

上节课做了第一个练习,这节课我们来完成第二个练习(多级界面)

做之前先分析:

1.物品清单是这个界面的标题,可以通过

标签来做。

2.蔬菜,水果同属于物品清单里的,并且蔬菜,水果谁先谁后都无所谓,所以是无序列表,而蔬菜里面又包含这几样,所以它们又是一个无序列表,水果同理,这是无序列表中又包含无序列表,这是这节课讲解都重点。

分析:这个li标签除了可以添加其它标签以外,还可以来添加ul标签。

无序列表中都li标签除了可以添加其它标签来丰富我们都界面以外,还可以添加ul标签来丰富我的界面,也就是说ul中有li,li中又可以有ul,可以无限下去,以后你添加标签只添加到li中就可以了,不要添加到ul里,因为ul中只能有li。

在WebStorm中如何快速编一个ul的格式

正常写ul,li标签比较复杂,需要先写一个ul然后按下tab键,WebStorm是一款很强大的工具,可以写成ul>li,按下tab键,直接生成

 

如果想有两个li,则可以写成ul>li*2,按下tab键,直接生成

含义:生成一对ul标签,然后在这对ul标签再生成两对li标签,所以刚才对例子用简单写法,可以写成如下:

ul>li*2>h2+ul>li*3,按下tab键

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/2108.html

相关文章

  • 课时89.CSS三大特性练习理解

    摘要:给大家补充一点通配符是不参与权重计算的,因为通配符的权重是,而权重只计算,类,标签,将来还有一种,到后面说。练习直接选中和间接选中的,必然要听直接选中的。练习直接选中一共有两个,直接比较这两个直接选中的权重大小,听从权重大的。给大家补充一点:通配符是不参与权重计算的,因为通配符的权重是0,而权重只计算id,类,标签,将来还有一种,到后面说。 练习1 直接选中和间接选中的,必然要听直接选中的...

    马龙驹 评论0 收藏0
  • 课时36.定义列表练习(了解)

    摘要:在这里我们介绍一个之前从来没有了解过都语法按下键,因为和是同一级别的,因为它们的父标签都是标签 在这里我们介绍一个之前从来没有了解过都语法: dl>dt+dd 按下tab键,因为dt和dd是同一级别的,因为它们的父标签都是dl标签

    SimonMa 评论0 收藏0
  • 课时106.边框练习理解

    摘要:让我们做出来如下的样式首先看下有几个边框,就做几个,用简单方法键然后给它们设置宽高然后依此来做边框第一个有四种方法,第一种最简单第二个有两种方法,第二种简单第三个第四个第五个第六个让我们做出来如下的样式: 1.首先看下有几个边框,就做几个div,用简单方法div.box$*6  tab键   2.然后给它们设置宽高   3.然后依此来做边框 第一个:有四种方法,第一种最简单 第二个:有两...

    Anonymous1 评论0 收藏0
  • 课时101.背景图练习理解

    摘要:要将第二个嵌套进第一个中去如果以后我们看到一张图片是由多张图片拼接的,那么就是用到的嵌套,我们这个练习是用大的嵌套一个小的,再将小定位到底部。 要将第二个div嵌套进第一个div中去 如果以后我们看到一张图片是由多张图片拼接的,那么就是用到div的嵌套,我们这个练习是用大的div嵌套一个小的div,再将小div定位到底部。

    CarlBenjamin 评论0 收藏0
  • 课时50.51表单练习理解

    摘要:来做一个这个界面和标签在企业中用到的非常少,在企业里的边框都要求非常好看来做一个这个界面 fieldset和legend标签在企业中用到的非常少,在企业里的边框都要求非常好看

    macg0406 评论0 收藏0

发表评论

0条评论

newtrek

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<