第2章從零開始構(gòu)建html頁面補(bǔ)充案例_第1頁
第2章從零開始構(gòu)建html頁面補(bǔ)充案例_第2頁
第2章從零開始構(gòu)建html頁面補(bǔ)充案例_第3頁
第2章從零開始構(gòu)建html頁面補(bǔ)充案例_第4頁
第2章從零開始構(gòu)建html頁面補(bǔ)充案例_第5頁
已閱讀5頁,還剩15頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡介

2【案例2-1】案HTMLHTMLHTMLHTML文檔的基本格式。圖2-1案例效DreamweaverHTML11234<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html556789<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"案例2-2圖2-2案例效上述案例是一個(gè)基本的html基本結(jié)構(gòu)在此結(jié)構(gòu)的基礎(chǔ)上可以再增加的樣式和內(nèi)容來充實(shí)網(wǎng)頁2-2<font>圖2-3<font>HMTL1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"播客</font>java就業(yè)班.net2-4圖2-4<font>2-3 圖2-5HTML112345678<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"99<p>我是特殊字符空 ;格 符號(hào) 商標(biāo)2-6圖2-6HTML“&2-4HTMLHTML準(zhǔn)備了專門的文本格式化圖2-7HTML1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"<palign="center"><strong>城東早春<palign="right"><em>作者 <p><fontcolor="blue"><p><fontcolor="blue">2-8圖2-82-5HTML掌握<hr圖2-9HMTL1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"我是普通的文本<hrcolor="green"width="500"align="left"2-10圖2-102-6<img圖像標(biāo)記<imgsrc、width、height、border圖2-11<imgHTML1<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.023<htmlxmlns="45<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"6789常規(guī)的圖像<br<imgsrc="images/spring.jpg"width="200"height="131"/><br/><br帶有邊框的圖像<br<imgsrc="images/spring.jpg"width="200"height="131"border="3"/><br/><br等比縮放的圖像<br<imgsrc="images/spring.jpg"width="150"border="3"/><br/><br2-12圖2-12<img2-7當(dāng)引入圖像時(shí)使用了錯(cuò)誤的路徑,就會(huì)導(dǎo)致失效(無法正常)。為了避免這個(gè)問題的圖2-13把這個(gè)放到指定位置的下一 分別在Dreamweaver中引入路徑1下的相對(duì)路徑和路徑2下的相對(duì)路徑,觀察頁引入路徑1下的相對(duì)路徑,觀察頁面顯示效果HTML1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"<imgsrc="pic.jpgwidth="271height="271title="相對(duì)路徑同級(jí)<imgsrc="images/pic.jpgwidth="271height="271title="相對(duì)路徑下級(jí)<imgsrc="images/img/pic.jpgwidth="271height="271title="相對(duì)下級(jí)的下級(jí)<imgsrc="file:///D:\HTML+CSS網(wǎng)頁制作\作補(bǔ)充案例\chapter02\images\pic.jpgalt="未出現(xiàn)"title="火狐中的絕對(duì)路徑"/>14142-14圖2-142-8HTMLHTML標(biāo)記和<img/>HTML標(biāo)記和<img/>純文本看著會(huì)很枯燥,而的加入能夠刺激讀者的感官,閱讀。這就體現(xiàn)了圖像與文圖2-15Dreamweaver中插入一個(gè)正常的圖像,圖像下面添加一個(gè)段落,整體作為一個(gè)參照?qǐng)DHTML1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<html<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"<imgsrc="images/logo.png"width="200"10 IT11<hr。<imgsrc="images/logo.pngwidth="200border="2align="lefthspace="20vspace="10" 播客-java培訓(xùn),.net培訓(xùn),php培訓(xùn),網(wǎng)頁培訓(xùn),平面培訓(xùn),iOS培訓(xùn)機(jī)構(gòu)"/> IT。2-16圖2-16【案例2-9】制作宣傳效HTML純文本看著會(huì)很枯燥,而的加入能夠刺激讀者的感官,閱讀。這就體現(xiàn)了圖像與文本配合的重要性。本案例通過文本和圖像樣式制作一個(gè)宣傳的展示效果。圖2-17宣傳效Dreamweaver中添加<h2>標(biāo)題內(nèi)容、水平線、圖像、段落文本,整體作為網(wǎng)頁的上半Dreamweaver中添加<h2>標(biāo)題內(nèi)容、水平線、圖像、段落文本,整體作為網(wǎng)頁的下半HTML1123456789<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0"<metahttp-equiv="content-type"content="text/html;charset=UTF-8"<metacontent="1,2,3<metaname="descriptioncontent="你頁面的簡述<h2align="center"><strong>西游降魔篇<hrcolor="#1E8DC2"size="3"width="70%"<imgsrc="images/xy.jpg"align="right"<p>2013210日<br導(dǎo)演 <br正<br片長:110分鐘<br<br<h2align="center"><strong>101次求婚<hr<imgsrc="images/qh.jpg"align="right"<p導(dǎo)演:陳正道<br///<br片長:104分鐘<br<br28<p><u>上映日期:02122-18圖2-18宣傳效2-10HTML純文本看著會(huì)很枯燥,而的加入能夠刺激讀者的感官,閱讀。這就體現(xiàn)了圖像與文圖2-19插入圖像,根據(jù)要求調(diào)整和文字之間的間距HTML1<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.023<htmlxmlns="45<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"66789"<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0<html <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"<palign="center"><strong>青春是最美好的相遇 教堂旁邊,矗立著一 。”<palign="right"><em>——題記<imgsrc="images/1.jpg"width="200"align="left"vspace="20"20212

溫馨提示

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

評(píng)論

0/150

提交評(píng)論