HTML靜態網頁成品作業(HTML+CSS)——游戲陰陽師介紹網頁(4個頁面)

🎉不定期分享源碼,關注不丟失哦

文章目錄

  • 一、作品介紹
  • 二、作品演示
  • 三、代碼目錄
  • 四、網站代碼
    • HTML部分代碼
  • 五、源碼獲取


一、作品介紹

🏷?本套采用HTML+CSS,未使用Javacsript代碼,共有4個頁面

二、作品演示

在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述
在這里插入圖片描述

三、代碼目錄

在這里插入圖片描述

四、網站代碼

HTML部分代碼

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>陰陽師</title><link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body><div class="wrapper"><!-- 頭部 --><div class="header"><div class="logo"><img src="./images/logo.jpeg"></div><div class="nav"><a href="index.html" class="active">游戲首頁</a><a href="tupian.html" >精彩圖片</a><a href="pingjia.html" >游戲評價</a><a href="login.html">我要登錄</a></div></div><div class="banner"><img src="./images/banner.jpg"></div><div class="main"><h2>游戲背景</h2><p>故事發生在人鬼共生的年代,原本屬于陰界的魑魅魍魎,潛藏在人類的恐慌中伺機而動,陽界的秩序岌岌可危。幸而世間有著一群懂得觀星測位、畫符念咒,還可以跨越陰陽兩界,甚至支配靈體的異能者,他們正各盡所能,為了維護陰陽兩界的平衡賭上性命戰斗并被世人尊稱為“陰陽師”  。</p><h2>游戲角色</h2><table border="1" ><tr><td><img src="./images/1.png"></td><td><h4>晴明</h4><p>平安時代強大的陰陽師,性格冷峻飄逸。擁有忠誠的守護式神——小白,并先后認識了神樂、源博雅和八百比丘尼三位伙伴。</p></td></tr><tr><td><img src="./images/2.png"></td><td><h4>神樂</h4><p>源氏的后代,性格單純善良,具備通靈能力,被晴明遇到帶回庭院。</p></td></tr><tr><td><img src="./images/3.png"></td><td><h4>源博雅</h4><p>平安時代貴族,是皇室之后,同時也是一名武士。性格孤傲爽直,善用大弓,其弓箭具有射殺妖怪之力。從小桀驁不馴,喜歡冒險與挑戰。遇到晴明和神樂之后,便經常光顧庭院。</p></td></tr><tr><td><img src="./images/4.png"></td><td><h4>八百比丘尼</h4><p>誤食人魚肉不老不死,已活了幾百年的神秘巫師。占卜到晴明是命中注定可以幫助其解除詛咒之人,便居住在鳳凰林中等待晴明,后來便一直留在庭院。</p></td></tr></table></div><!-- 底部 --><div class="footer"><div>陰陽師 版權所有</div></div></div>
</body>
</html>

五、源碼獲取

🥇 ~ 關注我,點贊博文~ 每天帶你漲知識!
🎁1.看到這里了就[點贊+好評+收藏]三連 支持下吧,你的「點贊,好評,收藏」是我創作的動力。
💙2.想要獲取本文源碼,點擊前往吧

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/17433.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/17433.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/17433.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Android ANR簡介

ANR&#xff08;App not respond&#xff09;是Android定義的一種穩定性問題類型&#xff1b;系統發出關鍵消息&#xff0c;同時發出此消息的超時消息。處理邏輯有兩種情況&#xff1a; 關鍵消息被執行&#xff0c;超時消息被清除&#xff1b;ANR不會發生超時消息被執行&#x…

JAVASE2

封裝的步驟&#xff1a; 1、所有屬性私有化&#xff0c;使用private關鍵字進行修飾&#xff0c;private表示私有的&#xff0c;修飾的所有數據只能在本類中訪問 2、對外提供簡單入口&#xff1a;比如說被private修飾的成員變量&#xff0c;在其他類中只能通過getXxx/setXxx方法…

網絡風暴:揭秘DDoS攻擊的幕后黑手

在數字化時代的浪潮中&#xff0c;網絡攻擊已成為一種新型的戰爭手段。其中&#xff0c;分布式拒絕服務攻擊&#xff08;DDoS&#xff09;以其強大的破壞力和隱蔽性&#xff0c;成為網絡安全領域的一大挑戰。DDoS攻擊通過發動海量的惡意流量&#xff0c;如同狂風暴雨般席卷目標…

如何設置遠程桌面連接?

遠程桌面連接是一種方便快捷的遠程訪問工具&#xff0c;可以幫助用戶在不同地區間快速組建局域網&#xff0c;解決復雜網絡環境下的遠程連接問題。本文將針對使用遠程桌面連接的操作步驟進行詳細介紹&#xff0c;以幫助大家快速上手。 步驟一&#xff1a;下載并安裝遠程桌面連接…

芯片絲印反查

芯片絲印反查網 - IC芯片絲印,IC芯片代碼,IC芯片印字,IC芯片頂標,SMD code,marking code,top mark芯查查-電子信息產業數據引擎 ic/芯片絲印反查網-芯查查

各種情況下的線纜大小選擇

開口線鼻子和導線對應大小 開口銅鼻子對應線徑大小 變壓器容量對應高壓側電流大小 開關電流線纜功率對照表 家庭/工業最常用電線銅線電流承載功率 電工常用名詞對應符號 導線面積承載的安全載流量及允許負荷對照表 漏電保護器選擇參考表 電動機功率換算電流 電機功…

Python正則模塊re方法介紹

Python 的 re 模塊提供了多種方法來處理正則表達式。以下是一些常用的方法及其功能介紹&#xff1a; 1. re.match() 在字符串的開始位置進行匹配。 import repattern r\d string "123abc456"match re.match(pattern, string) if match:print(f"匹配的字符…

代碼隨想錄——最大二叉樹(Leetcode654)

題目鏈接 遞歸 二叉樹 /*** Definition for a binary tree node.* public class TreeNode {* int val;* TreeNode left;* TreeNode right;* TreeNode() {}* TreeNode(int val) { this.val val; }* TreeNode(int val, TreeNode left, TreeNode rig…

.NET 輕量級、高效任務調度器:ScheduleTask

前言 至于任務調度這個基礎功能&#xff0c;重要性不言而喻&#xff0c;大多數業務系統都會用到,世面上有很多成熟的三方庫比如Quartz&#xff0c;Hangfire&#xff0c;Coravel 這里我們不討論三方的庫如何使用 而是從0開始自己制作一個簡易的任務調度,如果只是到分鐘級別的粒…

全能集成開發平臺Team·IDE

三甲醫院的床位太難等了。反正也是小手術&#xff0c;老蘇周五在附近找了家二甲醫院&#xff0c;幸運的是&#xff0c;門診迅速為我開具了入院證。周六早晨就接受了手術&#xff0c;周日掛了一天水&#xff0c;周一下午就出院了。準備在家先休息兩天。 2~4 周之后把支架取出來…

阿里云海外視頻安全的DRM加密

隨著科技的進步&#xff0c;視頻以直播或錄播的形式陸續開展海外市場&#xff0c;從而也衍生出內容安全的問題&#xff0c;阿里云在這方面提供了完善的內容安全保護機制&#xff0c;適用于不同的場景&#xff0c;如在視頻安全提供DRM加 由圖可以了解到阿里云保護直播安全的方法…

Java的 File類

Java的 File類 File類&#xff1a;相關方法&#xff1a;構造方法&#xff1a;創建文件/目錄&#xff1a;重命名&#xff1a;判斷&#xff1a;獲取&#xff1a;刪除&#xff1a; 路徑&#xff1a;相關操作&#xff1a;操作1&#xff1a;目錄存在&#xff1a;一層級的目錄不存在:…

c++模板與泛型編程

模板的作用&#xff1a;通過使用模板降低重復代碼的編寫&#xff0c;把已經寫好的代碼作用最大化&#xff1b; 模板的概念 1.模板與泛型編程&#xff08;目的時只進行邏輯操作&#xff0c;不需要考慮數據類型&#xff0c;將類型作為參數傳遞&#xff09; 模板是實現代碼重用…

【軟件設計師】程序語言

1.程序設計語言基本概念 1.1 低級語言與高級語言 低級語言&#xff1a;機器語言和匯編語言稱為低級語言 機器語言指0.&#xff0c;1組成的機器指令序列 匯編語言指用符號表示指令的語言&#xff0c;如MOV AX&#xff0c;2 高級語言&#xff1a;從人類的邏輯角度出發&#xff0…

numpy-mkl的下載地址

不要使用pip3直接在終端安裝&#xff0c;因為pip3默安裝的是numpy&#xff0c;而不是numpymkl。 采用在第三方庫中手動下載后&#xff0c;再安裝的方式。 第三方庫網址&#xff1a;https://www.lfd.uci.edu/~gohlke/pythonlibs/#numpy 如果不能進入就可以選擇去git里面&#x…

(三)MobaXterm、VSCode、Pycharm ssh連接服務器并使用

背景&#xff1a;根據前兩篇文章操作完成后&#xff0c; 手把手教學&#xff0c;一站式安裝ubuntu及配置服務器-CSDN博客 手把手教學&#xff0c;一站式教你實現服務器&#xff08;Ubuntu&#xff09;Anaconda多用戶共享-CSDN博客 課題組成員每人都有自己的帳號了&#xff0…

嵌入式0基礎開始學習 Ⅲ Linux基礎(3)正則表達式

0.問題引入 字符串是計算機應用中最為廣泛的處理對象之一(瀏覽器&#xff0c;xml文件&#xff0c;代碼) 并且字符串的組合規則形式各種各樣&#xff0c;如&#xff1a; 數字字符串 email字符串 IP地址字符串 網址 …

互聯網政務應用安全管理規定:使用安全連接方式訪問

前幾日&#xff0c;由中央網絡安全和信息化委員會辦公室、中央機構編制委員會辦公室、工業和信息化部、公安部等4部門聯合制定的《互聯網政務應用安全管理規定》&#xff08;以下簡稱規定&#xff09;發布了&#xff0c;規定定義了互聯網政務應用&#xff0c;也對互聯網政務應用…

Android數據緩存框架 - 內存數據載體從LiveData到StateFlow

引言&#xff1a;所有成功者的背后&#xff0c;都有一份艱苦的歷程&#xff0c;不要只看到了人前的風光&#xff0c;而低估了他們背后所付出的努力。 隨著flow到流行度越來越高&#xff0c;有開發者呼吁我使用flow&#xff0c;于是我就如你們所愿&#xff0c;新增了StateFlow作…

智能時代下,人機交互和虛擬現實的機遇和挑戰

智能時代下,人機交互和虛擬現實的機遇和挑戰