下載本文檔
版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進行舉報或認(rèn)領(lǐng)
文檔簡介
課程大綱HTML概述HTML語法HTMLHTML概述：用于展示特定內(nèi)容的相關(guān)網(wǎng)頁的集合。網(wǎng)頁：網(wǎng)頁是構(gòu)成的基本元素。網(wǎng)頁是html語言編寫的文件，存放在計算機中。當(dāng)你在瀏覽器輸入后，網(wǎng)頁文件會被傳送到你的計算機，然后再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，再展示到你的眼前網(wǎng)頁內(nèi)容分類：圖、文、聲、像、表格、表單、超HTML概述HTML：Hyper
Text
Mark-up
Language超文本標(biāo)記語言：它屬于計算機語言，是描述網(wǎng)頁的一種語言。HTML網(wǎng)頁文件的結(jié)構(gòu)：包括頭部（head）、主體（body）兩大部分，其中頭部描述瀏覽器所需要的信息，而主體則包含網(wǎng)頁中要顯示的具體內(nèi)容。HTML編寫的網(wǎng)頁文件格式為html和htm。HTML網(wǎng)頁文件可以使用記事本編輯。專業(yè)的編輯工具：Dreamweaver。HTML基本結(jié)構(gòu)<html>（網(wǎng)頁）<head>（網(wǎng)頁頭部）<title>（網(wǎng)頁標(biāo)題）（顯示在瀏覽器標(biāo)題欄的網(wǎng)頁標(biāo)題）</title></head><body>（主體部分）（顯示在瀏覽器窗口網(wǎng)頁的主體部分）</body></html>基本語法：<
名>文本</
名>例如：<title>網(wǎng)頁標(biāo)題</title><
名
屬性名="屬性值">文本</
名>例如：<body
bgcolor="red">背景顏色</body>和單
。成對使用如果屬性相同不會<
名>例如：<hr>（水平分隔線）說明：名不區(qū)分大小寫。主要分為雙時可以相互嵌套，不能交叉嵌套。嵌套的，屬性不同，就近選擇。HTML語法HTML分類：HTML基礎(chǔ)HTMLHTML聲像HTML表格HTML表單HTML超HTML框架HTML基礎(chǔ)<Hn></Hn><p>文字內(nèi)容</p><br>標(biāo)題段落換行水平分隔線段落居中文本屬性<hr><center>文字內(nèi)容</center><font>文字內(nèi)容</font>HTML基礎(chǔ)標(biāo)題語法：<Hn>標(biāo)題文字</Hn>其中：n
=1、2、3、4、5、6屬性：align:設(shè)置對齊方式，取值left
|
right
|
center,默認(rèn)left。<Hn
align="對齊方式">標(biāo)題文字</Hn>說明：標(biāo)題文字被標(biāo)題
標(biāo)記后字體加粗加大）標(biāo)題
有自動換行效果（類似于<br><H1>：字體最大<H6>：字體最小HTML基礎(chǔ)段落語法：<P>文字內(nèi)容</P>屬性：align:設(shè)置對齊方式，取值left
|
right
|
center,默認(rèn)left。<P
align="對齊方式">標(biāo)題文字</P>說明：將被一對段落
標(biāo)記的內(nèi)容作為一個單獨的段落HTML基礎(chǔ)換行語法：<br>這是第一行<br>
這是第二行說明：將該標(biāo)記之后的內(nèi)容另起一行開始HTML基礎(chǔ)水平分隔線語法：<hr>屬性：size：設(shè)置高度（粗細(xì)），默認(rèn)為2px(像素)width：設(shè)置長度，數(shù)值可以取像素px和百分比align：設(shè)置對齊方式，取值left
|
right
|
center,默認(rèn)left。color：設(shè)置顏色<hr
size="8"
width="500"
align="center"
color="red">說明：水平分隔線單獨一行HTML基礎(chǔ)段落居中語法：<center>文字內(nèi)容</center><center><p>這是第一行</p><p>這是第二行</p></center>說明：被段落居中標(biāo)記的內(nèi)容都會居中顯示HTML基礎(chǔ)練習(xí)：HTML基礎(chǔ)文本屬性語法：<font>文字內(nèi)容</font>屬性：color：設(shè)置顏色size：設(shè)置字體大小，取值1-7，默認(rèn)取值3face：設(shè)置字體，例如：黑體，宋體<font
color="red"size="5"face="黑體">文字內(nèi)容</font>說明：文本屬性
一般和其他
嵌套使用HTML語法：<imgsrc="
路徑">屬性：語法：<imgsrc="
路徑">src：alt：width：路徑設(shè)置
無法正常顯示時所顯示的文字設(shè)置圖像的寬度height：設(shè)置圖像的高度border：設(shè)置邊框的粗細(xì)<img
src=""
alt=""
width=""
height=""
border="">說明：為單
，沒有結(jié)束在網(wǎng)頁中HTML聲像語法：<embed
src="聲像路徑">屬性：width：
設(shè)置影像的寬度height：設(shè)置影像的高度<embed
src=""
width=""
height="">語法：<bgsound
src="聲音路徑">說明：bgsound背景音樂使用embed聲像使用bgsound背景音樂支持IE瀏覽器聲音帶有音樂欄聲音沒有音樂欄HTML表格表格
：表格的基本結(jié)構(gòu)表格表格行<table><tr>表格行/列標(biāo)題表格單元格<th><td>HTML表格1.
表格的基本結(jié)構(gòu)<table><tr><th>第一行第一個單元格
</th><th>第一行第二個單元格
</th>……</tr><tr><td>第二行第一個單元格</td><td>第二行第二個單元格
</td>……</tr></table>HTML表格表格語法：<table></table>定義整個表格，表格中的所有內(nèi)容都必須位于<table>和</table>之間。屬性：①bordercolor：設(shè)置表格邊框顏色②border:設(shè)置邊框的粗細(xì)③bgcolor：設(shè)置背景顏色④Width:
設(shè)置表格列寬，可取像素值或百分比值⑤height:
設(shè)置表格行高，可取像素值或百分比值HTML表格表格行語法：<tr></tr>定義表格的一行，行內(nèi)是單元格屬性：①align： 行內(nèi)容的水平對齊方式：left（默認(rèn)）
|
center
|
right②valign：行內(nèi)容的垂直對齊方式：top
|
middle（缺省）|
bottom③height：行高（像素）④bgcolor：行的背景顏色⑤bordercolor：行的邊框顏色HTML表格表格行列標(biāo)題單元格語法：<th></th>定義作為標(biāo)題的單元格屬性：①rowspan：行合并，其取值表示縱向方向上合并的行數(shù)②colspan：列合并，其取值表示橫向方向上合并的列數(shù)③align：標(biāo)題單元格內(nèi)容的水平對齊：left|
center
（默認(rèn)）
|right④valign：標(biāo)題單元格內(nèi)容的垂直對齊：top
|
middle（缺?。﹟
bottom⑤width：設(shè)置單元格寬度（像素）⑥height：設(shè)置單元格高度（像素）HTML表格表格單元格語法：<td></td>構(gòu)成表格的基本元素屬性：①rowspan：行合并，其取值表示縱向方向上合并的行數(shù)②colspan：列合并，其取值表示橫向方向上合并的列數(shù)③align：單元格內(nèi)容的水平對齊：left（默認(rèn)）
|
center
|
right④valign：單元格內(nèi)容的垂直對齊：top
|
middle（缺?。﹟
bottom⑤width：設(shè)置單元格寬度（像素）⑥height：設(shè)置單元格高度（像素）⑦bgcolor：設(shè)置背景顏色HTML表格練
：HTML表格練習(xí)2：HTML表單?表單？表單是指用于實現(xiàn)客戶端（網(wǎng)頁瀏覽者）與服務(wù)器端（網(wǎng)頁擁有者）之間信息交互的一種頁面元素，在WWW上它被廣泛用于各種信息的搜索和反饋。常見的表單有用戶登錄、搜索引擎、 、用戶留言等。簡單來說，就是客戶端通過表單向服務(wù)器發(fā)送數(shù)據(jù)信息。表單包含：文本框、 框、單選框、復(fù)選框、下拉選擇框、文本域、提交按鈕、重置按鈕、自定義按鈕和文件上傳框。HTML表單表單語法：<form></form>屬性：action：該屬性表示服務(wù)器端程序的URLmethod：數(shù)據(jù)的發(fā)送方式。get
|
post–
get：發(fā)送較少數(shù)據(jù)（256byte），數(shù)據(jù)經(jīng)編碼后顯示在url中。?
例如：url/userinfo?username=
&password=123="_blank">–
post：數(shù)據(jù)長度
，且數(shù)據(jù)不會顯示在url中。：頁面的打開方式_blank（新窗口）<from
action="Test.html"
method="get"<input
type="
"></input><input
type="
"></input><from>HTML表單Input（位于<form>..</form>之中，用于接收用戶輸入的控件）語法：<input
type="">屬性：type：text（單行文本框）password（
框）radio（單選按鈕）checkbox（復(fù)選框）file（文件域）hidden（隱藏域）submit
（提交按鈕）reset（重置按鈕）button（自定義按鈕）HTML表單Input示例：HTML表單多行文本框語法：<textarea>…</textarea>屬性：name：文本框名稱。rows：最大可視行數(shù)。cols：最大可視列數(shù)。示例：<textarea
name="名稱"rows=“5”cols=“15”>內(nèi)容
</textarea>HTML表單列表選擇框語法：<select>..</select>多行文本框語法：<option>..</option>屬性：selected：選項默認(rèn)被選中。–
示例：<select><option
selected>…</option><option>…</option><option>…</option></select>HTML表單練習(xí)：HTML超超語法：<a
href=“url
”>文字（或?qū)傩裕海?lt;/a>href：用來指定超
目標(biāo)——
、文檔、音樂、
、
、郵箱name：書簽名。：指定超
的目標(biāo)框架名。–
說明：鼠標(biāo)點擊“文字(或)”時，根據(jù)“url
”內(nèi)容的不同，會發(fā)生下面3種情況：①href="新文檔名"：打開一個新的HTML文檔。②href="新文檔名#point"：打開一個新的HTML文檔并跳轉(zhuǎn)到新文檔中已經(jīng)定義好的書簽。point處顯示。
point是在③href="#point"：跳轉(zhuǎn)到本文檔的簽。提示：href
郵箱需要電腦安裝有point處顯示。
point是在本文檔中已經(jīng)定義好的書Office
Outlook郵箱HTML超練習(xí)：通過超通過超通過超通過超通過超打開一張。打開一個文本文件。打開一個聲音文件。打開一個h打開一個本地網(wǎng)頁。。6.在本地網(wǎng)頁一個底部書簽，通過超跳轉(zhuǎn)到書簽位置。HTML框架框架作用：框架是用來提高網(wǎng)頁導(dǎo)航性能的
式。框架用來劃分瀏覽器窗口以使窗口中能夠容納多個獨立頁面。<frameset>
</frameset>功能：設(shè)置框架集網(wǎng)頁，結(jié)束標(biāo)記不能省。屬性：rows：設(shè)置橫向框架的數(shù)量和高度。cols：設(shè)置縱向框架的數(shù)量和寬度。屬性值：像素和百分
溫馨提示
- 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)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 探索2024年教育風(fēng)向標(biāo)：《口耳目》教案
- 2024年：虛擬現(xiàn)實技術(shù)在教育培訓(xùn)中的應(yīng)用
- 人教版初中化學(xué)九年級上冊-各單元測試卷共二十一套及答案
- 石頭的啟示作文3篇
- 甲狀腺功能亢進病例分析培訓(xùn)課件
- (完整版)暗涵清淤專項方案
- 汽車中級工試卷
- 2024-2025學(xué)年新教材高中英語UNIT3FOODANDCULTUREPeriod1課時作業(yè)含解析新人教版選擇性必修第二冊
- 2024-2025學(xué)年高中物理第一章靜電場6電勢差與電場強度的關(guān)系課時作業(yè)含解析新人教版選修3-1
- 2024-2025學(xué)年新教材高中英語Unit4AmazingartSectionⅢDevelopingideas學(xué)案外研版必修第三冊
- 3-4單元測試-2024-2025學(xué)年統(tǒng)編版語文六年級上冊
- 北師版數(shù)學(xué)八年級上冊 5.8三元一次方程組課件
- 2024混合動力汽車賽道專題報告-2024-10-市場解讀
- 企業(yè)單位消防安全規(guī)范化管理指導(dǎo)手冊
- 廢舊物資回收投標(biāo)方案（技術(shù)方案）
- 宣傳視頻拍攝服務(wù)投標(biāo)方案（技術(shù)方案）
- 森林防火課件下載
- 3《歡歡喜喜慶國慶》（教學(xué)設(shè)計）2024-2025學(xué)年統(tǒng)編版道德與法治二年級上冊
- 2024糧改飼工作總結(jié)五篇
- 合作收款合同協(xié)議書
- 2024至2030年中國生物質(zhì)能發(fā)電行業(yè)市場深度調(diào)研及發(fā)展前景分析報告
評論
0/150
提交評論