時間：2023-10-12 10:06:02 | 來源：網(wǎng)站運營
時間：2023-10-12 10:06:02 來源：網(wǎng)站運營
制作一個簡單HTML靜態(tài)網(wǎng)頁（HTML+CSS）：精彩專欄推薦 文末獲取聯(lián)系 ?? 作者簡介: 一個熱愛把邏輯思維轉(zhuǎn)變?yōu)榇a的技術(shù)博主 作者主頁: 【主頁—— 獲取更多優(yōu)質(zhì)源碼】 web前端期末大作業(yè)： 【 畢設(shè)項目精品實戰(zhàn)案例 (1000套) 】 程序員有趣的告白方式：【 HTML七夕情人節(jié)表白網(wǎng)頁制作 (110套) 】 超炫酷的Echarts大屏可視化源碼：【 Echarts大屏展示大數(shù)據(jù)平臺可視化(150套) 】 HTML+CSS+JS實例代碼： 【 ?HTML+CSS+JS實例代碼 (炫酷代碼) 繼續(xù)更新中...】 免費且實用的WEB前端學(xué)習(xí)指南： 【 web前端零基礎(chǔ)到高級學(xué)習(xí)視頻教程 120G干貨分享】關(guān)于作者: 歷任研發(fā)工程師，技術(shù)組長，教學(xué)總監(jiān)；曾于2016年、2020年兩度榮獲CSDN年度十大博客之星。 十載寒冰，難涼熱血；多年過去，歷經(jīng)變遷，物是人非。 然而，對于技術(shù)的探索和追求從未停歇。 堅持原創(chuàng)，熱衷分享，初心未改，繼往開來！
在線咨詢
Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html編輯軟件進(jìn)行運行及修改編輯等操作）。 其中： （1） html文件包含：其中index.html是首頁、其他html為二級頁面； （2） css文件包含：css全部頁面樣式,文字滾動, 圖片放大等； （3） js文件包含：js實現(xiàn)動態(tài)輪播特效, 表單提交, 點擊事件等等（個別網(wǎng)頁中運用到j(luò)s代碼）。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/style.css"> <title>實驗3</title></head><body> <div class="bigbox"> <div class="imglogo"> <img src="picture/logo.jpg" alt=""> </div> <div class="banner"> <div class="heard"> <a href="">首頁</a> <a href="">新聞中心</a> <a href="">精彩圖片</a> <a href="">聯(lián)系我們</a> </div> <div class="xinwenlist"> <div class="xinwen_list"> <h1>新聞公告</h1> <ul> <li>吉狄馬加專訪：“我不會停止深情地呼喚”</li> <li>第37屆青春詩會詩叢上市丨詩人詩作選</li> <li>"在杭州：娜夜詩歌朗誦會"在南濱路舉行</li> </ul> </div> <div class="xinwen_list"> <h1>新聞資訊</h1> <ul> <li>頭條詩人 | 多多 ：在同一個夢里劃槳</li> <li>《莫礪鋒講宋詩課》：七十絕妙好詩，一門大學(xué)課程</li> <li>中國詩歌網(wǎng)每周精選第9期：一樽往事醉煙霞</li> </ul> </div> <div class="xinwen_list"> <h1>新聞動態(tài)</h1> <ul> <li>300元稿酬邀您來評《去大明寺》（11月30日截止）</li> <li>每日好詩評選（現(xiàn)代詩）第306期 網(wǎng)上公示 截止到11月28日</li> <li>每日好詩評選（舊體詩）第306期 網(wǎng)上公示 截止到11月28日</li> </ul> </div> </div> </div> <div class="msgs"> <div class="msgs_left"> <div class="title"> <a href="">首頁></a> <a href="">新聞中心></a> </div> <div class="msgnei"> <h1>木瓜</h1> <div class="neirong"> <div> <p class="shou">《詩經(jīng)·大雅·抑》有“投我以桃，報之以李”之句，后世“投桃報李”便成了，成語，比喻相互贈答，禮尚往來。比較起來，《衛(wèi)風(fēng)·木瓜》這一篇雖然也有從“投之以木瓜（桃、李），報之以瓊琚（瑤、玖）”生發(fā)出的成語“投木報瓊”（如托名宋尤袤《全唐詩話》就有“投木報瓊，義將安在”的記載），但“投木報瓊”的使用頻率卻根本沒法與“投桃報李”相提并論?？墒钦搨髡b程度還是《木瓜》更高，它是現(xiàn)今傳誦最廣的《詩經(jīng)》名篇之一。</p> <img src="picture/1.webp" alt=""> <p>對于這么一首知名度很高而語句并不復(fù)雜的先秦古詩，古往今來解析其主旨的說法居然也有七種之多（據(jù)張樹波《國風(fēng)集說》統(tǒng)計）。按，成于漢代的《毛詩序》云：“《木瓜》，美齊桓公也。衛(wèi)國有狄人之?dāng)?，出處于漕，齊桓公救而封之，遺之車馬器物焉。衛(wèi)人思之，欲厚報之，而作是詩也?！边@一說法在宋代有嚴(yán)粲（《詩緝》）等人支持，在清代有魏源（《詩古微》）等人支持。與毛說大致同時的三家詩，據(jù)陳喬樅《魯詩遺說考》考證，魯詩“以此篇為臣下思報禮而作”，王先謙《詩三家義集疏》意見與之相同。從宋代朱熹起，“男女相互贈答說”開始流行，《詩集傳》云：“言人有贈我以微物，我當(dāng)報之以重寶，而猶未足以為報也，但欲其長以為好而不忘耳。</p> </div> <div> <p>疑亦男女相贈答之詞，如《靜女》之類?！边@體現(xiàn)了宋代《詩》學(xué)廢序派的革新疑古精神。但這一說法受到清代《詩》學(xué)獨立思考派的重要代表之一姚際恒的批駁，《詩經(jīng)通論》云：“以（之）為朋友相贈答亦奚不可，何必定是男女耶！”現(xiàn)代學(xué)者一般從朱熹之說，而且更明確指出此詩是愛情詩。因此詩主旨說法多不同，而“木瓜”作為文學(xué)意象也就被賦予了多種不同的象征意義。其中“臣子思報忠于君主”“愛人定情堅于金玉”“友人饋贈禮輕情重”三種意象逐漸成為“木瓜”意象的主流內(nèi)涵。</p> <p>《木瓜》一詩，從章句結(jié)構(gòu)上看，很有特色。首先，其中沒有《詩經(jīng)》中最典型的句式——四字句。這不是沒法用四字句（如用四字句，變成“投我木瓜（桃，李），報以瓊琚（瑤、玖）；匪以為報，永以為好”，一樣可以），而是作者有意無意地用這種句式造成一種跌宕有致的韻味，在歌唱時易于取得聲情并茂的效果。其次，語句具有極高的重疊復(fù)沓程度。不要說每章的后兩句一模一樣，就是前兩句也僅一字之差，并且“瓊琚”“瓊瑤”“瓊玖”語雖略異義實全同，而“木瓜”“木桃”“木李”據(jù)李時珍《本草綱目》考證也是同一屬的植物．其間的差異大致也就像橘、柑、橙之間的差異那樣并不大。這樣，三章基本重復(fù)，而如此高的重復(fù)程度在整部《詩經(jīng)》中也并不很多，格式看起來就像唐代據(jù)王維詩譜寫的《陽關(guān)三疊》樂歌似的，——自然這是《詩經(jīng)》的音樂與文學(xué)雙重性決定的。</p> <p> “你贈給我果子，我回贈你美玉”</p> </div> <div> <p> ，與“投桃報李”不同，回報的東西價值要比受贈的東西大得多，這體現(xiàn)了一種人類的高尚情感（包括愛情，也包括友情）。這種情感重的是心心相印，是精神上的契合，因而回贈的東西及其價值的高低在此實際上也只具有象征性的意義，表現(xiàn)的是對他人對自己的情意的珍視，所以說“匪報也”?！巴段乙阅竟希ㄌ?、李），報之以瓊琚（瑤、玖）”，其深層語義當(dāng)是：雖汝投我之物為木瓜（桃、李），而汝之情實貴逾瓊琚（瑤、玖）；我以瓊琚（瑤、玖）相報，亦難盡我心中對汝之感激。清牛運震《詩志》評此數(shù)語云：“惠有大于木瓜者，卻以木瓜為言，是降一格襯托法；瓊瑤足以報矣，卻說匪報，是進(jìn)一層翻剝法。”他的話并非沒有道理，但將木瓜、瓊瑤之類已基本抽象化的物品看得太實，其他解此詩者似也有此病。實際上，作者胸襟之高朗開闊，已無衡量厚薄輕重之心橫亙其間，他想要表達(dá)的就是：珍重、理解他人的情意便是最高尚的情意。從這一點上說，后來漢代張衡《四愁詩》“美人贈我金錯刀，何以報之英瓊瑤”，盡管說的是“投金報玉”。其意義實也與“投木報瓊”無異。 </p> </div> </div> </div> </div> <div class="msgs_right"> <h1>圖文欣賞</h1> <ul> <li> <img src="picture/3.webp" alt=""> </li> <li> <img src="picture/4.webp" alt=""> </li> <li> <img src="picture/5.webp" alt=""> </li> </ul> </div> </div> <div class="yeshu"> <div class="number"> <a href="#">上一頁</a> <a href="#" class="kaung">1</a> <a href="#" class="kaung">2</a> <a href="#" class="kaung">3</a> <a href="#">下一頁</a> </div> </div> <div class="banquanxinxi"> 版權(quán)所有 </div> </div></body></html>* { margin: 0px; padding: 0px; list-style: none;}body { background-image: url(../image/17401.gif); background-repeat: repeat;}.bigbox { width: 1000px; margin: 0 auto; height: 200px;}.imglogo { width: 200px; margin: 0 auto; margin-bottom: 20px;}.imglogo img { width: 160px;}.banner { width: 100%; height: 450px; background-image: url(../image/bg.jpg); background-size: 100%;}.heard { width: 800px; height: 50px; margin: 0 auto; margin-bottom: 10px;}.heard a { height: 48px; line-height: 48px; text-decoration: none; display: inline-block; width: 160px; text-align: center; margin-top: 1px; color: black;}.heard a:not(:first-child) { margin-left: 48px;}.heard a:hover { background-color: rgba(117, 117, 117, 0.642);}.xinwenlist { margin-top: 410px; width: 1000px; display: flex;}.xinwen_list { width: 320px; display: inline-block; overflow: hidden;}.xinwen_list:not(:first-child) { margin-left: 20px;}.xinwen_list h1 { width: 100%; background-color: black; color: #fff; font-size: 14px; padding-left: 20px;}.xinwen_list ul { width: 100%; padding-top: 10px; background-color: #fff; padding-bottom: 10px;}.xinwen_list ul li::before { margin-right: 10px; margin-left: 20px; content: ''; display: inline-block; width: 0px; height: 0px; border-top: 4px solid transparent; border-left: 4px solid red; border-bottom: 4px solid transparent; border-bottom: 4px solid transparent;}.xinwen_list ul li { width: 250px; height: 20px; font-size: 12px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}.xinwen_list ul li:hover { color: brown;}.msgs { width: 1000px; display: flex; margin-top: 120px;}.msgs_left { width: 700px; margin-right: 10px; background-color: #BEC6BF;}.title { height: 28px; line-height: 28px; background-color: rosybrown;}.title a { color: black; text-decoration: none; font-size: 12px;}.msgnei { width: 96%; padding-top: 1%; margin-left: 1%; padding-left: 1%; padding-right: 1%; margin-top: 10px;}.msgnei h1 { width: 100%; height: 28px; font-size: 18px; line-height: 28px; background-color: chocolate; text-align: center;}.neirong { width: 100%; display: flex;}.neirong p { font-size: 14px;}.neirong div { margin-top: 20px; width: 33.4%;}.neirong div:nth-child(2) { padding-left: 1%; padding-right: 1%; margin-left: 1%; margin-right: 1%; border-right: 1px dashed rgb(81, 81, 81); border-left: 1px dashed rgb(81, 81, 81);}.neirong img { width: 70%; margin-left: 15%; margin-top: 10px; margin-bottom: 10px;}.shou:first-letter { font-size: 28px; font-weight: bold; font-family: 黑體;}.msgs_right { width: 30%; background-color: rgb(226, 226, 226); overflow: hidden;}.msgs_right h1 { width: 100%; height: 28px; font-size: 18px; line-height: 28px; background: linear-gradient(to bottom, #8C6D74, 52%, #B2A6BE); padding-left: 20px; margin-bottom: 20px;}.msgs_right ul { width: 100%;}.msgs_right ul li { width: 200px; height: 90px; overflow: hidden; background-color: violet; text-align: center; margin-left: 45px; margin-bottom: 70px;}.msgs_right ul li:first-child { animation: donghua 0.5s infinite; animation-delay: 1s linear; animation-iteration-count: 1;}.msgs_right ul li:nth-child(2) { animation: donghua 0.5s infinite; animation-delay: 2s linear; animation-delay: 2s; animation-iteration-count: 1;}.msgs_right ul li:nth-child(3) { animation: donghua 0.5s infinite; animation-delay: 2s linear; animation-delay: 3s; animation-iteration-count: 1;}.msgs_right ul li img { width: 100%;}@keyframes donghua { from { width: 200px; height: 90px; margin-left: 45px; margin-bottom: 70px; } to { width: 220px; height: 99px; margin-left: 40px; margin-bottom: 66px; }}.yeshu { width: 1000px; margin: 0 auto; background-color: #fff}.number { width: 693px; height: 50px; background-color: #fff; text-align: center; line-height: 50px;}.number a { text-decoration: none;}.kaung { display: inline-block; height: 20px; width: 30px; border: 1px solid #ccc; background-color: rgb(209, 209, 209); position: relative; line-height: 20px;}.banquanxinxi { width: 1000px; text-align: center; font-size: 14px; background-color: #fff; line-height: 40px;}請 “ 點贊” “??評論” “ 收藏”一鍵三連哦！ 【 關(guān)注我| 獲取更多源碼 | 優(yōu)質(zhì)文章】帶您學(xué)習(xí)各種前端插件、3D炫酷效果、圖片展示、文字效果、以及整站模板 、大學(xué)生畢業(yè)HTML模板 、期末大作業(yè)模板 、等! 「在這里有好多 前端 開發(fā)者，一起探討 前端 Node 知識，互相學(xué)習(xí)」！關(guān)鍵詞：靜態(tài),簡單
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。
