整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
最后這些關(guān)于html的內(nèi)容有點(diǎn)查漏補(bǔ)缺的意思了，這一次是關(guān)于文本內(nèi)鏈接的使用方法，簡單來說就是我們的頁面中有一個(gè)章節(jié)名稱目錄，如何點(diǎn)擊目錄中的名稱，就能正好在頁面中顯示相應(yīng)內(nèi)容。
如圖所示：
點(diǎn)擊目錄的"總體評價(jià)"跳轉(zhuǎn)到相應(yīng)內(nèi)容，如圖：
就是這樣的一個(gè)效果。在很多網(wǎng)頁中經(jīng)常看到。
這個(gè)案例我們會(huì)分三部分來講解。
今天主要學(xué)習(xí)如何使用<a>標(biāo)簽進(jìn)行頁面內(nèi)鏈接，已及從其他網(wǎng)頁鏈接該頁面內(nèi)的指定內(nèi)容。
這里會(huì)有一個(gè)問題，就是點(diǎn)擊鏈接后，文字內(nèi)容會(huì)置頂顯示，這個(gè)默認(rèn)形式會(huì)給我們帶來不便，解決方案較復(fù)雜，會(huì)在最后一次講解中給出。
下一次我們來學(xué)習(xí)如何對圖片添加映射超鏈接，映射超鏈接的意思是，假如我的圖片中有兩個(gè)人物或物象，考慮讀者會(huì)感興趣，想了解更多內(nèi)容，如何框選出物象邊緣來添加鏈接，這就是圖像映射超鏈接。如圖：使用一個(gè)平時(shí)不可見的邊框來制作圖片映射鏈接，確保感興趣的讀者能點(diǎn)擊到畫面中的目標(biāo)物體。
最后一部分我們將回答今天結(jié)尾的問題，也就是如何解決置頂問題。這一部分也會(huì)作為HTML部分結(jié)束的綜合練習(xí)，和css部分啟蒙的預(yù)熱練習(xí)。，
首先看一下今天的基礎(chǔ)代碼
<!DOCTYPE HTML>
<html>
<head>
<title>文內(nèi)鏈接</title>
</head>
<body >
<a>試飛進(jìn)程</a>
<a>研制情況</a>
<a>服役動(dòng)態(tài)</a>
<a>總體評價(jià)</a>
<p>
<h2><a>試飛進(jìn)程</a></h2>
殲-20隱形戰(zhàn)斗機(jī)首架技術(shù)驗(yàn)證機(jī)于2011年1月11日中午12時(shí)50分左右進(jìn)行首次升空飛行測試，13時(shí)08分成功著陸，歷時(shí)18分鐘。<br>整個(gè)首飛過程在殲-10S戰(zhàn)斗教練機(jī)陪伴下完成 。2016年10月28日，首次發(fā)布"空軍試飛員將駕殲-20飛機(jī)亮相中國航展"后，還陸續(xù)發(fā)布了"殲-20戰(zhàn)機(jī)列裝空軍作戰(zhàn)部隊(duì)""空軍殲-20戰(zhàn)機(jī)首次開展海上方向?qū)崙?zhàn)化訓(xùn)練"等。
<h2><a>研制情況</a></h2>
在2016年11月1日，第十一屆珠海航展，殲-20首次進(jìn)行空中飛行展示。兩架殲-20做了公開飛行，不僅在現(xiàn)場引起轟動(dòng)，也立刻被西方媒體大量報(bào)道。殲-20是中國現(xiàn)代空中力量的代表作，也進(jìn)入了世界最先進(jìn)的第五代戰(zhàn)斗機(jī)行列，它是中國國防能力高速發(fā)展的一個(gè)象征。<br>2018年11月11日，第十二屆中國航展在珠海迎來"高光時(shí)刻"：殲-20戰(zhàn)機(jī)在公開飛行展示中掛彈開倉，震撼獻(xiàn)禮人民空軍成立69周年紀(jì)念日。 <br>2019年10月13日，慶祝人民空軍成立70周年航空開放活動(dòng)新聞發(fā)布上，空軍新聞發(fā)言人申進(jìn)科大校介紹殲-20戰(zhàn)機(jī)列陣人民空軍"王牌部隊(duì)"
<h2><a>服役動(dòng)態(tài)</a></h2>
2017年3月9日，中央電視臺(tái)報(bào)道殲-20戰(zhàn)斗機(jī)正式進(jìn)入空軍序列。<br>2017年3月13日，《中國日報(bào)》發(fā)布消息稱，中國自主研制的殲-20近期將裝配國產(chǎn)發(fā)動(dòng)機(jī)。<br>2017年7月30日，殲-20三機(jī)編隊(duì)參加在朱日和舉行的慶祝中國人民解放軍成立90周年閱兵。殲擊機(jī)梯隊(duì)飛來，3架殲-20隱形戰(zhàn)斗機(jī)以楔形編隊(duì)的形式在天空中飛過。<br>2017年9月28日，在中國國防部行記者會(huì)上，國防部新聞發(fā)言人吳謙大校介紹殲-20飛機(jī)已經(jīng)列裝部隊(duì)。<br>2017年11月10日上午，中國空軍發(fā)言人申進(jìn)科大校表示，殲-20 列裝部隊(duì)后，已經(jīng)開展編隊(duì)訓(xùn)練。<br>2018年2月9日，中國空軍新聞發(fā)言人申進(jìn)科大校發(fā)布消息，殲-20開始列裝空軍作戰(zhàn)部隊(duì)。<br>2018年10月30日，中國空軍4架殲-20隱形戰(zhàn)斗機(jī)現(xiàn)身珠海金灣機(jī)場上空。<br>2019年10月1日，殲-20現(xiàn)身慶祝中華人民共和國成立70周年閱兵式；閱兵中，殲-20與殲-16、殲-10C三型飛機(jī)分別以5機(jī)楔隊(duì)組成戰(zhàn)斗隊(duì)形接受檢閱；該三款殲擊機(jī)被譽(yù)為中國空軍殲擊機(jī)家族的"三劍客"，是未來聯(lián)合作戰(zhàn)的骨干力量
<h2><a>總體評價(jià)</a></h2>
殲-20是眼下亞洲區(qū)域最先進(jìn)的戰(zhàn)機(jī)，這讓中國空軍在面對日本、韓國與印度等國家的空軍時(shí)占有顯著優(yōu)勢。外媒將殲-20與其他國家戰(zhàn)機(jī)進(jìn)行了對比。俄羅斯蘇霍伊蘇-57戰(zhàn)斗機(jī)由于研制進(jìn)度幾度推遲，尚未正式交付入役；美國F-35戰(zhàn)斗機(jī)也多次出現(xiàn)飛機(jī)供氧不足的問題，大面積停飛，出口受阻；韓國KF-X隱形戰(zhàn)機(jī)先是被爆出因掌握不了關(guān)鍵技術(shù)而被迫降成四代半戰(zhàn)機(jī)的情況，后又傳出了合作方印尼打算撤資并已告知韓國的消息。因此，中國殲-20戰(zhàn)機(jī)成為亞太區(qū)域領(lǐng)跑的優(yōu)勢戰(zhàn)機(jī)。<br>中國空軍正向全疆域作戰(zhàn)的現(xiàn)代化戰(zhàn)略性軍種邁進(jìn)，成為有效塑造態(tài)勢、管控危機(jī)、遏制戰(zhàn)爭、打贏戰(zhàn)爭的重要力量。殲-20戰(zhàn)機(jī)列裝空軍作戰(zhàn)部隊(duì)，將進(jìn)一步提升空軍綜合作戰(zhàn)能力，有助于空軍更好的肩負(fù)起維護(hù)國家主權(quán)、安全和領(lǐng)土完整的神圣使命。<br>殲20是我國自主研制的第五代戰(zhàn)斗機(jī)，它的研制實(shí)現(xiàn)了既定的四大目標(biāo)——打造跨代新機(jī)、引領(lǐng)技術(shù)發(fā)展、創(chuàng)新研發(fā)體系、建設(shè)卓越團(tuán)隊(duì)。打造跨代新機(jī)，是按照性能、技術(shù)和進(jìn)度要求，研制開發(fā)我國自己的新一代隱身戰(zhàn)斗機(jī)。引領(lǐng)技術(shù)發(fā)展，指通過自主創(chuàng)新實(shí)現(xiàn)強(qiáng)軍興軍的目標(biāo)。殲20在態(tài)勢感知、信息對抗、協(xié)同作戰(zhàn)等多方面取得了突破，這是中國航空工業(yè)從跟跑到并跑，再到領(lǐng)跑的必由之路。創(chuàng)新研發(fā)體系，是指建設(shè)最先進(jìn)的飛機(jī)研制條件和研制流程。通過一大批大國重器的研制，我們建立了具有我國特色的數(shù)字化研發(fā)體系。建設(shè)卓越團(tuán)隊(duì)，是指通過型號(hào)研制，錘煉一支愛黨愛國的研制隊(duì)伍，這些擁有報(bào)國情懷、創(chuàng)新精神的優(yōu)秀青年是航空事業(yè)未來發(fā)展的生力軍。未來，我們將在戰(zhàn)斗機(jī)的機(jī)械化、信息化、智能化發(fā)展征程上不斷前行。
</p>
</body>
</html>看著復(fù)雜，實(shí)際上主要都是些內(nèi)容文字，簡化后的代碼如下：
<!DOCTYPE HTML>
<html>
<head>
<title>文內(nèi)鏈接</title>
</head>
<body >
<a>試飛進(jìn)程</a>
<a>研制情況</a>
<a>服役動(dòng)態(tài)</a>
<a>總體評價(jià)</a>
<p>
<h2><a>試飛進(jìn)程</a></h2>
殲-20隱形........首次開展海上方向?qū)崙?zhàn)化訓(xùn)練"等。
<h2><a>研制情況</a></h2>
在2016年......"王牌部隊(duì)"
<h2><a>服役動(dòng)態(tài)</a></h2>
2骨干力量
<h2><a>總體評價(jià)</a></h2>
殲-20是眼下亞洲區(qū)域最先進(jìn)的戰(zhàn)機(jī)......不斷前行。
</p>
</body>
</html>就是在<body></body>中添加四個(gè)<a></a>標(biāo)簽來寫入標(biāo)題，并列寫入一個(gè)<p></p>標(biāo)簽，并在<p></p>標(biāo)簽中添加文字內(nèi)容和<h2></h2>標(biāo)簽。這時(shí)需要注意的是，<h2></h2>中還要用<a></a>標(biāo)簽夾住標(biāo)題。
頁面效果如下：
下面我們來添加文章內(nèi)部鏈接
添加文章內(nèi)部鏈接需要一前一后兩個(gè)<a></a>標(biāo)簽。一個(gè)是目錄中的<a></a>,如圖：
一個(gè)是正文中的標(biāo)題上的<a></a>,如圖：
添加內(nèi)部鏈接的辦法非常簡單，首先我們把目錄中的標(biāo)題<a></a>標(biāo)簽稱為"召喚者"。把正文中的標(biāo)題中的<a></a>標(biāo)簽稱為"被召喚者"。如果您學(xué)過《》這篇教程就會(huì)知道，一個(gè)標(biāo)簽召喚或調(diào)用另一個(gè)標(biāo)簽需要能叫出被調(diào)用標(biāo)簽的名字！
所以先要給"被召喚者"起名字，起名字的方法有兩種，一種是name=""，還有一種是id=""，建議大家都寫上，因?yàn)橛械臑g覽器不支持name屬性。具體寫法如下：
<h2><a name="chapter1" id="chapter1">試飛進(jìn)程</a></h2>在"召喚者"<a>標(biāo)簽中使用href屬性來叫出"被召喚者"的名字！示例代碼如下：需要在引號(hào)中添加#后再寫名字。
<!DOCTYPE HTML>
<html>
<head>
<title>文內(nèi)鏈接</title>
</head>
<body >
<a href="#chapter1">試飛進(jìn)程</a><!--看這里-->
<a>研制情況</a>
<a>服役動(dòng)態(tài)</a>
<a>總體評價(jià)</a>
</body>
</html><a>標(biāo)簽有點(diǎn)懶，只叫名字的話它會(huì)假裝聽不見，所以還要具體描述它的特征，讓它不好意思偷懶，也就是前后兩個(gè)<a></a>標(biāo)簽中間夾的文字內(nèi)容要一致，比如上文中的兩個(gè)<a>中間的內(nèi)容都是"試飛進(jìn)程"。如果字不一樣，休想叫得動(dòng)"被召喚者"。
效果如下：
點(diǎn)擊后，試飛進(jìn)程標(biāo)簽跳到了視窗的最頂端，如圖：這種頂在視窗頂端的顯示的方式我們稱之為"置頂"。
下面我們使用這個(gè)方法，為剩下的標(biāo)題添加頁面內(nèi)鏈接。
打開外部頁面中指定信息位置的方法
首先，我們復(fù)制一下這個(gè)頁面文件命名為"打開外部頁面文件指定位置.html"，然后刪掉<p></p>和其中內(nèi)容。示例代碼如下：
<!DOCTYPE HTML>
<html>
<head>
<title>打開外部頁面文件指定位置</title>
</head>
<body >
<a href="#chapter1">試飛進(jìn)程</a>
<a href="#chapter2">研制情況</a>
<a href="#chapter3">服役動(dòng)態(tài)</a>
<a href="#chapter4">總體評價(jià)</a>
</body>
</html>方法非常簡單，在href中添加外部頁面路徑即可！示例代碼如下：
<a href="文內(nèi)鏈接ceshi.html#chapter1">試飛進(jìn)程</a>依次添加后，頁面效果如下：
點(diǎn)擊其中一個(gè)標(biāo)題"研制情況"，頁面跳轉(zhuǎn)，如圖：
這里，置頂?shù)膯栴}就出現(xiàn)了，如果我們的文章目錄一直在視圖的頂部，每次點(diǎn)擊頁面內(nèi)鏈接時(shí)，頂部的目錄就會(huì)和標(biāo)題重疊，非常不美觀，解決這個(gè)問題就要涉及到<div>布局的應(yīng)用，我們以后再說。
OK！今天我們的內(nèi)容結(jié)束了，下一次學(xué)習(xí)圖片映射鏈接功能。
喜歡的朋友請關(guān)注我，點(diǎn)贊也會(huì)讓我動(dòng)力滿滿。
HTML序章（學(xué)習(xí)目的、對象、基本概念）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML是什么？——零基礎(chǔ)自學(xué)網(wǎng)頁制作
第一個(gè)HTML頁面如何寫？——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML頁面中head標(biāo)簽有啥用？——零基礎(chǔ)自學(xué)網(wǎng)頁制作
初識(shí)meta標(biāo)簽與SEO——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML中的元素使用方法1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML中的元素使用方法2——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML元素中的屬性1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML元素中的屬性2（路徑詳解）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
使用HTML添加表格1（基本元素）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
使用HTML添加表格2（表格頭部與腳部）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
使用HTML添加表格3（間距與顏色）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
使用HTML添加表格4（行顏色與表格嵌套）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
16進(jìn)制顏色表示與RGB色彩模型——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML中的塊級(jí)元素與內(nèi)聯(lián)元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作
初識(shí)HTML中的<div>塊元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作
在HTML頁面中嵌入其他頁面的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作
封閉在家學(xué)網(wǎng)頁制作！為頁面嵌入PDF文件——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML表單元素初識(shí)1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML表單元素初識(shí)2——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML表單3（下拉列表、多行文字輸入）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML表單4（form的action、method屬性）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML列表制作講解——零基礎(chǔ)自學(xué)網(wǎng)頁制作
為HTML頁面添加視頻、音頻的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作
音視頻格式轉(zhuǎn)換神器與html視頻元素加字幕——零基礎(chǔ)自學(xué)網(wǎng)頁制作
HTML中使用<a>標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接——零基礎(chǔ)自學(xué)網(wǎng)頁制作
1、段落標(biāo)簽有兩種寫法：</p> 和 <br>
2、<p>標(biāo)簽需要寫一對 ；<br> 標(biāo)簽只需要在文字后面寫一個(gè) 。
3、段落標(biāo)簽也是每個(gè)段落獨(dú)占一行。
4、</p> 和 <br>區(qū)別：p 標(biāo)簽行與行之間的間距比br標(biāo)簽更大一些。
二、<p> 段落標(biāo)簽代碼演示：不推薦
<!DOCTYPE html>
<p lang="en">
<head>
<meta charset="UTF-8">
<title>我的第二個(gè)網(wǎng)頁</title>
</head>
<h1>這是標(biāo)題：登鸛雀樓</h1>
<p>白日依山盡,</p>
<p>黃河入海流。</p> <!--每一對p標(biāo)簽里包著的都是一個(gè)段落，獨(dú)占一行-->
<p>什么千里目，</p>
<p>更上一層樓。</p>
<!--就算你像下面這樣寫了，但其實(shí)還是一個(gè)段落，在瀏覽器中顯示是一行-->
<p>白日依山盡，黃河入海流。欲窮千里目，更上一層樓。</p>
</body>
</html>
顏色屬性被用來設(shè)置文字的顏色。
顏色是通過CSS最經(jīng)常的指定：
一個(gè)網(wǎng)頁的文本顏色是指在主體內(nèi)的選擇：
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
body {
color: blue;
}
h1 {
color: #00ff00;
}
h2 {
color: rgb(255, 0, 0);
}
</style>
</head>
<body>
<h2>hello world</h2>
<h1>welcome to CaoZhou</h1>
</body>
</html>注：對于W3C標(biāo)準(zhǔn)的CSS：如果你定義了顏色屬性，你還必須定義背景色屬性。
文本排列屬性是用來設(shè)置文本的水平對齊方式。
文本可居中或?qū)R到左或右,兩端對齊。
當(dāng)text-align設(shè)置為"justify"，每一行被展開為寬度相等，左，右外邊距是對齊（如雜志和報(bào)紙）。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
h1 {
text-align: center;
}
p.date {
text-align: right;
}
p.main {
text-align: justify;
}
</style>
</head>
<body>
<p class="date">2015 年 3 月 14 號(hào)</p>
<p class="main"> 從前有個(gè)書生，和未婚妻約好在某年某月某日結(jié)婚。到那一天，未婚妻卻嫁給了別人。書生受此打擊， 一病不起。 這時(shí)，路過一游方僧人，從懷里摸出一面鏡子叫書生看。書生看到茫茫大海，一名遇害的女子一絲不掛地躺在海灘上。路過一人， 看一眼，搖搖頭，走了。又路過一人，將衣服脫下，給女尸蓋上，走了。再路過一人，過去，挖個(gè)坑，小心翼翼把尸體掩埋了。 僧人解釋道， 那具海灘上的女尸，就是你未婚妻的前世。你是第二個(gè)路過的人，曾給過他一件衣服。她今生和你相戀，只為還你一個(gè)情。但是她最終要報(bào)答一生一世的人，是最后那個(gè)把她掩埋的人，那人就是他現(xiàn)在的丈夫。書生大悟，病愈。
</p>
<p><b>注意：</b> 重置瀏覽器窗口大小查看 "justify" 是如何工作的。</p>
</body>
</html>text-decoration 屬性用來設(shè)置或刪除文本的裝飾。
從設(shè)計(jì)的角度看 text-decoration屬性主要是用來刪除鏈接的下劃線：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.none {}
.del {
text-decoration: none;
}
</style>
</head>
<body>
<p>原來的樣子</p>
<a href="#" class="none">wwwwwwwwwwwwwwwwww</a>
<p>去掉下劃線</p>
<a href="#" class="del">wwwwwwwwwwwwwwwwwwwww</a>
</body>
</html>也可以這樣裝飾文字：
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
}
</style>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
</body>
</html>注：不建議強(qiáng)調(diào)指出不是鏈接的文本，因?yàn)檫@常常混淆用戶。
text-transform文本轉(zhuǎn)換屬性是用來指定在一個(gè)文本中的大寫和小寫字母。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
p.uppercase {
text-transform: uppercase;
}
p.lowercase {
text-transform: lowercase;
}
p.capitalize {
text-transform: capitalize;
}
</style>
</head>
<body>
<p class="uppercase">This is some text.</p>
<p class="lowercase">This is some text.</p>
<p class="capitalize">This is some text.</p>
</body>
</html>text-indent文本縮進(jìn)屬性是用來指定文本的第一行的縮進(jìn)。
p {text-indent:50px;}增加或減少字符之間的空間。
<style>
h1 {
letter-spacing:2px;
}
h2 {
letter-spacing:-3px;
}
</style>指定在一個(gè)段落中行之間的空間。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
p.small {
line-height: 70%;
}
p.big {
line-height: 200%;
}
</style>
</head>
<body>
<p>
This is a paragraph with a standard line-height.<br> This is a paragraph with a standard line-height.<br> The default line height in most browsers is about 110% to 120%.<br>
</p>
<p class="small">
This is a paragraph with a smaller line-height.<br> This is a paragraph with a smaller line-height.<br> This is a paragraph with a smaller line-height.<br> This is a paragraph with a smaller line-height.<br>
</p>
<p class="big">
This is a paragraph with a bigger line-height.<br> This is a paragraph with a bigger line-height.<br> This is a paragraph with a bigger line-height.<br> This is a paragraph with a bigger line-height.<br>
</p>
</body>
</html>增加一個(gè)段落中的單詞之間的空白空間。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style type="text/css">
p {
word-spacing: 30px;
}
</style>
</head>
<body>
<p>
This is some text. This is some text.
</p>
</body>
</html>設(shè)置文本的垂直對齊圖像。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
img{
width: 200px;
height: 100px;
}
img.top {
vertical-align: text-top;
}
img.bottom {
vertical-align: text-bottom;
}
</style>
</head>
<body>
<p>An <img src="img/logo.png" /> image with a default alignment.</p>
<p>An <img class="top" src="img/logo.png" /> image with a text-top alignment.</p>
<p>An <img class="bottom" src="img/logo.png" /> image with a text-bottom alignment.</p>
</body>
</html>設(shè)置文本陰影。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=640, user-scalable=no">
<title>項(xiàng)目</title>
<style>
h1{
text-shadow: 2px 2px #FF0000;
}
</style>
</head>
<body>
<h1>Text-shadow effect</h1>
</body>
</html>本文主要介紹了CSS文本樣式實(shí)際應(yīng)用中應(yīng)該如何去操作，通過講解文本中對應(yīng)的屬性去改變文本的表現(xiàn)形式。使用豐富的效果圖的展示，能夠更直觀的看到運(yùn)行的效果，能夠更好的理解。使用Html語言，代碼結(jié)構(gòu)更佳的清晰，能夠幫助你更好的學(xué)習(xí)。
*請認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
