猿问

如何制作单页导航？没有滚动，只是一个带有自己身体的导航

我在整个互联网上进行了搜索，但似乎没有任何教程可以教授这些类型的导航。

我一直在尝试重新创建一个电影网站作为练习，在他们的首页上，他们有这个https://gph.is/g/E1W3OQq。我在互联网上搜索了所有内容，但没有找到一个教程。我对javascript的了解几乎为零。

到目前为止，我已经完成了这个https://jsfiddle.net/oViana_/gbtcLrmf/8/并添加了我想在每个部分中进行的 div。

  1. （PS：不要介意海报，我只是搜索了“[Seaction Name]海报”）

  2. （PS：顺便说一句，我不知道为什么当我调整页面大小时导航的行为不像顶部的导航）


守着一只汪
浏览 172回答 2
2回答

慕工程0101907

链接“href”将查找具有与其值匹配的 id 的元素。检查下面。#Highlights 将查找 id 为“Highlights”的元素<!DOCTYPE html><html>&nbsp; <head>&nbsp; &nbsp; <meta charset="utf-8">&nbsp; &nbsp; <title>Site</title>&nbsp; &nbsp; <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">&nbsp; &nbsp; <link rel="stylesheet" href="style.css">&nbsp; &nbsp; <script src="https://kit.fontawesome.com/74494548e4.js" crossorigin="anonymous"></script>&nbsp; </head>&nbsp; <body>&nbsp; &nbsp; <ul class="top">&nbsp; &nbsp; &nbsp; <li class="li-top-active"><a href="#">Home</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Movies</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Series</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Animes</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Help</a></li>&nbsp; &nbsp; </ul>&nbsp; <div class="media-div">&nbsp; &nbsp; <ul class="media">&nbsp; &nbsp; &nbsp; <h1 class="media-title">Movies</h1>&nbsp; &nbsp; &nbsp; <div class="search-box">&nbsp; &nbsp; &nbsp; &nbsp; <input class="search-txt" type="text" placeholder="Search here a movie">&nbsp; &nbsp; &nbsp; &nbsp; <a href="#" class="search-btn">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <i class="fas fa-search"></i>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; <li class="li-media-active"><a href="#Highlights">Highlights</a></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><a href="#MostSeen">Most seen</a></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><a href="#MostRecentAdded">Most recent added</a></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><a href="#MostRated">Most rated</a></li>&nbsp; &nbsp; </ul>&nbsp; &nbsp; <div class="content-media" id="Highlights">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Highlights">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://mischalke04.files.wordpress.com/2010/06/the-highlights-poster.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Highlights</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="MostSeen">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most seen">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://i.pinimg.com/originals/31/22/ea/3122ea91ff43732c50c9fa8c5761271f.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="">Most seen</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="MostRecentAdded">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most recent added">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://i.pinimg.com/originals/6e/66/03/6e6603be280359c8a62e0f2f498242ea.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Most recent added</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="MostRated">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most rated">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://d13ezvd6yrslxm.cloudfront.net/wp/wp-content/images/TFINYR-Poster-700x999.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Most rated</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; </div>&nbsp; &nbsp; <div class="footer">&nbsp; &nbsp; &nbsp; <h1 class="footer-title">Help</h1>&nbsp; &nbsp; &nbsp; <br>&nbsp; &nbsp; &nbsp; <a href="#"><h1 class="footer-txt">Contact</h1></a>&nbsp; &nbsp; &nbsp; <br>&nbsp; &nbsp; &nbsp; <a href="#"><h1 class="footer-txt">Terms of service</h1></a>&nbsp; &nbsp; </div>&nbsp; </body></html>
0

慕森卡

你只需要将这个函数添加到你的js项目文件中function openTab(tabName) {&nbsp; var i;&nbsp; var x = document.getElementsByClassName("content-media");&nbsp; for (i = 0; i < x.length; i++) {&nbsp; &nbsp; x[i].style.display = "none";&nbsp;&nbsp;&nbsp; }&nbsp; document.getElementById(tabName).style.display = "block";&nbsp;&nbsp;}openTab('movies-highlights')此函数在调用时隐藏所有选项卡，使用id属性仅显示需要的选项卡然后您将导航元素从链接更改a为常规按钮button，并向它们添加一些新样式（因为它们具有不同的默认样式，然后链接具有）然后确保所有的 id 都是唯一的，以便显示特定的选项卡。然后为每个导航按钮添加以下属性：data-open="movies-highlights". 作为参数，您指定要显示的元素的 id。你得到这个：function openTab(tabName) {&nbsp; var i;&nbsp; var x = document.getElementsByClassName("content-media");&nbsp; for (i = 0; i < x.length; i++) {&nbsp; &nbsp; x[i].style.display = "none";&nbsp;&nbsp;&nbsp; }&nbsp; document.getElementById(tabName).style.display = "block";}openTab('movies-highlights')// the following is used to make tabs active when click on themlet navButtons = document.querySelectorAll('button[data-open]')navButtons.forEach((elem) => {&nbsp; elem.addEventListener("click", (e) => {&nbsp; &nbsp; for (var i = 0; i < navButtons.length; i++) {&nbsp; &nbsp; &nbsp; navButtons[i].classList.remove('active')&nbsp; &nbsp; }&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; e.target.classList.add('active')&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; openTab(e.target.getAttribute('data-open'))&nbsp; })})html {&nbsp; scroll-behavior: smooth;}body {&nbsp; background-color: #222222;&nbsp; font-family: 'Montserrat', sans-serif;&nbsp; margin: 0;&nbsp; margin-top: 4em;&nbsp; padding: 0;}ul.top {&nbsp; display: block;&nbsp; list-style-type: none;&nbsp; margin: 0;&nbsp; padding: 0;&nbsp; width: 100%;&nbsp; background-color: #1d1d1d;&nbsp; font-weight: bold;&nbsp; text-align: center;&nbsp; cursor: default;&nbsp; user-select: none;&nbsp; font-size: 16px;&nbsp; opacity: 0.98;&nbsp; position: fixed;&nbsp; top: 0;&nbsp; z-index: 100;&nbsp;}li.li-top {&nbsp; display: inline-block;}li.li-top a {&nbsp; display: block;&nbsp; color: #ffffff;&nbsp; text-decoration: none;&nbsp; line-height: 3em;&nbsp; padding-left: 3em;&nbsp; padding-right: 3em;}li.li-top a:hover {&nbsp; background-color: #1a1a1a;&nbsp; transition: all ease-in-out 250ms;&nbsp; color: #dbdbdb;}li.li-top-active {&nbsp; display: inline-block;&nbsp; background-color: #ffffff;}li.li-top-active a {&nbsp; display: block;&nbsp; color: #000000;&nbsp; text-decoration: none;&nbsp; line-height: 3em;&nbsp; padding-left: 3em;&nbsp; padding-right: 3em;}li.li-top-active a:hover {&nbsp; background-color: #dbdbdb;&nbsp; transition: all ease-in-out 250ms;}.media-div {&nbsp; padding-bottom: 1.5em;&nbsp; user-select: none;}.media-title {&nbsp; text-align: center;&nbsp; line-height: 3em;&nbsp; margin-bottom: 2.5em;&nbsp; font-size: 20px;}.search-box {&nbsp; position: absolute;&nbsp; background-color: #ffffff;&nbsp; left: 50%;&nbsp; transform: translate(-50%,-50%);&nbsp; height: 3em;&nbsp; border-radius: 3em;&nbsp; border-style: solid;&nbsp; border-color: #000000;&nbsp; padding: 0;&nbsp; margin-top: -2.2em;}.search-btn {&nbsp; color: #000000;&nbsp; float: right;&nbsp; width: 3em;&nbsp; height: 3em;&nbsp; border-radius: 50%;&nbsp; background-color: #ffffff;&nbsp; display: flex;&nbsp; justify-content: center;&nbsp; align-items: center;&nbsp; text-decoration: none;&nbsp; position: static;}.search-txt {&nbsp; border: none;&nbsp; background: none;&nbsp; outline: none;&nbsp; padding: 0;&nbsp; padding-left: 1em;&nbsp; color: #000000;&nbsp; font-size: 17px;&nbsp; transition: all ease-in-out 250ms;&nbsp; line-height: 3em;&nbsp; width: 25em;&nbsp; float: left;}ul.media {&nbsp; &nbsp;list-style-type: none;&nbsp; &nbsp;margin: 0 auto;&nbsp; &nbsp;padding: 0;&nbsp; &nbsp;width: 75em;&nbsp; &nbsp;background-color: #ffffff;&nbsp; &nbsp;font-weight: bold;&nbsp; &nbsp;text-align: center;&nbsp; &nbsp;cursor: default;&nbsp; &nbsp;user-select: none;&nbsp; &nbsp;border: none;&nbsp; &nbsp;font-size: 16px;&nbsp;}li.li-media {&nbsp; display: inline-block;}li.li-media button {&nbsp; display: block;&nbsp; color: #000000;&nbsp; text-decoration: none;&nbsp; line-height: 3em;&nbsp; padding-left: 3em;&nbsp; padding-right: 3em;&nbsp; border: 0;&nbsp; outline: none;&nbsp; font-family: 'Montserrat', sans-serif;&nbsp; cursor: pointer;&nbsp; font-size: 15px;&nbsp; transition: all 200ms ease-in-out;}li.li-media button:hover {&nbsp; background: #dbdbdb!important;&nbsp; transition: all ease-in-out 250ms;}li.li-media button:active {&nbsp; background-color: #dbdbdb;}// styles for active nav itembutton[data-open].active {&nbsp; background-color: #999999;}button[data-open].active:hover {&nbsp; background-color: #999999 !important;}.content-media {&nbsp; width: 75em;&nbsp; background-color: #dbdbdb;&nbsp; margin: 0 auto;&nbsp; margin-bottom: 1em;}.content-media-padding {&nbsp; padding-bottom: 1em;&nbsp; display: inline-block;&nbsp; text-align: center;}.img {&nbsp; height: 18em;&nbsp; width: 12em;}.img-container {&nbsp; height: 18em;&nbsp; width: 12em;&nbsp; padding: 1em;&nbsp; transition: all ease-in-out 100ms;&nbsp; display: inline-block;}.img-container:hover {&nbsp; transform: scale(1.02);&nbsp; cursor: pointer;}.content-title {&nbsp; width: 12em;&nbsp; height: 2.5em;&nbsp; background-color: #1d1d1d;&nbsp; color: #ffffff;&nbsp; text-align: center;&nbsp; line-height: 2.5em;&nbsp; margin-top: -0.3em;&nbsp; cursor: pointer;&nbsp; transition: all ease-in-out 250ms;&nbsp; text-overflow: ellipsis;&nbsp; overflow: hidden;&nbsp; display: inline-block;}.content-title-padding {&nbsp; margin-left: 1em;&nbsp; margin-right: 1em;}figcaption a {&nbsp; text-decoration: none;&nbsp; color: #ffffff;}figcaption a:hover {&nbsp; text-decoration: none;&nbsp; color: #dbdbdb;}.content-title:hover {&nbsp; background-color: #1a1a1a;}.footer-title {&nbsp; user-select: none;&nbsp; color: #ffffff;&nbsp; text-align: center;&nbsp; line-height: 3em;&nbsp; width: 5em;&nbsp; font-size: 20px;&nbsp; margin-bottom: -6em;&nbsp; text-decoration: none;&nbsp; display: inline-block;}.footer-txt {&nbsp; user-select: none;&nbsp; color: #ffffff;&nbsp; text-align: center;&nbsp; line-height: 1em;&nbsp; margin-bottom: -5em;&nbsp; font-size: 16px;&nbsp; font-weight: normal;&nbsp; text-decoration: none;&nbsp; display: inline-block;}.footer {&nbsp; user-select: none;&nbsp; background-color: #1d1d1d;&nbsp; width: 100%;&nbsp; text-align: center;&nbsp; padding-bottom: 3em;}<!DOCTYPE html><html>&nbsp; <head>&nbsp; &nbsp; <meta charset="utf-8">&nbsp; &nbsp; <title>Site</title>&nbsp; &nbsp; <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">&nbsp; &nbsp; <link rel="stylesheet" href="style.css">&nbsp; &nbsp; <script src="https://kit.fontawesome.com/74494548e4.js" crossorigin="anonymous"></script>&nbsp; </head>&nbsp; <body>&nbsp; &nbsp; <ul class="top">&nbsp; &nbsp; &nbsp; <li class="li-top-active"><a href="#">Home</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Movies</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Series</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Animes</a></li>&nbsp; &nbsp; &nbsp; <li class="li-top"><a href="#">Help</a></li>&nbsp; &nbsp; </ul>&nbsp; <div class="media-div">&nbsp; &nbsp; <ul class="media">&nbsp; &nbsp; &nbsp; <h1 class="media-title">Movies</h1>&nbsp; &nbsp; &nbsp; <div class="search-box">&nbsp; &nbsp; &nbsp; &nbsp; <input class="search-txt" type="text" placeholder="Search here a movie">&nbsp; &nbsp; &nbsp; &nbsp; <a href="#" class="search-btn">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <i class="fas fa-search"></i>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; <li class="li-media"><button data-open="movies-highlights" class="active">Highlights</button></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><button data-open="movies-seen">Most seen</button></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><button data-open="movies-recent">Most recent added</button></li>&nbsp; &nbsp; &nbsp; <li class="li-media"><button data-open="movies-rated">Most rated</button></li>&nbsp; &nbsp; </ul>&nbsp; &nbsp; <div class="content-media" id="movies-highlights">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Highlights">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://mischalke04.files.wordpress.com/2010/06/the-highlights-poster.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Highlights</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="movies-seen">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most seen">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://i.pinimg.com/originals/31/22/ea/3122ea91ff43732c50c9fa8c5761271f.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Most seen</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="movies-recent">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most recent added">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://i.pinimg.com/originals/6e/66/03/6e6603be280359c8a62e0f2f498242ea.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Most recent added</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="content-media" id="movies-rated">&nbsp; &nbsp; &nbsp; <div class="content-media-padding"&nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="img-container" title="Most rated">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img&nbsp; src="https://d13ezvd6yrslxm.cloudfront.net/wp/wp-content/images/TFINYR-Poster-700x999.jpg" class="img">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <figcaption class="content-title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="content-title-padding"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">Most rated</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </figcaption>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div>&nbsp; </div>&nbsp; &nbsp; <div class="footer">&nbsp; &nbsp; &nbsp; <h1 class="footer-title">Help</h1>&nbsp; &nbsp; &nbsp; <br>&nbsp; &nbsp; &nbsp; <a href="#"><h1 class="footer-txt">Contact</h1></a>&nbsp; &nbsp; &nbsp; <br>&nbsp; &nbsp; &nbsp; <a href="#"><h1 class="footer-txt">Terms of service</h1></a>&nbsp; &nbsp; </div>&nbsp; </body></html>
0
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答