()傳智播客-韓順平輕松搞定網(wǎng)頁設(shè)計-html_第1頁
()傳智播客-韓順平輕松搞定網(wǎng)頁設(shè)計-html_第2頁
()傳智播客-韓順平輕松搞定網(wǎng)頁設(shè)計-html_第3頁
()傳智播客-韓順平輕松搞定網(wǎng)頁設(shè)計-html_第4頁
()傳智播客-韓順平輕松搞定網(wǎng)頁設(shè)計-html_第5頁
已閱讀5頁，還剩38頁未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡介

北京傳智播客教育輕松搞定網(wǎng)頁設(shè)計之html講師：韓順平email:hanshunping@qq:2317702760

內(nèi)容介紹:1.html介紹2.優(yōu)秀網(wǎng)頁欣賞3.html項目演示4.html運(yùn)行基本原理(Hello,順平)√5.html的基礎(chǔ)知識 √①了解html的基本概念②理解html的運(yùn)行基本原理③掌握html的一些基本用法④ 能寫出簡單的網(wǎng)頁學(xué)習(xí)目標(biāo)■

html是什么

HTML（HyperTextMark-upLanguage）即超文本標(biāo)記語言或超文本鏈接標(biāo)示語言，是目前網(wǎng)絡(luò)上應(yīng)用最為廣泛的語言，也是構(gòu)成網(wǎng)頁文檔的主要語言。HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。HTML的結(jié)構(gòu)包括頭部（Head）、主體（Body）兩大部分，其中頭部描述瀏覽器所需的信息，而主體則包含所要說明的具體內(nèi)容。

html介紹--html是什么■

html可以做什么

①HTML可以編寫靜態(tài)網(wǎng)頁. ②該靜態(tài)網(wǎng)頁可以包括文字、圖形、動畫、聲音、表格、鏈接。從而構(gòu)成一個個漂亮的網(wǎng)頁。 給大家看幾個漂亮的網(wǎng)頁吧!html介紹--html可以做什么■

html發(fā)展歷史html介紹--html的發(fā)展歷史1993標(biāo)記語言第一版1995html2.01996html3.2w3c推薦標(biāo)準(zhǔn)1999html4.0.1w3c推薦標(biāo)準(zhǔn)2000xhtml1.0w3c推薦標(biāo)準(zhǔn)2001xhtml1.1w3c推薦標(biāo)準(zhǔn)2008html5蒂姆·伯納斯一李萬維網(wǎng)之父html設(shè)計者w3c創(chuàng)始人

■

w3c的介紹

W3C是英文WorldWideWebConsortium的縮寫，中文意思是W3C理事會或萬維網(wǎng)聯(lián)盟。W3C于1994年10月在麻省理工學(xué)院計算機(jī)科學(xué)實驗室成立。創(chuàng)建者是萬維網(wǎng)的發(fā)明者TimBerners-Lee。W3C組織是對網(wǎng)絡(luò)標(biāo)準(zhǔn)制定的一個非贏利組織，像HTML、XHTML、CSS、XML的標(biāo)準(zhǔn)就是由W3C來定制。W3C會員（大約500名會員）包括生產(chǎn)技術(shù)產(chǎn)品及服務(wù)的廠商、內(nèi)容供應(yīng)商、團(tuán)體用戶、研究實驗室、標(biāo)準(zhǔn)制定機(jī)構(gòu)和政府部門，一起協(xié)同工作，致力在萬維網(wǎng)發(fā)展方向上達(dá)成共識。

html介紹--w3c介紹蒂姆·伯納斯一李

■

html和xhtml區(qū)別

html->xhtml->xml

html語言本身有一些缺陷(比如內(nèi)容和形式不能分離,標(biāo)記單一,數(shù)據(jù)不能復(fù)用等),隨著xml的興起，xml越來越受到國際認(rèn)可，所以人們希望xml來彌補(bǔ)html的不足,但是目前有成千上萬的網(wǎng)頁都是html編寫的，所以完全使用xml來替代html還為時過早,于是w3c在2000推出xhtml1.0，建立XHTML的目的就是實現(xiàn)HTML向XML的過渡。

html介紹htmlxhtml區(qū)別■

html項目演示

高級郵箱

html項目演示■

html項目演示

麥當(dāng)勞導(dǎo)航

html項目演示■

html項目演示(可愛屋)

html項目演示■

html項目演示(旅游島)

html項目演示■

html項目演示(仿sohu首頁面)html項目演示■

html運(yùn)行原理 ①本地運(yùn)行 html運(yùn)行的基本原理■

html運(yùn)行原理 ②遠(yuǎn)程訪問運(yùn)行

html運(yùn)行的基本原理你的電腦瀏覽器遠(yuǎn)程服務(wù)器hello.html你可能產(chǎn)生的疑問?①ie是怎樣訪問到hello.html?(url)②萬維網(wǎng)是個什么東東??可以使用apache來測試一下這個運(yùn)行的效果!■

萬維網(wǎng)(www)

簡略圖:

html運(yùn)行的基本原理wwwsohu子網(wǎng)■

萬維網(wǎng)(www)-綜合圖html運(yùn)行的基本原理■

html的開發(fā)工具

①記事本 ②editplusvim ③frontpage ④dw ⑤zendstudio ⑥其它的idehtml的開發(fā)工具■

html的基本結(jié)構(gòu)

從下面test.html我們可以看出html的基本結(jié)構(gòu)

<html>

<head>

<title>這是我的第一個網(wǎng)頁</title>

</head>

<body>

這是我的第一個網(wǎng)頁

<b>你好！</b>

</body>

</html><元素名

[屬性]>元素內(nèi)容</元素名>

html的基本結(jié)構(gòu)■

html的標(biāo)記/元素

①HTML標(biāo)記是用來組成HTML元素的 ②HTML標(biāo)記用兩個尖括號”<>”括起來 ③HTML標(biāo)記一般是雙標(biāo)記，如<b>和</b>前一個標(biāo)記是起始標(biāo)記,后一個標(biāo)記為結(jié)束標(biāo)記 ④兩個標(biāo)記之間的文本是html元素的內(nèi)容 ⑤某些標(biāo)記稱為“單標(biāo)記”,因為它只需單獨(dú)使用就能完整地表達(dá)意思,如<br> ⑥html標(biāo)記和html元素可以看做是同一個概念，在我的課程中為統(tǒng)一說法，就叫html元素。

html常用的元素參考html語言教程(html版)

html的標(biāo)記/元素介紹■

html的元素的屬性每個元素都有多個屬性,每個屬性有不同的屬性值來修飾，從而達(dá)到不同的顯示效果.舉例:html元素的屬性<p>段落標(biāo)記</p><fontsize=“”>字體標(biāo)記</font>size取值1到7<h#>標(biāo)題字體</h#>#=1，2，3，4，5，6<b></b>

字體加粗■

html的元素的屬性 關(guān)于每個元素，所包含的各個屬性以及各個屬性對應(yīng)的屬性值，請各位同學(xué)參看：html語言教程(html版)

html元素的屬性■

HTML符號實體-介紹 在網(wǎng)頁上顯示一些特殊的符號,我們需要使用html的符號實體,有些人把它稱為字符實體,比如我們看一個小小的案例(html1_1.html)。

為在網(wǎng)頁上顯示版權(quán)符號,我們就需要使用html的符號實體©才能在網(wǎng)頁上正確顯示。

■

HTML符號實體-一覽表

■

html超鏈接

a.htm代碼：<html><body><ahref=b.htm>老鼠愛大米</a><br><ahref=#abc>齊秦</a><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><fontcolor=red><aname=abc>北方的狼</a></font><ahref=mailto:abc@>abc@</a></body></html>b.htm代碼：<html><body>我聽見你的聲音<BR>有種特別的感覺<BR>讓我不斷想不敢再忘記你<BR>我記得有一個人<BR>永遠(yuǎn)留在我心中<BR><ahref=a.htm>返回</a></body></html>打開當(dāng)前計算機(jī)系統(tǒng)中默認(rèn)的電子郵件客戶端軟件，例如:OutLookExpress

html常用標(biāo)記/元素-超鏈接<ahref=“url地址”></a><ahref=“mailto:電子郵箱地址”></a>■

html圖像元素

html常用標(biāo)記/元素-image<imgsrc=“圖片的路徑”width=“寬度”height=“高度”></img>■

html表格 html常用標(biāo)記/元素-table<tableborder=“邊框?qū)挾取眂ellspacing=“空隙大小”cellpadding=“填充大小”></table>■

html表格-小練習(xí) html常用標(biāo)記/元素-table請用html編寫如下網(wǎng)頁■

上機(jī)練習(xí)題 html常用標(biāo)記/元素-table請用html編寫如下網(wǎng)頁■

html列表-無序列表 <UL>

的屬性設(shè)定（常用）：例如：<ULtype="square">

type="square"

設(shè)定符號款式，其值有三種，如下，默認(rèn)為type="disc"：type="disc"

時的列項符號為實心圓點(diǎn)。type="circle"

時的列項符號為空心圓。type="square"

時的列項符號為空心正方形。

html常用標(biāo)記/元素-ul/li<ultype=“屬性值”><li>列表內(nèi)容</li></ul>■

html列表-有序列表

<OL>稱為順序列表標(biāo)記。<LI>則用以標(biāo)示列表項目。所謂順序列表就是每一項有順序，又稱編號列表。<OL>的屬性設(shè)定（常用）：例如：<oltype="i"start="4"></ol>type="i"設(shè)定數(shù)目款式，其值有五種，請參考右表，內(nèi)定為type="1"。

start="4"設(shè)定開始數(shù)目，不論設(shè)定了哪一數(shù)目款式，其值只能是1,2,3..等整數(shù)，默認(rèn)為start="1"。

i可以取以下值中的任意一個：1阿拉伯?dāng)?shù)字1,2,3,...a小寫字母a,b,c,...A大寫字母A,B,C,...i小寫羅馬數(shù)字i,ii,iii,...I大寫羅馬數(shù)字I,II,III,...。

html常用標(biāo)記/元素-ol/li<oltype=“屬性值”start=“起始值”><li>列表內(nèi)容</li></ol>■

html列表-框架

html常用標(biāo)記/元素-frameset<framesetframeborder=“邊框大小”cols=‘”各窗口百分比，隔開”rows=“各窗口百分比”><framename=“給frame取名”src=“html路徑”noresize></frameset>■

html框架-(frameset小練習(xí))

html常用標(biāo)記/元素-frameset/frame完成下面的網(wǎng)頁,用戶點(diǎn)擊左側(cè)的超鏈接，可以看到相應(yīng)的歌詞■

iframe浮動窗口html常用標(biāo)記/元素-iframe浮動窗口■

form(表單)元素介紹html常用標(biāo)記/元素-form客戶端服務(wù)器<formaction="url"method=*>......<inputtype=submit><inputtype=reset></form>星號*部分可以為GET,也可以是

POST

■

form(表單)元素html常用標(biāo)記/元素-form■

form(表單)元素-小練習(xí)html常用標(biāo)記/元素-form■

input元素html常用標(biāo)記/元素-input元素您的姓名:<input

type="text"

name="姓名"><br>密碼:<input

type="password"

name="密碼"><br><inputtype="checkbox"

name="水果1">香蕉<p><inputtype="checkbox"

name="水果1"checked>蘋果<p><inputtype="Image"

name="submit"align="top"

src="shan.jpg"><inputtype="radio"

name="水果">香蕉<p><inputtype="radio"

name="水果"checked>蘋果<p><inp

溫馨提示

  • 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

提交評論