添加新闻信息列表 - 使用<ul><li>标签实现无序列表，初识HTML(5)+CSS(3)-升级版教程-慕课网

添加新闻信息列表 - 使用<ul><li>标签实现无序列表

在浏览网页时，你会发现网页上有很多信息的列表，如新闻列表、图片列表，如下图所示。

新闻列表

图片列表

这些列表就可以使用ul-li标签来完成。ul-li是没有前后顺序的信息列表。

语法：

<ul>
  <li>信息</li>
  <li>信息</li>
   ......
</ul>

举例：

<ul>
  <li>精彩少年</li>
  <li>美丽突然出现</li>
  <li>触动心灵的旋律</li>
</ul>

ul-li在网页中显示的默认样式一般为：每项li前都自带一个圆点，如下图所示：

任务

我来试试，亲自感受一下无序标签的使用

1、在右部编辑器中的第10行输入<ul><li>我的第一个列表信息</li></ul>

?不会了怎么办

1、别忘了ul-li标签的语法

  <ul>
      <li>信息</li>
      <li>信息</li>
      ......
  </ul>

index.html

1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

提交

自动运行

重置代码

全屏

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求

4-1 添加新闻信息列表 -...

添加新闻信息列表 - 使用<ul><li>标签实现无序列表

任务

提问题

其他问答

写笔记

您还未绑定服务号

收藏课程后，能更快找到我哦～

如何序列标签中添加图片、链接？

請問這種如何實現？

怎么把<Li>也像<ul>一样居中

关于body的输入的问题

怎么在它的右边也加一列

关于<hl><li>

推荐课程

推荐路线系统化学习，打造阶梯学习模式

手记推荐

4-1 添加新闻信息列表 -...

热搜

最近搜索清空

添加新闻信息列表 - 使用<ul><li>标签实现无序列表

任务

提问题

其他问答

写笔记

您还未绑定服务号

收藏课程后，能更快找到我哦～

如何序列标签中添加图片、链接？

請問這種如何實現？

怎么把<Li>也像<ul>一样居中

关于body的输入的问题

怎么在它的右边也加一列

关于<hl><li>

推荐课程

推荐路线系统化学习，打造阶梯学习模式

相关课程

手记推荐

账号登录 验证码登录

账号登录验证码登录