我正在为我的网站制作网站,我想手工制作这个网站,以便发展html技能。我正在使用Neocities的内置html编辑器。
我现在已经构建了a home page,几乎已经完成了(我只需要使链接的三个页面排在最前面即可,但我知道该怎么做。)
我的问题是:我不知道如何有效地添加漫画页面。
这是我在努力的地方:
我可以弄清楚如何制作和链接首页和最后一页按钮,但不能制作和链接下一页和上一页按钮。我也想不出如何在不重新构建每个页面的整个站点的情况下更轻松地添加页面。任何帮助,将不胜感激!这是我当前的代码(非常业余):
body { font-family: Arial, Helvetica, sans-serif; height: 100%; } /*by the way if anyone sees this note do you have any idea why my tiles don't extend all the way to the edge? it's been bothering me*/ #BGPics { background: url(https://okite-shinji-kun.neocities.org/beantower.png) left bottom no-repeat, url(https://okite-shinji-kun.neocities.org/tile.png) left top repeat; background-size: 600px, 168px; } header { text-align: center; font-size: 35px; font-family: "Times New Roman", Times, serif; LINE-HEIGHT:5px; color: #FF2963; height: auto; } h3 { font-size: 25px; font-family: "Times New Roman", Times, serif; LINE-HEIGHT:5px; color: #E9B9C8; letter-spacing: 7px; } footer { background-color: #1B1421; padding: 10px; margin: 0px; width:100%; text-align: center; color: white; } /*RESPONSIVE LAYOUT: i started this page from a tutorial thing and i dont know if this part is still relevant because ive tweaked it so much. also the comicpic and frame sections are messy but i wasnt sure how else to get a border around my image*/ @media (max-width: 600px) { comicpic { padding: 30px; height: auto; margin: auto; } } } p { word-break: break-all; } .inline-block { display: inline-block; } .verticalcenter { display: table-cell; vertical-align: middle; } .frame { width: 643px; height: auto; background: #1B1421; padding: 25px 25px; margin: auto; }
<!DOCTYPE html> <html lang="en"> <head> <title>OSK</title> <meta charset="utf-8"> </head> <body style="background-color: #FFAED2;" > <div id="BGPics"> <header> <div id="banner" align="center"> <div class="inline-block verticalcenter"> <img src="https://okite-shinji-kun.neocities.org/title.png" alt="起きて心慈くん!(Wake up, Shinji-kun!)" style="height: 230px; width:680px; padding-bottom: 10px" > </div> <div class="inline-block verticalcenter"> <a href="/humans.html"> <img src="https://okite-shinji-kun.neocities.org/humans_y.png" alt="HUMANS" style="height: 50px; width: 150px; padding-left: 20px; padding-right: 10px"></a> </div> <div class="inline-block verticalcenter"> <a href="/archive.html"><img src="https://okite-shinji-kun.neocities.org/archive_y.png" alt="ARCHIVE" style="height: 50px; width: 188px; padding: 10px;"></a> </div> <div class="inline-block verticalcenter"> <a href="/about.html"><img src="https://okite-shinji-kun.neocities.org/about_y.png" alt="ABOUT" style="height: 50px; width: 150px; padding-left: 10px, padding-right: 20px;"></a> </div> </div> </header> <div align="center" class=frame> <comicpic> <img src="https://okite-shinji-kun.neocities.org/block%20img.png" alt="BLANK SHAPE IN THE SIZE OF MY ACTUAL COMPIC PAGES" style="width:643px;"> </comicpic> </div> <footer> <p>Footer</p> </footer> </div> </body> </html>
我正在为我的网站制作网站,我想手工制作这个网站,以便发展html技能。我正在使用Neocities的内置html编辑器。我现在已经建立了一个主页,......>
我认为该网站将通过使用javascript帮助您解决分页问题https://www.thatsoftwaredude.com/content/6125/how-to-paginate-through-a-collection-in-javascript抛出说明,这些说明为js函数提供了很好的解释。