第1篇第3章網(wǎng)頁中的文本_第1頁
第1篇第3章網(wǎng)頁中的文本_第2頁
第1篇第3章網(wǎng)頁中的文本_第3頁
第1篇第3章網(wǎng)頁中的文本_第4頁
第1篇第3章網(wǎng)頁中的文本_第5頁
已閱讀5頁，還剩13頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

第1篇第3章網(wǎng)頁中的文本3.1文本的基本編輯3.1.1插入文本、符號、日期3.1.2添加字體3.1.3設(shè)置文本的屬性3.1.4建立列表3.2超鏈接3.2.1路徑3.2.2建立超鏈接3.3樣式3.3.1CSS語法3.3.2CSS樣式應(yīng)用3.3.3引用外部CSS文件與導(dǎo)出樣式表思考題3.1文本的基本編輯互聯(lián)網(wǎng)上大量信息的傳播以文本為主。因此，對于網(wǎng)頁制作人員來說，文本的處理是最基本而重要的技巧之一。學(xué)習(xí)網(wǎng)頁制作首先應(yīng)掌握網(wǎng)頁中文本的制作和編輯方法。3.1.1插入文本、符號、日期軟回車和硬回車特殊字符日期3.1.2添加字體執(zhí)行菜單命令“文本”|“字體”|“編輯字體列表”3.1.3設(shè)置文本的屬性圖3-4文本的“屬性”面板【例3-1】設(shè)計一個只有文字的頁面。對照設(shè)計界面和代碼界面，熟悉文本屬性的標(biāo)簽。學(xué)習(xí)雙標(biāo)簽<h1></h1>、</p></p>、<span></span>、<pre></pre>及單標(biāo)簽<br/>、<hr/>的使用文本的字體、字號、風(fēng)格等屬性以CSS樣式寫在<head></head>中自定義的CSS樣式優(yōu)先級高于網(wǎng)頁樣式body,td,th{}的優(yōu)先級

3.1.4建立列表與列表有關(guān)的標(biāo)簽為<ul>、<ol>、<li>、<menu>、<lh>、<dl>、<dt>、<dd>等，格式、功能和樣例見表3-2。通過文本的“屬性”面板建立列表【例3-2】混合列表示例3.2超鏈接

3.2.1路徑絕對路徑：是Internet上資源的完整地址。包括3部分：協(xié)議種類、放有所須文件的計算機(jī)地址（計算機(jī)域名）、具體文件的路徑及文件名。協(xié)議://計算機(jī)域名/文件路徑及文件名

創(chuàng)建對站點以外的鏈接必須用絕對路徑。根相對路徑：從站點根文件夾到文檔所經(jīng)過的路程，以斜杠/開始，如/html/*.htm。瀏覽器不能像服務(wù)器那樣識別站點根目錄，故與根目錄相對的路徑必須放在遠(yuǎn)程服務(wù)器上才能瀏覽。文檔相對路徑：相對當(dāng)前文檔的路徑。3.2.2建立超鏈接建立超鏈接由錨點（anchor）標(biāo)簽<a></a>定義：<ahref="地址"target="打開窗口方式">熱點</a>屬性href指定超鏈接的目標(biāo)網(wǎng)頁地址，包括路徑和文件名屬性target指定超鏈接文件被打開的目標(biāo)窗口，有如下4個選項：_blank：將鏈接的文件載入到新的無標(biāo)題瀏覽器窗口中。_parent：將鏈接的文件載入到父框架，若該框架非嵌入式框架，則鏈接到整個瀏覽器窗口。_self（默認(rèn)值）：將鏈接的文件載入到自身框架或自身窗口中。_top：將鏈接的文件載入到整個瀏覽器窗口中，并刪除所有框架。在Dreamweaver中提供了6種常用的鏈接：外部文檔鏈接、書簽鏈接、E-mail鏈接、無址鏈接、腳本鏈接和指向下載文件的鏈接。3.2.2建立超鏈接1．外部文檔鏈接指鏈接到本文檔之外的文檔，包括站內(nèi)和站外的網(wǎng)頁。在熱字“屬性”面板的“鏈接”框中填入超鏈接的外部文檔地址（屬性href的值)；在“目標(biāo)”下拉列表框中設(shè)置超鏈接的目標(biāo)窗口(屬性target的值)。2．書簽鏈接<ahref="地址#書簽名"target="打開窗口方式">熱點</a>

建立書簽：“插入”面板的“命名錨記”按鈕鏈接書簽：#書簽名。3．無址鏈接

返回頁面頂端，形成手形光標(biāo)<ahref="#">熱點</a>不返回頁面頂端，形成手形光標(biāo)<ahref="javascript:;">熱點</a>3.2.2建立超鏈接4．E-mail鏈接（電子郵件鏈接）

<ahref="mailto:郵件地址">熱點</a>“插入”面板中的“電子郵件鏈接”按鈕5．腳本鏈接

在選中熱字的link框中直接寫入腳本。例：JavaScript:alert('確定刪除嗎')6．指向下載文件的鏈接鏈接的目標(biāo)文件不是HTML文件，則作為下載文件，格式：<ahref="路徑及文件名">熱點</a>【例3-3】試制作外部文檔鏈接、外部文檔書簽鏈接、本文檔書簽鏈接、E-mail鏈接、無址鏈接和腳本鏈接。3.3樣式樣式是一組可以控制文本塊、段落或整篇文檔外觀的格式屬性。使用外部樣式文件可以一次控制若干篇文檔的格式。CSS（CascadingStyleSheets）即級聯(lián)樣式表或?qū)盈B樣式表通過樣式名或HTML標(biāo)簽表示，可以控制絕大多數(shù)的傳統(tǒng)文本格式，如字體、字號和對齊方式等，還可以指定位置、鼠標(biāo)指針形狀和其他特殊效果。

為了防止某些瀏覽器不識別某些CSS樣式，可以用注釋標(biāo)簽<!---->將CSS樣式括起來。3.3.1CSS語法CSS樣式表位于XHTML代碼中的head標(biāo)簽內(nèi)，由3部分構(gòu)成：選擇符（selector）、屬性（properties）和屬性值（value）：Selector{properties1:value1;/*第1個屬性名及屬性值*/properties2:value2;/*第2個屬性名及屬性值*/…}

3.3.1CSS語法規(guī)則 ：（1）標(biāo)簽選擇符和選擇符組：把相同屬性和值的標(biāo)簽組合起來書寫，用逗號隔開。如：p,table{font-size:10pt}

（2）類選擇符：可用于任意標(biāo)簽的自定義樣式，標(biāo)簽名與自定義樣式名用西文點分隔。如：p.left{text-align:left}/*定義段落居左*/（3）ID選擇符：只對某特定元素定義的單獨的樣式。如：#right{text-align:right}/*只對id="right"的段落起作用*/（4）包含選擇符：定義具有包含關(guān)系的元素樣式。若標(biāo)簽1內(nèi)包含標(biāo)簽2，包含選擇符只對標(biāo)簽1內(nèi)的標(biāo)簽2有效，對單獨的標(biāo)簽1或標(biāo)簽2無效。

如：Tablea{font-size:16px}/*只對表格內(nèi)的鏈接起作用*/樣式表具有層疊性，也稱為繼承性，即內(nèi)層標(biāo)簽的樣式繼承外層標(biāo)簽的樣式。

3.3.2CSS樣式應(yīng)用先創(chuàng)建CSS樣式，再對選定文本應(yīng)用CSS樣式。對選定文本用了某CSS樣式后，若又改變了該樣式的格式，則修改之前用了該樣式的文本自動更新格式。圖3-15“CSS樣式”面板CSS樣式創(chuàng)建之后，只對本網(wǎng)頁有效。以往創(chuàng)建的CSS樣式不存在于新開文件的CSS樣式列表中，新網(wǎng)頁須重新附加CSS文件。3.3.3使用CSS樣式在新建CSS樣式窗口中，需要設(shè)置3個參數(shù)：選擇器類型樣式名稱樣式定義的范圍3.3.3使用CSS樣式1．“類”選擇器【例3-4】在文字上應(yīng)用樣式?！纠?-5】為圖片設(shè)置具有透明效果（Alpha濾鏡）、風(fēng)吹效果（Blur濾鏡）、黑白效果（Gray濾鏡）、反相效果（Invert濾鏡）的樣式。2．“標(biāo)簽”選擇器3．“高級”選擇器【例3-6】試取消鼠標(biāo)指向超鏈接文本時超鏈接文本上的下劃線，并改變鼠標(biāo)指向時的手形光標(biāo)。3.3.4引用外部CSS文件與導(dǎo)出樣式表1．引用外部CSS文件“鏈接”是通過指針指向外部CSS文件，“導(dǎo)入”相當(dāng)于存在內(nèi)部樣式表中，這個區(qū)別可以從它們在代碼中的位置看到。<head><styletype="text/css"><!--@importurl("CSS/Level3_3.css");/*導(dǎo)入的CSS文件*/.a{ font-family:"隸書","華文中宋";/*自定義名為.a的內(nèi)部CSS樣式*/ font-size:36px; }--></style><linkhref="CSS/Level2_Times_Text.css"rel="stylesheet"type="text/css"/>/*鏈接的CSS文件*/</head>【例3-7】在系統(tǒng)中查找h

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論