Html基礎(chǔ)教材課件_第1頁
Html基礎(chǔ)教材課件_第2頁
Html基礎(chǔ)教材課件_第3頁
Html基礎(chǔ)教材課件_第4頁
Html基礎(chǔ)教材課件_第5頁
已閱讀5頁，還剩145頁未讀， 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

HTML—超文本標記語言HTML—超文本標記語言課程大綱第一章：WEB基礎(chǔ)知識第二章：HTML入門基礎(chǔ)第三章：TABLE布局第四章：表單標簽第五章：常用工具介紹課程大綱第一章：WEB基礎(chǔ)知識本章內(nèi)容提示：靜態(tài)門戶網(wǎng)站導(dǎo)入Web與Internet的關(guān)系Web的工作原理動態(tài)Web開發(fā)技術(shù)第一章 WEB基礎(chǔ)知識本章內(nèi)容提示：第一章 WEB基礎(chǔ)知識導(dǎo)入靜態(tài)門戶網(wǎng)站案例第一章 WEB基礎(chǔ)知識第一節(jié)靜態(tài)門戶網(wǎng)站導(dǎo)入top導(dǎo)航foot導(dǎo)入靜態(tài)門戶網(wǎng)站案例第一章 WEB基礎(chǔ)知識top導(dǎo)航footInternet介紹Web實質(zhì)HTTP協(xié)議介紹WEB與Internet的關(guān)系第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Internet介紹第一章 WEB基礎(chǔ)知識Internet介紹Internet是一個全球性的計算機互聯(lián)網(wǎng)絡(luò)，中文名稱有“因特網(wǎng)”、“國際互聯(lián)網(wǎng)”、“網(wǎng)際網(wǎng)”、“交互網(wǎng)絡(luò)”等。英特網(wǎng)主要提供以下服務(wù)第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系其他文件傳輸FTP電子公告牌BBS萬維網(wǎng)WWW電子郵件Email遠程登錄Telnet中文名英文名Internet介紹第一章 WEB基礎(chǔ)知識其他文件傳輸FTPWeb實質(zhì)Web又稱做萬維網(wǎng)或環(huán)球網(wǎng)，是WWW（WorldWideWeb）的簡稱。Web的功能發(fā)布信息搜索和瀏覽文本和圖片信息在線播放音、視頻文件發(fā)表觀點電子購物第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Web實質(zhì)第一章 WEB基礎(chǔ)知識Web實質(zhì)Web是基于Internet的一個多媒體信息服務(wù)系統(tǒng)它基于客戶/服務(wù)器模式，整個系統(tǒng)由Web服務(wù)器、瀏覽器（Browser）和通信協(xié)議等三部分組成通信協(xié)議采用的是HTTP協(xié)議協(xié)議HTTP協(xié)議是超文本傳輸協(xié)議（HypertextTransferProtocol）的簡寫，HTTP協(xié)議處于TCP/IP協(xié)議簇的應(yīng)用層第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Web實質(zhì)第一章 WEB基礎(chǔ)知識HTTP協(xié)議介紹HTTP是基于客戶/服務(wù)器模式且是面向連接的HTTP能夠傳送任意類型數(shù)據(jù)對象HTTP連接是一種一次性連接，每次連接只處理一個請求HTTP是一種無狀態(tài)協(xié)議，即服務(wù)器不保留與客戶交易時的任何狀態(tài)HTTP的默認TCP端口是80第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系HTTP協(xié)議介紹第一章 WEB基礎(chǔ)知識WEB與Internet的關(guān)系Web是運行在Internet之上最流行的應(yīng)用之一，Internet為Web提供了網(wǎng)絡(luò)環(huán)境Web的出現(xiàn)，極大地推動了Internet的普及與推廣第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系WEB與Internet的關(guān)系第一章 WEB基礎(chǔ)知識基本原理概述在Web服務(wù)器上，主要以網(wǎng)頁（HomePage）的形式來發(fā)布多媒體信息網(wǎng)頁采用超文本標記語言HTML（HyperTextMarkupLanguage）來編寫當瀏覽器軟件連接到Web服務(wù)器并獲取網(wǎng)頁后，通過對網(wǎng)頁HTML文檔的解釋執(zhí)行將網(wǎng)頁所包含的信息顯示在用戶的屏幕上

基本組織形式Web是一個超文本文件的集合超文本文件是Web的基本組成單元，也稱為網(wǎng)頁或HTML文檔、Web頁等，通常是以.html或.htm為后綴的文件Web頁之間通過超文本中的超級鏈接組織在一起第一章 WEB基礎(chǔ)知識第三節(jié)WEB工作原理基本原理概述第一章 WEB基礎(chǔ)知識Web實質(zhì)以及工作原理第一章 WEB基礎(chǔ)知識第三節(jié)WEB工作原理輸入網(wǎng)址requesthttp協(xié)議Web實質(zhì)以及工作原理第一章 WEB基礎(chǔ)知識輸request動態(tài)WEB概述什么是動態(tài)WEB能夠動態(tài)地安排Web頁面元素的顯示方式Web頁具有動態(tài)交互性。用戶可以提交信息，服務(wù)器可以根據(jù)用戶提交的信息動態(tài)生成返回頁面動態(tài)Web使得人們可以建立基于瀏覽器的信息系統(tǒng)，這是電子商務(wù)實施的平臺第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)動態(tài)WEB概述第一章 WEB基礎(chǔ)知識客戶端技術(shù)作用描述自動控制包含在網(wǎng)頁中的HTML元素，以實現(xiàn)一些動態(tài)效果。（比如讓文字走動）響應(yīng)用戶鼠標和鍵盤消息根據(jù)用戶的軟硬件環(huán)境決定頁面的顯示（比如瀏覽器的版本）第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)客戶端技術(shù)作用第一章 WEB基礎(chǔ)知識主要客戶端技術(shù)VBScriptJavaScript第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要客戶端技術(shù)第一章 WEB基礎(chǔ)知識主要服務(wù)器端技術(shù)描述用戶信息的收集和登記用戶訪問行為的記錄根據(jù)用戶提交的請求和查詢關(guān)鍵字訪問數(shù)據(jù)庫并以HTML頁面的方式返回結(jié)果第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要服務(wù)器端技術(shù)第一章 WEB基礎(chǔ)知識主要服務(wù)器端技術(shù)ASP（ActiveServerPage）PHP（HypertextPreprocessor）JSP（JavaServerPage）第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要服務(wù)器端技術(shù)第一章 WEB基礎(chǔ)知識第二章 HTML入門基礎(chǔ)本章內(nèi)容提示：HTML概述<html>標簽<head>標簽<body>標簽文字版面的排版超鏈接建立列表圖像的處理網(wǎng)頁動畫和多媒體效果第二章 HTML入門基礎(chǔ)本章內(nèi)容提示：HTML概述HTML語法的起源HTML是一種標記語言，起源于SGML（StandardGeneralizedMarkupLanguage）標準的通用標記語言HTML由TimBerners-Lee和同事NanielW.Connolly在瑞士日內(nèi)瓦的歐洲粒子實驗室發(fā)明，伴隨著WEB一起誕生。第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML概述第二章 HTML入門基礎(chǔ)HTML概述HTML的相關(guān)術(shù)語標記：標記是用尖括號<>包圍的單詞,很多標記是成對的，一個是開始標記,一個是結(jié)束標記（單詞前加/）

元素：每一對尖括號包圍的部分，比如<p></p>之間包含的部分就叫p元素屬性：屬性為HTML元素提供附加信息，其總是以名稱/值對的形式出現(xiàn)，比如：name=“value”,并在HTML元素的開始標簽中規(guī)定。第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML概述第二章 HTML入門基礎(chǔ)HTML基本語法一般來說，HTML的語法有三種表達方式，如下：<標記>內(nèi)容</標記><標記屬性1=參數(shù)1屬性2=參數(shù)2…>內(nèi)容</標記><標記>第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML基本語法第二章 HTML入門基礎(chǔ)HTML基本語法<標記>內(nèi)容</標記>大多數(shù)標記是封閉類型的，它們成對出現(xiàn)，在內(nèi)容的前面是一個標記，而在內(nèi)容的后面是另一個標記，第二個標記元素前帶有反斜線，表明結(jié)束標記對內(nèi)容的控制。對于此種類型的標記，請謹記封閉標記。第二章 HTML入門基礎(chǔ)第一節(jié)html概述<strong>粗體</strong>HTML基本語法第二章 HTML入門基礎(chǔ)<strong>粗體HTML基本語法<標記屬性1=參數(shù)1屬性2=參數(shù)2…>內(nèi)容</標記>可以通過對標記的某個屬性設(shè)置值，如果有多個屬性，可使用空格隔開。第二章 HTML入門基礎(chǔ)第一節(jié)html概述<trcolspan=“2”rowspan=“3”>3行2列</tr>HTML基本語法第二章 HTML入門基礎(chǔ)<trcolspaHTML基本語法<標記>此標記沒有結(jié)束標記，比如換行標記：<br>.第二章 HTML入門基礎(chǔ)第一節(jié)html概述<p>This<br>isapara<br>graphwithlinebreaks</p>

HTML基本語法第二章 HTML入門基礎(chǔ)<p>This<bHTML文檔結(jié)構(gòu)一個HTML文檔可以看成由以下三個部分構(gòu)成：版本信息文件頭由<head></head>標記標識文檔主體部分由<body></body>標記標識第二章 HTML入門基礎(chǔ)第一節(jié)標簽介紹HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)<HTML></HTML>此元素可告知瀏覽器其自身是一個HTML文檔。<html>與</html>標簽限定了文檔的開始點和結(jié)束點，在它們之間是文檔的頭部和主體。文檔的頭部由<head>標簽定義，而主體由<body>標簽定義。第二章 HTML入門基礎(chǔ)第二節(jié)<HTML>標簽<HTML></HTML>第二章 HTML入門基HTML文檔結(jié)構(gòu)<head></head>

head元素包含了與當前文檔相關(guān)的信息，如文檔的標題、關(guān)鍵字（如果該文檔希望被搜索引擎搜索到，此部分信息很重要）、以及一些和文檔內(nèi)容無關(guān)僅對文檔本身進行說明的數(shù)據(jù)信息。head標簽里可以包含以下內(nèi)容：title：標題元素

base：文檔基礎(chǔ)目錄元素

meta：元數(shù)據(jù)元素

script：腳本元素

style：內(nèi)部樣式表的樣式元素

link：鏈接元素連接到外部樣式表

object：對象元素第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head>head標簽主要有以下三個屬性Lang：語言Dir：文本方向Profile：元數(shù)據(jù)的URL第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><title></title>標題元素的內(nèi)容出現(xiàn)在瀏覽器頂部沒有屬性必需出現(xiàn)在head元素中且只能由一個標題元素第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><meta>meta是關(guān)于某個網(wǎng)頁的基本信息搜索引擎對meta元素中數(shù)據(jù)進行搜索可以幫助訪問者找到該網(wǎng)頁第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><meta>使用示例讓網(wǎng)頁可以按關(guān)鍵字被搜索引擎搜索到定時刷新讓網(wǎng)頁始終保持最新瀏覽器為了節(jié)約時間，在本地硬盤上保存一個網(wǎng)上文件的臨時版本。當反復(fù)瀏覽該頁時，瀏覽器直接調(diào)用硬盤上的文件，而不是網(wǎng)上的，可以使用meta標簽讓瀏覽器強制調(diào)用網(wǎng)上最新版本。第二章 HTML入門基礎(chǔ)第三節(jié)head標簽<metaname="keywords"content="這里寫關(guān)鍵字"><metahttp-equiv="refresh"content="10"><metahttp-equiv="Pragma"content="no-cache">HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)<metaname<body></body>標簽body元素定義文檔的主體。body元素包含文檔的幾乎所有內(nèi)容（比如文本、超鏈接、圖像、表格和列表等等。）主要屬性background背景圖像的URLtext文本的前景色link鏈接的前景色vlink已訪問過的鏈接的前景色alink活躍鏈接的前景色bgcolor背景色id、class為樣式表設(shè)置的標識屬性title提示文字（與tilte元素不同）style樣式信息第二章 HTML入門基礎(chǔ)第四節(jié)<body>標簽<body></body>第二章 HTML入門基<body></body>第二章 HTML入門基礎(chǔ)第四節(jié)<body>標簽<BODYbgcolor="red">

這是body內(nèi)容的標題

</BODY><body></body>第二章 HTML入門基換段落標簽<p><p>標簽里可以嵌套其它塊元素、內(nèi)聯(lián)元素、文本等內(nèi)容可以包含以下屬性：id、class：和樣式表結(jié)合使用，給文檔中的某一段落賦以唯一的標識lang、dir：語言和文本方向title：元素的標題，它的作用是設(shè)定當鼠標停留在該元素上時，出現(xiàn)的高亮提示文字style：直接指定該元素的樣式align：對齊屬性。建議不使用，因為該屬性應(yīng)該在樣式表中給出第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版換段落標簽<p>第二章 HTML入門基礎(chǔ)換段落標簽<p>第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<palign="center">段落測試</p><palign="right">段落測試</p><palign="left">段落測試</p>換段落標簽<p>第二章 HTML入門基礎(chǔ)<palign="定義標題<h1>-<h6>標簽可定義標題。<h1>定義最大的標題。<h6>定義最小的標題。主要屬性：align：規(guī)定標題中文本的排列(不推薦使用，可使用樣式表達到效果)。

第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<h1>這是標題1</h1><h2>這是標題2</h2><h3>這是標題3</h3><h4>這是標題4</h4><h5>這是標題5</h5><h6>這是標題6</h6>定義標題第二章 HTML入門基礎(chǔ)<h1>這是標題1</h1換行標簽<br>使用br標簽，可以對文本進行換行，和“回車”的效果一致。其只需一個開始標記<br>即可實現(xiàn)換行，沒有相應(yīng)的內(nèi)容，也沒有結(jié)束標記。主要屬性：id,class標識和類標識title高亮提示style樣式信息第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版換行標簽<br>第二章 HTML入門基礎(chǔ)居中標簽可以使用<center>標簽讓標簽內(nèi)的內(nèi)容居中顯示。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<center>居中測試</center>居中標簽第二章 HTML入門基礎(chǔ)<center>居中測試</水平分割線<hr/>：HTML提供了修飾段落的水平分割線，在很多場合可以輕松使用，不需要另外作圖。默認情況下<hr>占用一行?？梢园韵聦傩詀lign：規(guī)定hr元素的對齊方式noshade：規(guī)定hr元素的顏色呈現(xiàn)為純色size：規(guī)定hr元素的高度(厚度)width：規(guī)定hr元素的寬度第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版以上屬性均不推薦使用，而用樣式取代它.水平分割線第二章 HTML入門基礎(chǔ)以上屬性均不推薦使用，而用給文字加入空格“ ”:在HTML代碼中直接用鍵盤敲擊空格鍵，是無法顯示在頁面上的。HTML使用“ “表現(xiàn)一個空格字符(英文的空格字符)，一個中文字符占兩個英文字符寬度。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<p>   

標簽在HTML頁面中創(chuàng)建一條水平線。<hr>水平分隔線可以在視覺上將文檔分隔成各個部分。給文字加入空格第二章 HTML入門基礎(chǔ)<p> &n注釋標簽<!--...-->：注釋標簽用來在源文檔中插入注釋。注釋會被瀏覽器忽略。您可使用注釋對您的代碼進行解釋，這樣做有助于您在以后的時間對代碼的編輯。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<!--Thistextisacomment--><p>Thisisaregularparagraph</p>注釋標簽第二章 HTML入門基礎(chǔ)<!--Thistext文字屬性文字樣式設(shè)置設(shè)置字體樣式的基本標簽是<font></font>,被其包含的文本為樣式作用區(qū)可以包含以下屬性color：規(guī)定文本的顏色face：規(guī)定文本的字體size：規(guī)定文本的大小第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<fontsize="5"color="red“face="隸書">華師大軟件學(xué)院</font>文字屬性第二章 HTML入門基礎(chǔ)<fontsize="5"文字屬性使文字傾斜用雙標簽<i></i>可使被作用文字傾斜，達到特殊的效果。<em></em>被稱為強調(diào)標簽，也是斜體。使文字加粗用雙標簽<b></b>可使被作用的文字加粗，使文字更加醒目。<strong></strong>被稱為強調(diào)標簽，也使文字加粗。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<i>斜體測試</i><em>斜體測試</em><b>粗體測試</b><strong>粗體測試</strong>文字屬性第二章 HTML入門基礎(chǔ)<i>斜體測試</i><b>文字屬性給文字加下劃線用雙標簽<u></u>可添加下劃線到被作用文字。其他文字修飾方法<sup></sup>:多用于數(shù)學(xué)指數(shù)的表示，比如某個數(shù)的平方或立方。<sub></sub>:多用于注釋，以及數(shù)學(xué)的底數(shù)表示。<strike></strike>：多用于刪除效果。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<u>文字下劃線</u>文字屬性第二章 HTML入門基礎(chǔ)文字屬性特殊字符第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版特殊字符Html代碼特殊字符Html代碼<<TM(商標符號)™>>?(注冊符號)®“”(英文半角)"×&time;&§?(版權(quán)符號)©空格

文字屬性第二章 HTML入門基礎(chǔ)特殊字符Html代碼特殊字符超鏈接介紹及使用簡介超級鏈接是網(wǎng)站中使用比較頻繁的HTML元素，因為網(wǎng)站的各種頁面都是由超級鏈接串接而成，超鏈接完成了頁面之間的調(diào)整。給文字添加鏈接超鏈接的標簽是<a></a>，給文字添加超鏈接類似于其他修飾標簽。添加了鏈接后的文字有其特殊樣式，以和其他文字區(qū)分，默認鏈接樣式為藍色文字，有下劃線。超鏈接是跳轉(zhuǎn)到另一個頁面的，<a></a>標簽有一個href屬性負責(zé)指定新頁面的地址。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref="test.html">鏈接至另一個頁面</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref="t超鏈接介紹及使用給鏈接添加提示文字很多情況下，超鏈接的文字不足以描述所要鏈接的內(nèi)容，超鏈接標簽提供了title屬性能很方便的給瀏覽者做出提示。title屬性的值即為提示內(nèi)容，當瀏覽者的光標停留在超鏈接上時，提示內(nèi)容才會出現(xiàn)，這樣不會影響頁面排版的整潔。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref=“test.html”title=“本鏈接可以跳轉(zhuǎn)到test.html頁面">鏈接至另一個頁面</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref=“t超鏈接介紹及使用電子郵件、FTP和Telnet的鏈接超鏈接還可以進一步擴展網(wǎng)頁的功能，比較常用的有發(fā)電子郵件、FTP以及Telnet鏈接。具體使用如下：第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref="mailto:lmao@">發(fā)送伊妹兒</a><ahref="1">連接接ftp服務(wù)器</a><ahref="telnet://54">遠程登錄服務(wù)器</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref="m超鏈接介紹及使用錨點很多網(wǎng)頁文章的內(nèi)容比較多，導(dǎo)致頁面很長，瀏覽者需要不斷地拖動瀏覽器的滾動條才能找到需要的內(nèi)容。超鏈接的錨功能可以解決這個問題。實際上錨就是用于在單個頁面內(nèi)不同位置的跳轉(zhuǎn)。超鏈接標簽的name屬性用于定義錨的名稱，一個頁面可以定義多個錨，通過超鏈接的href屬性可以根據(jù)name跳轉(zhuǎn)到對應(yīng)的錨。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接介紹及使用第二章 HTML入門基礎(chǔ)超鏈接窗口屬性默認情況下，超鏈接打開新頁面的方式是自我覆蓋，即在原網(wǎng)頁上打開新網(wǎng)頁。根據(jù)瀏覽者的不同需要，可以指定超鏈接的其他打開新窗口的方式。超鏈接標簽<a>提供了target屬性進行設(shè)置，取值分別為_self(自我覆蓋，默認)、_blank(創(chuàng)建新窗口打開新頁面)、_top(在瀏覽器的整個窗口打開，將會忽略所有的框架結(jié)構(gòu))、_parent(在上一級窗口打開).第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接窗口屬性第二章 HTML入門基礎(chǔ)超鏈接路徑超鏈接標簽<a>的href屬性值為某個網(wǎng)頁的路徑，路徑共分為：相對路徑、絕對路徑和萬維網(wǎng)路徑。相對路徑其它頁面相對于本頁面的路徑，以本頁面所在的位置為參照。絕對路徑需要跳轉(zhuǎn)至的頁面在硬盤或者文件系統(tǒng)里的絕對路徑。萬維網(wǎng)路徑超鏈接的路徑可以是萬維網(wǎng)上的任何一個路徑，比如、等。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接路徑第二章 HTML入門基礎(chǔ)插入圖片到網(wǎng)頁插入圖片使用單標簽<img>，通過src屬性的值確定所插入圖片的路徑。<img>是單標簽，意思是說，它只包含屬性，并且沒有閉合標簽。設(shè)置圖片的高度和寬度在默認情況下，<img>標簽顯示的圖片高和寬取圖片原始的高和寬。不過在某些情況下需要不同的高和寬，通過<img>標簽的width屬性和height屬性可以設(shè)置圖片在網(wǎng)頁顯示寬度和高度，屬性的默認單位為像素。第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”><imgsrc=“img/img.jpg”widt=“100”,height=“180”>插入圖片到網(wǎng)頁第二章 HTML入門基礎(chǔ)<imgsrc=“i設(shè)置圖片的邊框<img>標簽可以通過border屬性的設(shè)置，是圖片在網(wǎng)頁中顯示邊框，border屬性的值為邊框的粗細，單位默認為像素。給圖片添加提示文字類似于超鏈接的文字提示，<img/>標簽的title屬性同樣可以設(shè)置圖片的文字提示，示例如下。第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”border=“5”><imgsrc=“img/img.jpg”title=“這是一只可愛的小狗”/>設(shè)置圖片的邊框第二章 HTML入門基礎(chǔ)<imgsrc=“i給圖片添加替代文字當<img>標簽的src屬性的路徑找不到相應(yīng)的圖片文件時，<img/>標簽提供了一個alt屬性的值來替代圖片的文字。給圖片添加超鏈接和文字的超鏈接類似，也可以對圖片添加超鏈接。示例如下:第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”alt=“圖片無法顯示”><ahref=“img.html”><imgsrc=“img/img.jpg”/></a>

給圖片添加替代文字第二章 HTML入門基礎(chǔ)<imgsrc=圖文混合排版<img>標簽的align屬性可以規(guī)定如何根據(jù)周圍的文本來排列圖像。具體如下：top 圖像頂部和同行文本最高部分對齊middle 圖像中部和同行文本的極限對齊bottom 圖像底部和同行文本的底部對齊left 使圖像和左邊界對齊right 使圖像和右邊界對齊absmiddle 圖像中部和同行文本的中部絕對對齊

第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理圖文混合排版第二章 HTML入門基礎(chǔ)滾動字幕<marguee>:通過使用<marguee>標簽，能夠使網(wǎng)頁中的文字滾動，并可以控制其滾動的屬性。其有以下屬性：direction：用于設(shè)置內(nèi)容滾動方向，屬性值有：left、right、up、down。scrollamount：用于設(shè)置內(nèi)容滾動速度。behavior：用于設(shè)置內(nèi)容滾動方式，默認為scroll，即循環(huán)滾動。當其值為alternate時，內(nèi)容將來回循環(huán)滾動。當其值為slide時，內(nèi)容滾動一次即停止，不會循環(huán)。還有一個loop屬性可以設(shè)置其滾動循環(huán)次數(shù)，默認沒有限制。scrolldelay：用于設(shè)置內(nèi)容滾動的時間間隔bgcolor：用于設(shè)置內(nèi)容滾動背景色width：用于設(shè)置內(nèi)容滾動背景寬度height：用于設(shè)置內(nèi)容滾動背景高度。第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果滾動字幕第二章 HTML入門基礎(chǔ)插入多媒體文件標簽使用<embed></embed>標簽使網(wǎng)頁可以實現(xiàn)調(diào)用瀏覽者系統(tǒng)的媒體播放器，播放網(wǎng)絡(luò)上的音樂及視頻資源。其有以下屬性height：設(shè)置嵌入內(nèi)容的高度src：嵌入內(nèi)容的URLautostart：規(guī)定音頻或視頻文件是否在下載完之后就自動播放width：設(shè)置嵌入內(nèi)容的寬度hidden：規(guī)定控制面板是否顯示starttime：規(guī)定音頻或視頻文件開始播放的時間align：規(guī)定控制面板和當前行中的對象的對齊方式第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果插入多媒體文件第二章 HTML入門基礎(chǔ)插入背景音樂使用HTML中的單標簽<bgsound>可以為網(wǎng)頁添加背景音樂.其共有src和loop兩個屬性。其中src屬性指定所連接的音樂資源路徑；loop屬性指定背景音樂的循環(huán)播放次數(shù),如果值為-1，則表示無限循環(huán)。第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果<bgsoundsrc=“music/1.midi”loop=“-1”>插入背景音樂第二章 HTML入門基礎(chǔ)<bgsoundsrc第三章 TABLE布局本章內(nèi)容提示：TABLE介紹<TABLE>標簽<TR>標簽<TD>標簽第三章 TABLE布局本章內(nèi)容提示：TABLE介紹表格在網(wǎng)站應(yīng)用中非常廣泛,可以方便靈活的排版,很多動態(tài)大型網(wǎng)站也都是借助表格排版,表格可以把相互關(guān)聯(lián)的信息元素集中定位,使瀏覽頁面的人一目了然.認識TABLE的作用用表格組織數(shù)據(jù)用表格布局網(wǎng)頁第三章 TABLE布局第一節(jié)TABLE介紹TABLE介紹第三章 TABLE布局與表格相關(guān)的元素第三章 TABLE布局第一節(jié)TABLE介紹與表格相關(guān)的元素第三章 TABLE布局<TABLE>每一對<table></table>代表一個表格.其主要有以下內(nèi)容組成：caption：表格標題元素col：列元素colgroup：列分組元素thead：表頭行分組元素tbody：表主體行分組元素tfoot：表尾行分組元素tr：行元素td：單元格元素第三章 TABLE布局第二節(jié)<TABLE>標簽<TABLE>第三章 TABLE布局簡介<tr>標簽定義HTML表格中的行。tr元素包含一個或多個th或td元素。屬性標準屬性：id,class,title,style,dir,lang,xml:lang

可選屬性：align、bgcolor、valign、charoff、char第三章 TABLE布局第三節(jié)<TR>標簽簡介第三章 TABLE布局簡介<td>標簽定義HTML表格中的標準單元格。HTML表格有兩類單元格：表頭單元-包含頭部信息（由th元素創(chuàng)建）標準單元-包含數(shù)據(jù)（由td元素創(chuàng)建）td元素中的文本一般顯示為正常字體且左對齊。

屬性標準屬性：id,class,title,style,dir,lang,xml:lang可選屬性：abbr、align、axis、bgcolor、valign、charoff、char、colspan、rowspan

第三章 TABLE布局第四節(jié)<TD>標簽簡介第三章 TABLE布局第四章 表單標簽本章內(nèi)容提示：FORM介紹<FORM>標簽<INPUT><SELECT><TEXTAREA>第四章 表單標簽本章內(nèi)容提示：FORM概述表單是由窗體和控件組成的,一個表單一般應(yīng)該包含用戶填寫信息的輸入框,提交和按鈕等，這些輸入框、按鈕叫做控件,表單很像容器,它能夠容納各種各樣的控件。第四章 表單標簽第一節(jié)FORM介紹FORM概述第四章 表單標簽<FORM>的控制元素包含在表單元素中具有可視化外觀的HTML元素，即提供一個界面，一個入口，便于瀏覽者把數(shù)據(jù)提交給后臺程序處理。相關(guān)表單標簽input元素textarea元素select和option元素第四章 表單標簽第二節(jié)<FORM>標簽<FORM>的控制元素第四章 表單標簽表單的數(shù)據(jù)傳遞方式<form>標簽有一個action屬性，其值為表單提交目標程序的URL。另一個重要的屬性method，即提交數(shù)據(jù)的方法，有兩種：get和post。get和post介紹get方法通過URL傳數(shù)據(jù)給程序，數(shù)據(jù)容量小，并且數(shù)據(jù)暴露在URL中，非常不安全。get將表單中的數(shù)據(jù)按照“變量=值”的方式，添加到action所指向的URL后面，并且兩者使用“？”連接，而各個變量之間使用“&”連接。post將表單中的數(shù)據(jù)放在form的數(shù)據(jù)體中，按照變量和值對應(yīng)的方式，傳遞到action所指向的程序，post方法能傳遞大容量的數(shù)據(jù)。第四章 表單標簽第二節(jié)<FORM>標簽表單的數(shù)據(jù)傳遞方式第四章 表單標簽<input>寫法該標記是單個標記，沒有結(jié)束標記。<inputtype="">Type屬性值定義name控件名稱type控件類型如：button普通按鈕，text文本框等align指定對齊方式,可取top,bottom,middlesize指定控件的寬度value用于設(shè)定輸入默認值maxlength在單行文本的時候允許輸入的最大字符數(shù)src插入圖像的地址event指定激發(fā)的事件第四章 表單標簽第三節(jié)<INPUT><input>寫法第四章 表單標簽<select>select元素可創(chuàng)建單選或多選菜單。其子項<option></option>為數(shù)據(jù)選項。<select>標簽如果加上multiple屬性，下拉列表即呈現(xiàn)為列表框控件，其size屬性值設(shè)置所顯示數(shù)據(jù)項的數(shù)量，name屬性表示下拉列表的名稱。第四章 表單標簽第四節(jié)<SELECT><select> <optionvalue="volvo">Volvo</option> <optionvalue="saab">Saab</option> <optionvalue="opel">Opel</option> <optionvalue="audi">Audi</option></select><select>第四章 表單標簽<select><TEXTAREA><textarea></textarea>用來創(chuàng)建一個可以輸入多行的文本框，此標志對用于<form></form>標志對之間。文本區(qū)中可容納無限數(shù)量的文本，其中的文本的默認字體是等寬字體（通常是Courier）。可以通過cols和rows屬性來規(guī)定textarea的尺寸，不過更好的辦法是使用CSS的height和width屬性。屬性必須的屬性：cols（指定寬度），rows（指定行數(shù)）可選屬性：disabled、name、readonly第四章 表單標簽第四節(jié)<TEXTAREA><TEXTAREA>第四章 表單標簽第五章 常用工具介紹本章內(nèi)容提示：DREAMWEAVERFLASHPHOTOSHOP第五章 常用工具介紹本章內(nèi)容提示：DREAMWEAVER介紹Dreamweaver是由Macromedia公司推出的，用于網(wǎng)頁開發(fā)和網(wǎng)站管理的專業(yè)化設(shè)計工具。它采用了多種新技術(shù)，具有設(shè)計和開發(fā)網(wǎng)站過程中需要的網(wǎng)站管理、網(wǎng)站設(shè)計、頁面制作、多媒體制作和動畫制作等豐富實用的功能；它具有友好的操作界面，在文檔窗口中可以打開各種浮動面板，同時還可以使用系統(tǒng)內(nèi)置的多種對象進行操作。

演示相關(guān)工具第五章 常用工具介紹第一節(jié)DREAMWEAVERDREAMWEAVER介紹第五章 常用工具介紹FLASH介紹用途

Flash是Macromedia公司開發(fā)的網(wǎng)頁多媒體制作軟體，向量繪圖與動畫編輯功能，簡易地制作連續(xù)動畫、互動按鈕、繪圖與音效在您的網(wǎng)頁中使用！可以不需要任何程式腳本即可在網(wǎng)頁中增加互動式多媒體?；邮降膭赢嫼陀耙敉叫Ч咕W(wǎng)頁繪圖更加生動活潑，使用了Flash制作的任何物件，皆可以時間軸與動態(tài)路徑(Path-Based)的動畫設(shè)計方式，由淺入深，容易學(xué)習(xí)與使用！Flash提供了很棒的線上教學(xué)。只有以向量為基礎(chǔ)的Flash多媒體，才能流暢地呈現(xiàn)在Internet上，即使放大縮小也不降低本身品質(zhì)。案例第五章 常用工具介紹第二節(jié)FLASHFLASH介紹第五章 常用工具介紹PHOTOSHOP介紹Photoshop是世界頂尖級的圖像設(shè)計與制作工具軟件。圖像處理是對已有的位圖圖像進行編輯加工處理以及運用一些特殊效果，其重點在于對圖像的處理加工。在表現(xiàn)圖像中的陰影和色彩的細微變化方面或者進行一些特殊效果處理時，使用位圖形式是最佳的選擇，它在這方面的優(yōu)點是矢量圖無法比擬的。

第五章 常用工具介紹第三節(jié)PHOTOSHOPPHOTOSHOP介紹第五章 常用工具介紹HTML—超文本標記語言HTML—超文本標記語言課程大綱第一章：WEB基礎(chǔ)知識第二章：HTML入門基礎(chǔ)第三章：TABLE布局第四章：表單標簽第五章：常用工具介紹課程大綱第一章：WEB基礎(chǔ)知識本章內(nèi)容提示：靜態(tài)門戶網(wǎng)站導(dǎo)入Web與Internet的關(guān)系Web的工作原理動態(tài)Web開發(fā)技術(shù)第一章 WEB基礎(chǔ)知識本章內(nèi)容提示：第一章 WEB基礎(chǔ)知識導(dǎo)入靜態(tài)門戶網(wǎng)站案例第一章 WEB基礎(chǔ)知識第一節(jié)靜態(tài)門戶網(wǎng)站導(dǎo)入top導(dǎo)航foot導(dǎo)入靜態(tài)門戶網(wǎng)站案例第一章 WEB基礎(chǔ)知識top導(dǎo)航footInternet介紹Web實質(zhì)HTTP協(xié)議介紹WEB與Internet的關(guān)系第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Internet介紹第一章 WEB基礎(chǔ)知識Internet介紹Internet是一個全球性的計算機互聯(lián)網(wǎng)絡(luò)，中文名稱有“因特網(wǎng)”、“國際互聯(lián)網(wǎng)”、“網(wǎng)際網(wǎng)”、“交互網(wǎng)絡(luò)”等。英特網(wǎng)主要提供以下服務(wù)第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系其他文件傳輸FTP電子公告牌BBS萬維網(wǎng)WWW電子郵件Email遠程登錄Telnet中文名英文名Internet介紹第一章 WEB基礎(chǔ)知識其他文件傳輸FTPWeb實質(zhì)Web又稱做萬維網(wǎng)或環(huán)球網(wǎng)，是WWW（WorldWideWeb）的簡稱。Web的功能發(fā)布信息搜索和瀏覽文本和圖片信息在線播放音、視頻文件發(fā)表觀點電子購物第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Web實質(zhì)第一章 WEB基礎(chǔ)知識Web實質(zhì)Web是基于Internet的一個多媒體信息服務(wù)系統(tǒng)它基于客戶/服務(wù)器模式，整個系統(tǒng)由Web服務(wù)器、瀏覽器（Browser）和通信協(xié)議等三部分組成通信協(xié)議采用的是HTTP協(xié)議協(xié)議HTTP協(xié)議是超文本傳輸協(xié)議（HypertextTransferProtocol）的簡寫，HTTP協(xié)議處于TCP/IP協(xié)議簇的應(yīng)用層第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系Web實質(zhì)第一章 WEB基礎(chǔ)知識HTTP協(xié)議介紹HTTP是基于客戶/服務(wù)器模式且是面向連接的HTTP能夠傳送任意類型數(shù)據(jù)對象HTTP連接是一種一次性連接，每次連接只處理一個請求HTTP是一種無狀態(tài)協(xié)議，即服務(wù)器不保留與客戶交易時的任何狀態(tài)HTTP的默認TCP端口是80第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系HTTP協(xié)議介紹第一章 WEB基礎(chǔ)知識WEB與Internet的關(guān)系Web是運行在Internet之上最流行的應(yīng)用之一，Internet為Web提供了網(wǎng)絡(luò)環(huán)境Web的出現(xiàn)，極大地推動了Internet的普及與推廣第一章 WEB基礎(chǔ)知識第二節(jié)WEB與Internet的關(guān)系WEB與Internet的關(guān)系第一章 WEB基礎(chǔ)知識基本原理概述在Web服務(wù)器上，主要以網(wǎng)頁（HomePage）的形式來發(fā)布多媒體信息網(wǎng)頁采用超文本標記語言HTML（HyperTextMarkupLanguage）來編寫當瀏覽器軟件連接到Web服務(wù)器并獲取網(wǎng)頁后，通過對網(wǎng)頁HTML文檔的解釋執(zhí)行將網(wǎng)頁所包含的信息顯示在用戶的屏幕上

基本組織形式Web是一個超文本文件的集合超文本文件是Web的基本組成單元，也稱為網(wǎng)頁或HTML文檔、Web頁等，通常是以.html或.htm為后綴的文件Web頁之間通過超文本中的超級鏈接組織在一起第一章 WEB基礎(chǔ)知識第三節(jié)WEB工作原理基本原理概述第一章 WEB基礎(chǔ)知識Web實質(zhì)以及工作原理第一章 WEB基礎(chǔ)知識第三節(jié)WEB工作原理輸入網(wǎng)址requesthttp協(xié)議Web實質(zhì)以及工作原理第一章 WEB基礎(chǔ)知識輸request動態(tài)WEB概述什么是動態(tài)WEB能夠動態(tài)地安排Web頁面元素的顯示方式Web頁具有動態(tài)交互性。用戶可以提交信息，服務(wù)器可以根據(jù)用戶提交的信息動態(tài)生成返回頁面動態(tài)Web使得人們可以建立基于瀏覽器的信息系統(tǒng)，這是電子商務(wù)實施的平臺第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)動態(tài)WEB概述第一章 WEB基礎(chǔ)知識客戶端技術(shù)作用描述自動控制包含在網(wǎng)頁中的HTML元素，以實現(xiàn)一些動態(tài)效果。（比如讓文字走動）響應(yīng)用戶鼠標和鍵盤消息根據(jù)用戶的軟硬件環(huán)境決定頁面的顯示（比如瀏覽器的版本）第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)客戶端技術(shù)作用第一章 WEB基礎(chǔ)知識主要客戶端技術(shù)VBScriptJavaScript第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要客戶端技術(shù)第一章 WEB基礎(chǔ)知識主要服務(wù)器端技術(shù)描述用戶信息的收集和登記用戶訪問行為的記錄根據(jù)用戶提交的請求和查詢關(guān)鍵字訪問數(shù)據(jù)庫并以HTML頁面的方式返回結(jié)果第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要服務(wù)器端技術(shù)第一章 WEB基礎(chǔ)知識主要服務(wù)器端技術(shù)ASP（ActiveServerPage）PHP（HypertextPreprocessor）JSP（JavaServerPage）第一章 WEB基礎(chǔ)知識第四節(jié)動態(tài)WEB開發(fā)技術(shù)主要服務(wù)器端技術(shù)第一章 WEB基礎(chǔ)知識第二章 HTML入門基礎(chǔ)本章內(nèi)容提示：HTML概述<html>標簽<head>標簽<body>標簽文字版面的排版超鏈接建立列表圖像的處理網(wǎng)頁動畫和多媒體效果第二章 HTML入門基礎(chǔ)本章內(nèi)容提示：HTML概述HTML語法的起源HTML是一種標記語言，起源于SGML（StandardGeneralizedMarkupLanguage）標準的通用標記語言HTML由TimBerners-Lee和同事NanielW.Connolly在瑞士日內(nèi)瓦的歐洲粒子實驗室發(fā)明，伴隨著WEB一起誕生。第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML概述第二章 HTML入門基礎(chǔ)HTML概述HTML的相關(guān)術(shù)語標記：標記是用尖括號<>包圍的單詞,很多標記是成對的，一個是開始標記,一個是結(jié)束標記（單詞前加/）

元素：每一對尖括號包圍的部分，比如<p></p>之間包含的部分就叫p元素屬性：屬性為HTML元素提供附加信息，其總是以名稱/值對的形式出現(xiàn)，比如：name=“value”,并在HTML元素的開始標簽中規(guī)定。第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML概述第二章 HTML入門基礎(chǔ)HTML基本語法一般來說，HTML的語法有三種表達方式，如下：<標記>內(nèi)容</標記><標記屬性1=參數(shù)1屬性2=參數(shù)2…>內(nèi)容</標記><標記>第二章 HTML入門基礎(chǔ)第一節(jié)html概述HTML基本語法第二章 HTML入門基礎(chǔ)HTML基本語法<標記>內(nèi)容</標記>大多數(shù)標記是封閉類型的，它們成對出現(xiàn)，在內(nèi)容的前面是一個標記，而在內(nèi)容的后面是另一個標記，第二個標記元素前帶有反斜線，表明結(jié)束標記對內(nèi)容的控制。對于此種類型的標記，請謹記封閉標記。第二章 HTML入門基礎(chǔ)第一節(jié)html概述<strong>粗體</strong>HTML基本語法第二章 HTML入門基礎(chǔ)<strong>粗體HTML基本語法<標記屬性1=參數(shù)1屬性2=參數(shù)2…>內(nèi)容</標記>可以通過對標記的某個屬性設(shè)置值，如果有多個屬性，可使用空格隔開。第二章 HTML入門基礎(chǔ)第一節(jié)html概述<trcolspan=“2”rowspan=“3”>3行2列</tr>HTML基本語法第二章 HTML入門基礎(chǔ)<trcolspaHTML基本語法<標記>此標記沒有結(jié)束標記，比如換行標記：<br>.第二章 HTML入門基礎(chǔ)第一節(jié)html概述<p>This<br>isapara<br>graphwithlinebreaks</p>

HTML基本語法第二章 HTML入門基礎(chǔ)<p>This<bHTML文檔結(jié)構(gòu)一個HTML文檔可以看成由以下三個部分構(gòu)成：版本信息文件頭由<head></head>標記標識文檔主體部分由<body></body>標記標識第二章 HTML入門基礎(chǔ)第一節(jié)標簽介紹HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)<HTML></HTML>此元素可告知瀏覽器其自身是一個HTML文檔。<html>與</html>標簽限定了文檔的開始點和結(jié)束點，在它們之間是文檔的頭部和主體。文檔的頭部由<head>標簽定義，而主體由<body>標簽定義。第二章 HTML入門基礎(chǔ)第二節(jié)<HTML>標簽<HTML></HTML>第二章 HTML入門基HTML文檔結(jié)構(gòu)<head></head>

head元素包含了與當前文檔相關(guān)的信息，如文檔的標題、關(guān)鍵字（如果該文檔希望被搜索引擎搜索到，此部分信息很重要）、以及一些和文檔內(nèi)容無關(guān)僅對文檔本身進行說明的數(shù)據(jù)信息。head標簽里可以包含以下內(nèi)容：title：標題元素

base：文檔基礎(chǔ)目錄元素

meta：元數(shù)據(jù)元素

script：腳本元素

style：內(nèi)部樣式表的樣式元素

link：鏈接元素連接到外部樣式表

object：對象元素第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head>head標簽主要有以下三個屬性Lang：語言Dir：文本方向Profile：元數(shù)據(jù)的URL第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><title></title>標題元素的內(nèi)容出現(xiàn)在瀏覽器頂部沒有屬性必需出現(xiàn)在head元素中且只能由一個標題元素第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><meta>meta是關(guān)于某個網(wǎng)頁的基本信息搜索引擎對meta元素中數(shù)據(jù)進行搜索可以幫助訪問者找到該網(wǎng)頁第二章 HTML入門基礎(chǔ)第三節(jié)head標簽HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)HTML文檔結(jié)構(gòu)<head></head><meta>使用示例讓網(wǎng)頁可以按關(guān)鍵字被搜索引擎搜索到定時刷新讓網(wǎng)頁始終保持最新瀏覽器為了節(jié)約時間，在本地硬盤上保存一個網(wǎng)上文件的臨時版本。當反復(fù)瀏覽該頁時，瀏覽器直接調(diào)用硬盤上的文件，而不是網(wǎng)上的，可以使用meta標簽讓瀏覽器強制調(diào)用網(wǎng)上最新版本。第二章 HTML入門基礎(chǔ)第三節(jié)head標簽<metaname="keywords"content="這里寫關(guān)鍵字"><metahttp-equiv="refresh"content="10"><metahttp-equiv="Pragma"content="no-cache">HTML文檔結(jié)構(gòu)第二章 HTML入門基礎(chǔ)<metaname<body></body>標簽body元素定義文檔的主體。body元素包含文檔的幾乎所有內(nèi)容（比如文本、超鏈接、圖像、表格和列表等等。）主要屬性background背景圖像的URLtext文本的前景色link鏈接的前景色vlink已訪問過的鏈接的前景色alink活躍鏈接的前景色bgcolor背景色id、class為樣式表設(shè)置的標識屬性title提示文字（與tilte元素不同）style樣式信息第二章 HTML入門基礎(chǔ)第四節(jié)<body>標簽<body></body>第二章 HTML入門基<body></body>第二章 HTML入門基礎(chǔ)第四節(jié)<body>標簽<BODYbgcolor="red">

這是body內(nèi)容的標題

</BODY><body></body>第二章 HTML入門基換段落標簽<p><p>標簽里可以嵌套其它塊元素、內(nèi)聯(lián)元素、文本等內(nèi)容可以包含以下屬性：id、class：和樣式表結(jié)合使用，給文檔中的某一段落賦以唯一的標識lang、dir：語言和文本方向title：元素的標題，它的作用是設(shè)定當鼠標停留在該元素上時，出現(xiàn)的高亮提示文字style：直接指定該元素的樣式align：對齊屬性。建議不使用，因為該屬性應(yīng)該在樣式表中給出第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版換段落標簽<p>第二章 HTML入門基礎(chǔ)換段落標簽<p>第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<palign="center">段落測試</p><palign="right">段落測試</p><palign="left">段落測試</p>換段落標簽<p>第二章 HTML入門基礎(chǔ)<palign="定義標題<h1>-<h6>標簽可定義標題。<h1>定義最大的標題。<h6>定義最小的標題。主要屬性：align：規(guī)定標題中文本的排列(不推薦使用，可使用樣式表達到效果)。

第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<h1>這是標題1</h1><h2>這是標題2</h2><h3>這是標題3</h3><h4>這是標題4</h4><h5>這是標題5</h5><h6>這是標題6</h6>定義標題第二章 HTML入門基礎(chǔ)<h1>這是標題1</h1換行標簽<br>使用br標簽，可以對文本進行換行，和“回車”的效果一致。其只需一個開始標記<br>即可實現(xiàn)換行，沒有相應(yīng)的內(nèi)容，也沒有結(jié)束標記。主要屬性：id,class標識和類標識title高亮提示style樣式信息第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版換行標簽<br>第二章 HTML入門基礎(chǔ)居中標簽可以使用<center>標簽讓標簽內(nèi)的內(nèi)容居中顯示。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<center>居中測試</center>居中標簽第二章 HTML入門基礎(chǔ)<center>居中測試</水平分割線<hr/>：HTML提供了修飾段落的水平分割線，在很多場合可以輕松使用，不需要另外作圖。默認情況下<hr>占用一行。可以包含以下屬性align：規(guī)定hr元素的對齊方式noshade：規(guī)定hr元素的顏色呈現(xiàn)為純色size：規(guī)定hr元素的高度(厚度)width：規(guī)定hr元素的寬度第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版以上屬性均不推薦使用，而用樣式取代它.水平分割線第二章 HTML入門基礎(chǔ)以上屬性均不推薦使用，而用給文字加入空格“ ”:在HTML代碼中直接用鍵盤敲擊空格鍵，是無法顯示在頁面上的。HTML使用“ “表現(xiàn)一個空格字符(英文的空格字符)，一個中文字符占兩個英文字符寬度。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<p>   

標簽在HTML頁面中創(chuàng)建一條水平線。<hr>水平分隔線可以在視覺上將文檔分隔成各個部分。給文字加入空格第二章 HTML入門基礎(chǔ)<p> &n注釋標簽<!--...-->：注釋標簽用來在源文檔中插入注釋。注釋會被瀏覽器忽略。您可使用注釋對您的代碼進行解釋，這樣做有助于您在以后的時間對代碼的編輯。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<!--Thistextisacomment--><p>Thisisaregularparagraph</p>注釋標簽第二章 HTML入門基礎(chǔ)<!--Thistext文字屬性文字樣式設(shè)置設(shè)置字體樣式的基本標簽是<font></font>,被其包含的文本為樣式作用區(qū)可以包含以下屬性color：規(guī)定文本的顏色face：規(guī)定文本的字體size：規(guī)定文本的大小第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<fontsize="5"color="red“face="隸書">華師大軟件學(xué)院</font>文字屬性第二章 HTML入門基礎(chǔ)<fontsize="5"文字屬性使文字傾斜用雙標簽<i></i>可使被作用文字傾斜，達到特殊的效果。<em></em>被稱為強調(diào)標簽，也是斜體。使文字加粗用雙標簽<b></b>可使被作用的文字加粗，使文字更加醒目。<strong></strong>被稱為強調(diào)標簽，也使文字加粗。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<i>斜體測試</i><em>斜體測試</em><b>粗體測試</b><strong>粗體測試</strong>文字屬性第二章 HTML入門基礎(chǔ)<i>斜體測試</i><b>文字屬性給文字加下劃線用雙標簽<u></u>可添加下劃線到被作用文字。其他文字修飾方法<sup></sup>:多用于數(shù)學(xué)指數(shù)的表示，比如某個數(shù)的平方或立方。<sub></sub>:多用于注釋，以及數(shù)學(xué)的底數(shù)表示。<strike></strike>：多用于刪除效果。第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版<u>文字下劃線</u>文字屬性第二章 HTML入門基礎(chǔ)文字屬性特殊字符第二章 HTML入門基礎(chǔ)第五節(jié)文字版面的排版特殊字符Html代碼特殊字符Html代碼<<TM(商標符號)™>>?(注冊符號)®“”(英文半角)"×&time;&§?(版權(quán)符號)©空格

文字屬性第二章 HTML入門基礎(chǔ)特殊字符Html代碼特殊字符超鏈接介紹及使用簡介超級鏈接是網(wǎng)站中使用比較頻繁的HTML元素，因為網(wǎng)站的各種頁面都是由超級鏈接串接而成，超鏈接完成了頁面之間的調(diào)整。給文字添加鏈接超鏈接的標簽是<a></a>，給文字添加超鏈接類似于其他修飾標簽。添加了鏈接后的文字有其特殊樣式，以和其他文字區(qū)分，默認鏈接樣式為藍色文字，有下劃線。超鏈接是跳轉(zhuǎn)到另一個頁面的，<a></a>標簽有一個href屬性負責(zé)指定新頁面的地址。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref="test.html">鏈接至另一個頁面</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref="t超鏈接介紹及使用給鏈接添加提示文字很多情況下，超鏈接的文字不足以描述所要鏈接的內(nèi)容，超鏈接標簽提供了title屬性能很方便的給瀏覽者做出提示。title屬性的值即為提示內(nèi)容，當瀏覽者的光標停留在超鏈接上時，提示內(nèi)容才會出現(xiàn)，這樣不會影響頁面排版的整潔。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref=“test.html”title=“本鏈接可以跳轉(zhuǎn)到test.html頁面">鏈接至另一個頁面</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref=“t超鏈接介紹及使用電子郵件、FTP和Telnet的鏈接超鏈接還可以進一步擴展網(wǎng)頁的功能，比較常用的有發(fā)電子郵件、FTP以及Telnet鏈接。具體使用如下：第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接<ahref="mailto:lmao@">發(fā)送伊妹兒</a><ahref="1">連接接ftp服務(wù)器</a><ahref="telnet://54">遠程登錄服務(wù)器</a>超鏈接介紹及使用第二章 HTML入門基礎(chǔ)<ahref="m超鏈接介紹及使用錨點很多網(wǎng)頁文章的內(nèi)容比較多，導(dǎo)致頁面很長，瀏覽者需要不斷地拖動瀏覽器的滾動條才能找到需要的內(nèi)容。超鏈接的錨功能可以解決這個問題。實際上錨就是用于在單個頁面內(nèi)不同位置的跳轉(zhuǎn)。超鏈接標簽的name屬性用于定義錨的名稱，一個頁面可以定義多個錨，通過超鏈接的href屬性可以根據(jù)name跳轉(zhuǎn)到對應(yīng)的錨。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接介紹及使用第二章 HTML入門基礎(chǔ)超鏈接窗口屬性默認情況下，超鏈接打開新頁面的方式是自我覆蓋，即在原網(wǎng)頁上打開新網(wǎng)頁。根據(jù)瀏覽者的不同需要，可以指定超鏈接的其他打開新窗口的方式。超鏈接標簽<a>提供了target屬性進行設(shè)置，取值分別為_self(自我覆蓋，默認)、_blank(創(chuàng)建新窗口打開新頁面)、_top(在瀏覽器的整個窗口打開，將會忽略所有的框架結(jié)構(gòu))、_parent(在上一級窗口打開).第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接窗口屬性第二章 HTML入門基礎(chǔ)超鏈接路徑超鏈接標簽<a>的href屬性值為某個網(wǎng)頁的路徑，路徑共分為：相對路徑、絕對路徑和萬維網(wǎng)路徑。相對路徑其它頁面相對于本頁面的路徑，以本頁面所在的位置為參照。絕對路徑需要跳轉(zhuǎn)至的頁面在硬盤或者文件系統(tǒng)里的絕對路徑。萬維網(wǎng)路徑超鏈接的路徑可以是萬維網(wǎng)上的任何一個路徑，比如、等。第二章 HTML入門基礎(chǔ)第六節(jié)超鏈接超鏈接路徑第二章 HTML入門基礎(chǔ)插入圖片到網(wǎng)頁插入圖片使用單標簽<img>，通過src屬性的值確定所插入圖片的路徑。<img>是單標簽，意思是說，它只包含屬性，并且沒有閉合標簽。設(shè)置圖片的高度和寬度在默認情況下，<img>標簽顯示的圖片高和寬取圖片原始的高和寬。不過在某些情況下需要不同的高和寬，通過<img>標簽的width屬性和height屬性可以設(shè)置圖片在網(wǎng)頁顯示寬度和高度，屬性的默認單位為像素。第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”><imgsrc=“img/img.jpg”widt=“100”,height=“180”>插入圖片到網(wǎng)頁第二章 HTML入門基礎(chǔ)<imgsrc=“i設(shè)置圖片的邊框<img>標簽可以通過border屬性的設(shè)置，是圖片在網(wǎng)頁中顯示邊框，border屬性的值為邊框的粗細，單位默認為像素。給圖片添加提示文字類似于超鏈接的文字提示，<img/>標簽的title屬性同樣可以設(shè)置圖片的文字提示，示例如下。第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”border=“5”><imgsrc=“img/img.jpg”title=“這是一只可愛的小狗”/>設(shè)置圖片的邊框第二章 HTML入門基礎(chǔ)<imgsrc=“i給圖片添加替代文字當<img>標簽的src屬性的路徑找不到相應(yīng)的圖片文件時，<img/>標簽提供了一個alt屬性的值來替代圖片的文字。給圖片添加超鏈接和文字的超鏈接類似，也可以對圖片添加超鏈接。示例如下:第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理<imgsrc=“img/img.jpg”alt=“圖片無法顯示”><ahref=“img.html”><imgsrc=“img/img.jpg”/></a>

給圖片添加替代文字第二章 HTML入門基礎(chǔ)<imgsrc=圖文混合排版<img>標簽的align屬性可以規(guī)定如何根據(jù)周圍的文本來排列圖像。具體如下：top 圖像頂部和同行文本最高部分對齊middle 圖像中部和同行文本的極限對齊bottom 圖像底部和同行文本的底部對齊left 使圖像和左邊界對齊right 使圖像和右邊界對齊absmiddle 圖像中部和同行文本的中部絕對對齊

第二章 HTML入門基礎(chǔ)第七節(jié)圖像處理圖文混合排版第二章 HTML入門基礎(chǔ)滾動字幕<marguee>:通過使用<marguee>標簽，能夠使網(wǎng)頁中的文字滾動，并可以控制其滾動的屬性。其有以下屬性：direction：用于設(shè)置內(nèi)容滾動方向，屬性值有：left、right、up、down。scrollamount：用于設(shè)置內(nèi)容滾動速度。behavior：用于設(shè)置內(nèi)容滾動方式，默認為scroll，即循環(huán)滾動。當其值為alternate時，內(nèi)容將來回循環(huán)滾動。當其值為slide時，內(nèi)容滾動一次即停止，不會循環(huán)。還有一個loop屬性可以設(shè)置其滾動循環(huán)次數(shù)，默認沒有限制。scrolldelay：用于設(shè)置內(nèi)容滾動的時間間隔bgcolor：用于設(shè)置內(nèi)容滾動背景色width：用于設(shè)置內(nèi)容滾動背景寬度height：用于設(shè)置內(nèi)容滾動背景高度。第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果滾動字幕第二章 HTML入門基礎(chǔ)插入多媒體文件標簽使用<embed></embed>標簽使網(wǎng)頁可以實現(xiàn)調(diào)用瀏覽者系統(tǒng)的媒體播放器，播放網(wǎng)絡(luò)上的音樂及視頻資源。其有以下屬性height：設(shè)置嵌入內(nèi)容的高度src：嵌入內(nèi)容的URLautostart：規(guī)定音頻或視頻文件是否在下載完之后就自動播放width：設(shè)置嵌入內(nèi)容的寬度hidden：規(guī)定控制面板是否顯示starttime：規(guī)定音頻或視頻文件開始播放的時間align：規(guī)定控制面板和當前行中的對象的對齊方式第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果插入多媒體文件第二章 HTML入門基礎(chǔ)插入背景音樂使用HTML中的單標簽<bgsound>可以為網(wǎng)頁添加背景音樂.其共有src和loop兩個屬性。其中src屬性指定所連接的音樂資源路徑；loop屬性指定背景音樂的循環(huán)播放次數(shù),如果值為-1，則表示無限循環(huán)。第二章 HTML入門基礎(chǔ)第八節(jié)網(wǎng)頁動畫和多媒體效果<bgsoundsrc=“music/1.midi”loop=“-1”>插入背景音樂第二章 HTML入門基礎(chǔ)<bgsoundsrc第三章 TABLE布局本章內(nèi)容提示：TABLE介紹<TABLE>標簽<TR>標簽<TD>標簽第三章 TABLE布局本章內(nèi)容提示：TABLE介紹表格在網(wǎng)站應(yīng)用中非常廣泛,可以方便靈活的排版,很多動態(tài)大型網(wǎng)站也都是借助表格排版,表格可以把相互關(guān)聯(lián)的信息元素集中定位,使瀏覽頁面的人一目了然.認識TABLE的作用用表格組織數(shù)據(jù)用表格布局網(wǎng)頁第三章 TABLE布局第一節(jié)TABLE介紹TABLE介紹第三章 TABLE

溫馨提示

  • 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)容負責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論