?? ?? ??
1, ???? ???? ??:
2, ?? ??:
index.html:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP中文網(wǎng)</title> <style> body{ margin: 0; margin-bottom: 80px; background-color:lightblue; } #banner{ height: 700px; background-image: url(2.jpg); font-size: 50px; line-height: 700px; text-align: center; margin-top: 80px; } #container{ width: 1000px; margin: 0 auto; } .text1{ text-indent: 2em; color:gray; } .text2{ text-indent: 2em; color: red; } .text3{ text-indent: 2em; color: green; } .text4{ text-indent: 2em; color: violet; } .text5{ text-indent: 2em; color: white; } .pic{ width: 100%; } #background{ height: 600px; background-image: url(13.jpg); background-size: 100% 100%; position: relative; z-index: -1; } #classmate1{ width: 200px; height: 250px; left: 240px; top: 150px; position: absolute; border-radius: 50%; border: solid 4px white; } #classmate2{ width: 150px; /*height: 200px;*/ right: 150px; top: 100px; position: absolute; border-radius: 50%; border: solid 4px white; } #classmate3{ width: 200px; height: 200px; left: 490px; bottom: 50px; position: absolute; border-radius: 50%; border: solid 4px white; } .text1:first-letter{ font-size: 40px; } .text2:first-letter{ font-size: 40px; } .text3:first-letter{ font-size: 40px; } .text4:first-letter{ font-size: 40px; } .text5:first-letter{ font-size: 40px; } #nav{ width: 100%; background-color: skyblue; height: 80px; left: 0; top: 0; position: fixed; z-index: 2; /*text-align: center;*/ } #inner-nav{ width: 1000px; margin: 0 auto; text-decoration: none; text-align: right; height: 80px; line-height: 80px; } #inner-nav a{ margin: 0 20px; text-decoration: none; color: blue; font-size: 24px; display: inline-block; height: 80px; } #inner-nav a:hover{ background-color: white; } h3{ font-family: 微軟雅黑; color: blue; } </style> </head> <body> <!--上部標(biāo)題欄--> <div id="nav"> <div id="inner-nav"> <a href="#haizei">我的海賊</a> <a href="#lufei">路飛簡介</a> <a href="#suolong">索隆簡介</a> <a href="#namei">娜美簡介</a> <a href="#qita">其他人物簡介</a> </div> </div> <!--輪播圖顯示頁面--> <div id="banner"></div> <!--內(nèi)容顯示頁面--> <div id="container"> <div> <h3 id="haizei">我的海賊</h3> <p class="text1">海賊王《ONE PIECE》(海賊王、航海王)簡稱“OP”,是日本漫畫家尾田榮一郎作畫的少年漫畫作品。在《周刊少年Jump》1997年8月4號開始連載。故事講述曾經(jīng)擁有一切的“海賊王”哥爾·D·羅杰,在臨死前留下了一句話,讓全世界的人們,趨之若鶩奔向大海,世界迎來了“大海賊時代”!其中主角蒙奇·D·路飛就是帶著自己的夢想奔向大海,在遙遠(yuǎn)的路途上找尋著志同道合的伙伴,一起進(jìn)入“偉大航道”,目標(biāo)當(dāng)上“海賊王”。2012年5月11日,《航海王》獲得第41回日本漫畫家協(xié)會賞。截至2015年6月15日,《航海王》以日本本土累計發(fā)行了3億2086萬6000本,被吉尼斯世界紀(jì)錄官方認(rèn)證為“世界上發(fā)行量最高的單一作者創(chuàng)作的系列漫畫”。2017年7月21日,日本紀(jì)念日協(xié)會通過認(rèn)證,將每年的7月22日設(shè)立為“ONE PIECE紀(jì)念日”。改編的電視動畫《航海王》于1999年10月20日起在富士電視臺首播。<img class="pic" src="12.jpg"> </div> <div> <h3 id="lufei">路飛簡介</h3> <p class="text2">蒙奇·D·路飛,日本漫畫《航海王》的主角,草帽海賊團、草帽大船團船長,極惡的世代之一。橡膠果實能力者,懸賞金5億貝里。夢想是找到傳說中的One Piece,成為海賊王。 他性格積極樂觀,愛憎分明且十分重視伙伴,不甘屈居于他人之下,對任何危險的事物都超感興趣。和其他傳統(tǒng)的海賊所不同的是,他并不會為了追求財富而無故殺戮,而是享受著身為海賊的冒險和自由。 從忘年交香克斯手里繼承了海賊王羅杰的草帽[1] 。 <img class="pic" src="11.jpg"> </div> <div> <h3 id="suolong">索隆簡介</h3> <p class="text3">羅羅諾亞·索隆,日本漫畫《航海王》及衍生作品中的角色,草帽一伙的劍士,使用三把刀戰(zhàn)斗的三刀流劍士,極惡的世代之一,也是二年前集結(jié)香波地群島的十一超新星之一[1] 。目前懸賞3億2000萬貝利[2] 。好嗜酒,實力強勁。 為了小時候與古伊娜的約定而踏上了前往世界第一劍士的道路,隨后成為主角蒙奇·D·路飛的第一個伙伴。在初次敗給世界第一劍士“鷹眼米霍克”后向路飛發(fā)誓永不再敗,并且更加努力的鍛煉自己。在兩年前草帽一伙被熊逐個擊飛后,遇見了米霍克。在鷹眼的幫助訓(xùn)練下,兩年后的他成功與伙伴們會合,并且為了實現(xiàn)自己的夢想,奔赴強者如云的新世界[3] 。和船上的廚師山治是形影不離的死對頭。 <img class="pic" src="5.jpg" > </div> <div> <h3 id="namei">娜美簡介</h3> <p class="text4">娜美,稱號:小賊貓,日本漫畫《海賊王》[1] 及衍生作品中的角色,女主角,草帽海賊團的航海士,路飛的第二個伙伴[2] ,懸賞6600萬貝里。 特征是橘色的短發(fā)(兩年后為波浪長發(fā))和左肩的刺青(風(fēng)車與橘子的圖案)。使用棍術(shù),現(xiàn)在武器為“魔法天候棒”。頭腦聰明又機靈,精通氣象學(xué)和航海術(shù),能用身體感知天氣,完美指示航路,是個能精確畫出航海圖的天才航海士。本質(zhì)上是個細(xì)心、善良、重視感情、嫉惡如仇、偶爾有些溫柔的能干的女性。最喜歡錢和橘子,夢想是要畫出全世界的地圖。 <img class="pic" src="7.jpg"> </div> <div> <h3 id="qita">其他人物簡介</h3> 山治,日本漫畫《航海王》及衍生作品中的角色。草帽一伙廚師,金發(fā),有著卷曲眉毛,永遠(yuǎn)遮住半邊臉的家伙,香煙不離口,最愛女人,很花心但很有風(fēng)度,海賊中的紳士。小時候在紅腳哲普那兒學(xué)習(xí)廚藝。踢技以快準(zhǔn)狠被海軍稱之為“黑足”,但從不愿意傷害任何的女性,哪怕是敵人。在經(jīng)過司法島一戰(zhàn)后也成了懸賞對象,首次懸賞就有7700萬貝里(但通緝令是畫上去的)。夢想是找到傳說之海All Blue而跟隨路飛一同進(jìn)入了偉大航路。是文斯莫克家族的第三子。 烏索普小時候是出名的吹牛大王,和村里的幾個孩子組成“烏索普海賊團”,自稱烏索普船長。發(fā)現(xiàn)克洛船長的陰謀后,立志要保護村里的人,和蒙奇·D·路飛并肩作戰(zhàn)。夢想是要成為勇敢的海上戰(zhàn)士。 喬巴是草帽海賊團的第五位伙伴,職位是船醫(yī)。原為磁鼓島庫蕾哈醫(yī)生最寵愛的馴鹿兼醫(yī)療助手[1] 。喬巴的恩人是“庸醫(yī)”希魯魯克,他身為野生馴鹿時本來沒有名字,“喬巴”也是由希魯魯克給他命名的,意思是他有一對連樹木都可以輕松砍倒的角。 <p class="text5"></p> <div id="background"> <img id="classmate1" src="14.jpg"> <img id="classmate2" src="9.jpg"> <img id="classmate3" src="10.jpg"> </div> </div> </div> </body> </html>