版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
Web應(yīng)用系統(tǒng)安全開發(fā)
使用
H
T
M
L
定義網(wǎng)頁內(nèi)容2.1.1
HTML超文本標(biāo)記語言概述1.
HTML基本概念?HTML(Hyper
Text
Markup
Language)超文本標(biāo)記語言,不是一種編程語言,而是一種標(biāo)記語言(MarkupLanguage),用一套標(biāo)記標(biāo)簽(Markup
Tag)來描述網(wǎng)頁的一種語言。HTML文件以
“.htm”或“.html”為擴(kuò)展名。?網(wǎng)頁文件本身是一種文本文件,通過在文本文件中添加標(biāo)記符,可以告訴瀏覽器如何顯示其中的內(nèi)容,如:文字如何處理,畫面如何安排,圖片如何顯示等。瀏覽器按順序閱讀網(wǎng)頁文件,然后根據(jù)標(biāo)記符解釋和顯示其標(biāo)記的內(nèi)容,對書寫出錯的標(biāo)記將不指出其錯誤,且不停止其解釋執(zhí)行過程,編制者只能通過顯示效果來分析出錯原因和出錯部位。?HTML從1993年誕生以來,不斷地在發(fā)展與完善。從HTML2.0、HTML3.2、HTML4.0、HTML4.01,直到最新的HTML5.0,其功能是越來越強(qiáng)大,表現(xiàn)越來越完美。實例2-12.1.2
用標(biāo)簽規(guī)定元素屬性和位置1.
文檔標(biāo)簽HTML的主要語法是元素和標(biāo)簽:?元素指的是從開始標(biāo)簽(start
tag)到結(jié)束標(biāo)簽(end
tag)的所有代碼,是符合DTD(文檔類型定義)的文檔組成部分,如title(文檔標(biāo)題)、IMG(圖象)、table(表格)等等。元素名不區(qū)分大小寫的。?HTML用標(biāo)簽來規(guī)定元素的屬性和它在文檔中的位置。標(biāo)簽分單獨出現(xiàn)的標(biāo)簽和成對出現(xiàn)的標(biāo)簽兩種。大多數(shù)的標(biāo)簽是成對出現(xiàn)的,有首標(biāo)簽和尾標(biāo)簽組成。首標(biāo)簽的格式為<元素名>,尾標(biāo)簽的格式為</元素名>。成對標(biāo)簽用于規(guī)定元素所含的范圍,如<title>和</title>標(biāo)簽用來界定標(biāo)題元素的范圍,也就是說。<title>與</title>之
間的部分是該HTML文檔的標(biāo)題。單獨標(biāo)簽的格式為<元素名>,它的作用是在相應(yīng)的位置插入元素。如<br>標(biāo)簽表示在該標(biāo)簽所在位置插入一個換行符。1.<html>標(biāo)簽<html>標(biāo)簽是文檔標(biāo)識符,它是成對出現(xiàn)的,首標(biāo)簽<html>和尾標(biāo)簽</html>分別位于文檔的最前面和最后面,明確地表示文檔是以超文本標(biāo)識語言編寫的。2.<head>標(biāo)簽把HTML文檔分為文檔頭<head>和文檔主體<body>兩個部分。文檔的主體部分就是在瀏覽器用戶區(qū)中看到的內(nèi)容了。
而文檔頭部分用來規(guī)定該文檔的標(biāo)題(出現(xiàn)在瀏覽器窗口的標(biāo)題欄中)和文檔的一些屬性。HTML文檔的標(biāo)簽是可以嵌套的,即在一對標(biāo)簽中可以嵌套另一對子標(biāo)簽。用來規(guī)定母標(biāo)簽所含范圍的屬性和其中某一部分內(nèi)容,嵌套在<head>標(biāo)簽中使用的子標(biāo)簽主要有<title>、<meta>、<link>和
<style>。3.<body>標(biāo)簽<body>標(biāo)簽是成對標(biāo)簽。在<body></body>之間的內(nèi)容將顯示在瀏覽器窗口的
用戶區(qū)內(nèi),它是HTML文檔的主體部分。4.文檔類型<!DOCTYPE>標(biāo)簽<!DOCTYPE>聲明必須位于HTML5文檔中的第一行,也就是位于<html>標(biāo)簽之前。該標(biāo)簽告知瀏覽器文檔所使用的HTML規(guī)范。<!DOCTYPE>聲明不屬
于HTML標(biāo)簽,它是一條指令,告訴瀏覽器編寫頁面所用的標(biāo)記的版本。5.注釋標(biāo)簽<!--...-->注釋標(biāo)簽<!--...-->用于在源代碼中插入注釋。注釋不會顯示在瀏覽器中。2.
布局標(biāo)簽?HTML頁面主要用以下標(biāo)簽來進(jìn)行布局3.
格式標(biāo)簽?HTML頁面常用的文章標(biāo)簽?HTML頁面常用的短語元素標(biāo)簽?HTML頁面常用的字體樣式標(biāo)簽4.
列表標(biāo)簽1.列表標(biāo)簽(1)<ul>定義無序列表??墒褂肅SS來定義列表的類型。(2)<ol>定義有序列表。有序列表可以是數(shù)字或字母順序??墒褂?lt;li>標(biāo)簽來定義列表項,使用CSS來設(shè)置列表的樣式。其屬性“start”,規(guī)定有序列表的起始值;
屬性“reversed”,規(guī)定列表順序為降序;屬性“type”,其值為“1”、“A”、
“a”、“I”或“i”,規(guī)定在列表中使用的標(biāo)記類型。(3)<li>定義列表項,有序列表和無序列表中都使用<li>
標(biāo)簽。實例2-2<img>定義圖像,注意加上“alt”屬性。比如:<imgsrc="smile.gif"alt="微笑"/>5.
圖像標(biāo)簽6.
超鏈接標(biāo)簽<a>定義超鏈接,用于從一個頁面鏈接到另一個頁面,它最重要的屬性是“href”屬性,它指定鏈接的目標(biāo)。<ahref=“http://www.sziit.edu.cn/”onclick="_addDynClicks("wbimage",1877551418,64121)"target="_blank">學(xué)校主頁</a>屬性“target”,其值為“_blank”、“_parent”、“_self”或“_top”,表示在何處打開目標(biāo)URL,它僅在“href”屬性存在時使用。7.
表格標(biāo)簽在HTML頁面中,大多數(shù)頁面都是使用表格進(jìn)行排版的。使用表格可以把文字和圖片等內(nèi)容按照行和列排列起來,使得整個網(wǎng)頁更加清晰和條理化,有利于信息的表達(dá)。實例2-32.1.3
用表單收集用戶輸入信息1.表單介紹?HTML表單用于搜集不同類型的用戶輸入信息。?輸入信息有:文本域、下拉列表、單選框、復(fù)選框等元素。?一個表單至少包括:說明性文字、表單控件、提交和重置按鈕等內(nèi)容,如圖所示。2.創(chuàng)建HTML表單?<form>標(biāo)簽用于創(chuàng)建供用戶輸入的HTML
表單<form
name="frmLogin"
action="returnLoginInformation.php"
method="post"
onsubmit="return
check()">
action:要提交的地點;
method
:表單發(fā)送方式:
post:1)請求數(shù)據(jù)在瀏覽器不可見,比較安全;2)提交的數(shù)據(jù)沒有長度限制;3)不可收藏為書簽。
get:1)請求數(shù)據(jù)在瀏覽器可見,不安全;2)最多255個字符長度。3)可將字符串添加到URL中,可收藏為書簽。?<form>標(biāo)簽用于創(chuàng)建供用戶輸入的HTML表單,<form>標(biāo)簽的屬性見表2-7所示。3.表單元素表單<form>標(biāo)簽需要跟各種元素搭配來共同完成用戶輸入信息的收集,以下是表單的各種常見元素。1
.
<input>元素最重要的表單元素是<input>元素。如下HTML代碼定義了供文本輸入的單行輸入字段。
<form>Firstname:<input
type="text"name="firstname"><br>Last
name:<input
type="text"name="lastname"></form>以上HTML代碼在瀏覽器中看上去是這樣的:<input>是表單中最常用的標(biāo)簽之一,該標(biāo)簽中有Type和Name兩個屬性,分別代表了輸入域的類型和名稱。<input>元素根據(jù)不同的type屬性,可以變化為多種形態(tài)。在Type屬性中,包含的屬性值見表2-8。2
.
<select>
元素(下拉列表)下拉列表是一種節(jié)省網(wǎng)頁空間的方式,下拉列表標(biāo)簽的基本語法是:<selectname="cars"><optionvalue="volvo">Volvo</option><optionvalue="saab">Saab</option><optionvalue="fiat">Fiat</option><optionvalue="audi">Audi</option></select>以上HTML代碼在瀏覽器中看上去是這樣的:下拉列表標(biāo)簽的屬性見表2-9所示。3
.
<option>
元素<option>元素定義待選擇的選項。列表通常會把首個選項顯示為被選選項。您可以通過selected屬性預(yù)選擇某些選項。基本語法如下:<optionvalue="fiat"selected>Fiat</option>以上HTML代碼在瀏覽器中看上去是這樣的:4
.
<textarea>
元素<textarea>元素定義多行輸入字段(文本域)。用戶可在此文本區(qū)域中寫文本,在一個文本區(qū)中,可輸入無限數(shù)量的文本?;菊Z法如下:<textareaname="message"rows="10"cols="30">The
cat
was
playing
in
thegarden.</textarea>以上HTML代碼在瀏覽器中顯示為:
溫馨提示
- 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)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2026年及未來5年市場數(shù)據(jù)中國漢堡包行業(yè)市場需求預(yù)測及投資規(guī)劃建議報告
- 2025年大學(xué)國際商務(wù)(國際商務(wù)談判)試題及答案
- 2026年藥品管理(藥品驗收流程)試題及答案
- 2025年中職(物流配送專業(yè))快遞配送試題及答案
- 2025年大學(xué)大二(植物生理學(xué))植物生長發(fā)育調(diào)控技術(shù)綜合測試題及答案
- 2025年大學(xué)教育學(xué)(教育管理學(xué)基礎(chǔ))試題及答案
- 2025年高職(商務(wù)談判與溝通)溝通技巧階段測試題及答案
- 2025年大學(xué)通識選修(傳媒文化)試題及答案
- 2026年電梯維保(電梯故障排除)試題及答案
- 2025年中職傳感器技術(shù)(技術(shù)應(yīng)用)試題及答案
- 國家安全生產(chǎn)十五五規(guī)劃
- 河南省2025年普通高等學(xué)校對口招收中等職業(yè)學(xué)校畢業(yè)生考試語文試題 答案
- 實驗室生物安全培訓(xùn)-課件
- 第章交流穩(wěn)態(tài)電路
- 馬口鐵印鐵制罐工藝流程詳解課件
- 預(yù)應(yīng)力管樁-試樁施工方案
- GB/T 16938-2008緊固件螺栓、螺釘、螺柱和螺母通用技術(shù)條件
- FZ/T 82006-2018機(jī)織配飾品
- 《食品包裝學(xué)(第三版)》教學(xué)PPT課件整套電子講義
- 全尺寸測量報告FAI
- 新教材教科版五年級上冊科學(xué)全冊課時練(課后作業(yè)設(shè)計)
評論
0/150
提交評論