今天的挑战关于无序数组。
背景知识
HTML当中有一个特殊的元素,它可以用来创建一个无序数组(unordered lists),或者叫做弹孔风格的序列。
比如下图红框当中展示的,就是这样一个list。
想要递减这样的一个序列,通过
作为opening tag,接着紧跟我们想要摆放的每一个元素。对于每一个元素,我们都用
标签进行包裹,最后在序列的末尾我们加上一个
作为closing tag。
我们来看一个真实代码的例子:
- <ul>
- <li>milk</li>
- <li>cheese</li>
- </ul>
这段代码创建的就是上图当中展示的例子。
题意
去除掉HTML代码当中最后两个p标签,并且创建一个无序数组,包含猫咪最喜欢的三样东西。
要求
编辑器
- <h2>CatPhotoApp</h2>
- <main>
- <p>Click here to view more <a href="#">cat photos</a>.</p>
- <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
- <p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
- <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
- </main>
解法
这次的挑战主要是教我们学会使用ul标签,ul标签在网页当中非常常用,结合CSS我们可以使用出各种炫酷的效果。包括网页的各种导航栏或者是其他形式的序列都可以用它来实现。
我们只需要依照题目的要求去除掉最后两个段落,然后加上ul标签,并且在其中随意写上一项即可。
- <h2>CatPhotoApp</h2>
- <main>
- <p>Click here to view more <a href="#">cat photos</a>.</p>
- <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
- <ul>
- <li>milk</li>
- <li>cheese</li>
- <li>rat</li>
- </ul>
- </main>
本文转载自微信公众号「TechFlow」,可以通过以下二维码关注。转载本文请联系TechFlow公众号。
近几年,互联网行业蓬勃发展,在互联网浪潮的冲击下,互联网创业已成为一种比较...
背景 我们知道 如果在Kubernetes中支持GPU设备调度 需要做如下的工作 节点上安装...
本文转载自公众号读芯术(ID:AI_Discovery)。 这一刻你正在应对什么挑战?这位前...
溢价 域名 的续费价格如何?通常来说,因为溢价域名的价值高于普通域名,所以溢...
前言 统计科学家使用交互式的统计工具(比如R)来回答数据中的问题,获得全景的认...
TIOBE 公布了 2021 年 3 月的编程语言排行榜。 本月 TIOBE 指数没有什么有趣的变...
基本介绍 给定 n 个权值作为 n 个叶子节点,构造一颗二叉树,若该树的带权路径长...
在Python开发过程中,我们难免会遇到多重条件判断的情况的情况,此时除了用很多...
想了解更多内容,请访问: 51CTO和华为官方战略合作共建的鸿蒙技术社区 https://...
本文转载自微信公众号「bugstack虫洞栈」,作者小傅哥 。转载本文请联系bugstack...