HTML靜態網頁成品作業(HTML+CSS)—— 家鄉南寧介紹網頁(2個頁面)

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

文章目錄

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


一、作品介紹

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

二、作品演示

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

三、代碼目錄

在這里插入圖片描述

四、網站代碼

HTML部分代碼

<div class="w"><div class="top">南寧</div><div class="nav"><a href="index.html">南寧首頁</a><a href="./jingdian.html">著名景點</a></div><div class="main"><div class="main_tit">南寧簡介</div><div class="main_desc">南寧市,簡稱“邕”,古稱邕州,別稱綠城。廣西壯族自治區轄地級市、首府、Ⅰ型大城市、二線城市 、北部灣經濟區、珠江—西江經濟帶和北部灣城市群核心城市、中國—東盟博覽會永久舉辦地、“一帶一路”經濟帶有機銜接的重要門戶城市、西部陸海新通道陸港型國家物流樞紐、南部戰區陸軍機關駐地。截至2022年,全市下轄7個區、4個縣、代管1個縣級市,總面積2.21萬平方千米。 2022年末,南寧市常住人口889.17萬人。</div><div class="main_img"><img src="./images/main1.jpeg" alt=""></div><div class="main_desc">南寧市位于廣西中部偏南,面向東南亞,背靠大西南,東鄰粵港澳,南臨北部灣,處于“一帶一路”的重要節點,是華南經濟圈、西南經濟圈、中國—東盟經濟圈的交匯點。具有近海、近邊,沿江、沿線“兩近兩沿”的特點,距中越邊境約200公里,是距離東盟國家最近的省會城市。平陸運河建成后,南寧港產城海融合發展的區位優勢更加凸顯。 南寧素有“中國綠城”“天下民歌眷戀的地方”等美譽,先后榮獲聯合國人居獎和全國文明城市、國家生態園林城市、國家衛生城市、國家森林城市、中國優秀旅游城市等稱號。</div><div class="main_desc">南寧市積極發展向海經濟,推動跨境產業融合發展,立足區位交通優勢向樞紐經濟轉型,服務構建中國—東盟命運共同體。 圍繞中國(廣西)自由貿易試驗區南寧片區產業發展規劃,培育發展現代金融、先進制造、數字經濟、智慧物流和文體醫療等五大重點產業集群,建設產業發展新高地。</div><div class="main_img"><img src="./images/main2.jpeg" alt=""></div></div><div class="footer">南寧&nbsp;&nbsp;?&nbsp;&nbsp;版權所有</div>

五、源碼獲取

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

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

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

相關文章

使用`dbus-monitor`命令深入了解DBus通信

使用dbus-monitor命令深入了解DBus通信 DBus是一種消息總線系統&#xff0c;它允許應用程序在運行時進行通信。在Linux系統中&#xff0c;DBus是一個重要的組成部分&#xff0c;特別是在桌面環境中&#xff0c;如GNOME或KDE。dbus-monitor是一個命令行工具&#xff0c;用于監視…

【Python】解決Python報錯:IndexError: list index out of range

???? 文章目錄 引言1. 錯誤詳解2. 常見的出錯場景2.1 循環中的索引錯誤2.2 錯誤的列表操作 3. 解決方案3.1 使用安全的訪問方法3.2 循環時使用正確的范圍 4. 預防措施4.1 編寫單元測試4.2 動態檢查列表長度 結語 引言 在Python中操作列表時&#xff0c;IndexError: list …

Web 版 | 開源數據庫設計軟件 | drawdb

文章目錄 簡介快速運行方式 1:本地運行方式 2:Docker 構建并運行方式 3:Docker 運行參考?? 目標: 安裝一個 Web 版本的 ER 圖設計軟件! ?? GitHub: https://github.com/drawdb-io/drawdb 【11.7k ?】 簡介 DrawDB:Free, simple, and intuitive database design …

算法學習筆記——二分搜索

二分搜索 在有序數組中確定num存在還是不存在&#xff1a; 當arr[m] num&#xff0c;則num存在當arr[m] > num&#xff0c;則 r m - 1&#xff0c;縮小r的范圍&#xff0c;繼續往左二分當arr[m] < num&#xff0c;則l m 1&#xff0c;縮小l的范圍&#xff0c;繼續往…

Android基礎-進程間通信

在Android系統中&#xff0c;跨進程通信&#xff08;IPC&#xff0c;Inter-Process Communication&#xff09;是實現不同應用程序或同一應用程序中不同進程間數據共享和交互的關鍵技術。Android提供了多種IPC機制&#xff0c;每種機制都有其特定的使用場景和優缺點。下面將詳細…

代碼隨想錄算法訓練營第36期DAY51

DAY51 121買賣股票的最佳時機 做過了。算是二刷&#xff1a;來自力扣優質題解 貪心&#xff1a; 每次記錄更新最小點和最大出售值。 class Solution {public: int maxProfit(vector<int>& prices) { int cur,resINT_MIN,curminINT_MAX; for(int…

從軍事角度理解“戰略與戰術”

戰略與戰術&#xff0c;均源于軍事術語。 戰略&#xff08;Strategy&#xff09;&#xff0c;源自希臘語詞匯“strategos&#xff08;將軍&#xff09;”和“strategia&#xff08;軍事指揮部&#xff0c;即將軍的辦公室和技能&#xff09;”。指的是指揮全局性作戰規劃的謀略…

【位運算】【前綴和】個人練習-Leetcode-1177. Can Make Palindrome from Substring

題目鏈接&#xff1a;https://leetcode.cn/problems/can-make-palindrome-from-substring/description/ 題目大意&#xff1a;給出一個字符串s&#xff0c;每次query給出l, r, k&#xff0c;要求判斷子串s[l:r1]在經過k次操作后是否能變為回文串。一次操作可以將子串內的一個字…

mysql 數據庫在liunx 上的備份和恢復

一. mysql 數據庫備份 sh 腳本 1. vim sqlback.sh #!/bin/bashUSER"root" #賬號 PASSWORD"123456" #密碼 DATABASE"test" #數據庫名 BACKUP_DIR"/home/dev/mysql" #備份存的目錄 TIMESTAMP$(date "%F") …

搭建python虛擬環境,并在VSCode中使用

創建環境 python -m venv E:\python\flask\venv激活環境 運行下圖所示的bat文件 退出環境 執行下面的語句 deactivateVSCode中配置&#xff1a; ①使用CTRLshiftp命令&#xff0c;使用CTRLshiftp命令&#xff0c;輸入&#xff1a; Python: Select Interpreter②選擇之前創建…

【計算視覺】學習計算機視覺你不得不膜拜的CVPR大神:何凱明

目錄 第一章&#xff1a;CVPR——計算機視覺的終極擂臺 第二章&#xff1a;何凱明——計算機視覺領域的耀眼星辰 第三章&#xff1a;高引用論文——計算機視覺研究的璀璨星辰 第四章&#xff1a;何凱明的CVPR論文——深度學習的探索之旅 第五章&#xff1a;結語——向何凱…

翻譯《The Old New Thing》- Why isn’t there a SendThreadMessage function?

Why isnt there a SendThreadMessage function? - The Old New Thing (microsoft.com)https://devblogs.microsoft.com/oldnewthing/20081223-00/?p19743 Raymond Chen 2008年12月23日 為什么沒有 SendThreadMessage 函數&#xff1f; 簡要 文章討論了 Windows 中不存在 Sen…

WHAT - 發布訂閱

目錄 一、常見實現方案1.1 使用事件發射器&#xff08;Event Emitter&#xff09;1.2 自定義事件系統&#xff08;EventBus&#xff09;1.3 使用庫如 PubSubJS1.4 使用框架內置的狀態管理工具Vue.jsReact (使用 Context API 或 Redux) 二、先后關系2.1 緩存事件數據2.2 使用 Re…

React hooks動態配置側邊欄

React hooks根據不同需求 還有不同的角色 動態的去配置側邊欄 需求&#xff1a; 點擊某個按鈕是一套側邊欄 &#xff0c;不同角色&#xff08;比如管理員之類的權限高一點&#xff09;比普通用戶多個側邊欄 然后點擊另一個按鈕是另一套側邊欄 此時&#xff0c;就需要動態的去…

【React】classnames 優化類名控制

1. 介紹 classnames是一個簡單的JS庫&#xff0c;可以非常方便的通過條件動態的控制class類名的顯示 ClassNames是一個用于有條件處理classname字符串連接的庫 簡單來說就是動態地去操作類名&#xff0c;把符合條件的類名粘在一起 現在的問題&#xff1a;字符串的拼接方式不…

KMeans聚類分析星

1. datasample initial_centroids datasample(data, k, Replace, false); 是MATLAB中的命令&#xff0c;用于從數據集data中隨機抽取k個樣本作為初始聚類匯總新&#xff0c;并且抽取時不放回。 datasample&#xff1a;是MATLAB中的函數&#xff0c;用于從數組中隨機抽取樣本d…

halcon算子之prepare_object_model_3d詳解

為某一操作準備三維對象模型。 Description 操作符prepare_object_model_3d準備3D對象模型ObjectModel3D,用于下面目的中給出的操作。它計算操作所需的值并將其存儲在ObjectModel3D中,從而加快了后續操作。沒有必要調用prepare_object_model_3d。但是,如果要多次使用3D對象…

5、js關于數組的常用方法(19種)

一、改變原數組的方法 1.push&#xff08;&#xff09; 末尾添加數據 語法&#xff1a; arr.push(要插入的數據可以多個) // push 尾部添加數據const arr [1,2,3,4,5];arr.push(6,7);console.log(arr);//(7) [1, 2, 3, 4, 5, 6, 7]2. pop&#xff08;&#xff09; 末尾刪除一…

大疆智圖_空三二維重建成果傳輸

一、軟件環境 1.1 所需軟件 1、 大疆智圖&#xff1a;點擊下載&#xff1b; ??2、 ArcGIS Pro 3.1.5&#xff1a;點擊下載&#xff0c;建議使用IDM或Aria2等多線程下載器&#xff1b; ??3、 IDM下載器&#xff1a;點擊下載&#xff0c;或自行搜索&#xff1b; ??4、 Fas…

探索 Noisee AI 的奇妙世界與變現之旅

日賺800&#xff0c;利用淘寶/閑魚進行AI音樂售賣實操 如何讓AI生成自己喜歡的歌曲-AI音樂創作的正確方式 抖音主播/電商人員有福了&#xff0c;利用Suno創作產品宣傳&#xff0c;讓產品動起來-小米Su7 用sunoAI寫粵語歌的方法&#xff0c;博主已經親自實踐可行 五音不全也…