HTML5期末考試題型

1、作業(yè)一.單項選項題1.以下哪個標記用來建立一個有序列表：CA.B.C.D.2.在 HTML5 中,哪個元素用于組合標題元素？DA.B.C.D.3.HTML5 中不再支持下面哪個元素？DPPT 查看其他不再支持元素A.JB.C.D.|4.新的 HTML5 全局屬性,contenteditable用于：BA.規(guī)定元素的上下文菜單.該菜單會在用戶點擊右鍵點擊元素時出現(xiàn).B.規(guī)定元素內容是否是可編輯的.C.從效勞器升級內容.D.返回內容在字符串中首次出現(xiàn)的位置.5.HTML 新增一種非常重要的功能是可以在客戶端本地存數(shù)據(jù)的 WebStorage 功能.其中A持久化本地存儲,類似于 Cookie,但沒有

2、有效期,除非主動刪除數(shù)據(jù)：A.localStorageB.SessionStorage數(shù)據(jù)只有在同一個會話中的頁面才能訪問并且當會話結束后數(shù)據(jù)也隨之銷毀,非持久化C.WebSQLD.創(chuàng)立可拖動的元素6 .在 HTML5 中,哪個屬性用于規(guī)定輸入字段是必填的？AA.requiredB.formvalidateC.validateD.placeholder7 .哪種輸入類型定義滑塊控件？DA.searchB.controlsC.sliderD.range8 .cxt.arc100,100,100,0,Math.PI*2,trueCanvas 繪制圓形的 arc 方法中,參數(shù)說明正確的選項是：DA.

3、圓半徑,圓心 X 坐標,圓心 Y 坐標,開始角度,結束角度,是否順時針 trun 逆時針B.圓心 Y 坐標,圓心 X 坐標,圓半徑,開始角度,結束角度,是否順時針C.圓心 X 坐標,圓心 Y 坐標,圓半徑,開始角度,結束角度,是否順時針D.圓心 X 坐標,圓心 Y 坐標,圓半徑,開始角度,結束角度,是否逆時針9 .讀取 localStorage 數(shù)據(jù)的方法是：BA. localStorage.getItem鍵值；B. localStorage.getItem鍵名;C. localStorage.loadItem鍵值；D.localStorage.loadItem鍵名;10 .在一個img標記中

4、決定圖片文件位置的是哪個屬性：CA:altB:titleC:srcD:href11 .Canvas 用于填充顏色的屬性是：AA. fillStyle 填充色B. fillRectC. lineWidth 線條寬度D. strokeRect12 .不是 HTML5 寺有的存儲類型是：BA、localStorageBCookieCApplicationCache 應用緩存DsessionStorage二、填空題1.在input標簽中將 type 屬性設置為 radio 即可定義單項選擇按鈕.查看關于INPUT 標記的屬性2.為了使元素可拖動,把 draggable 屬性設置為 true.3.在拖放

5、過程,開始拖動元素會觸發(fā) dragstar 事件,松開鼠標時會觸發(fā) drop事件.元素拖動4.在 CSS3 中,可以使用 border-raidus 屬性實現(xiàn)圓角效果.盒子陰影透明度等新增的5.如下列圖為一個 border 為 1px 的 div 塊,總寬度為 300Px包括 border,陰影區(qū)為padding-left:50Px 左側內邊距；,那么此 div 的 width 應設置為 248px.moopx#moopx#、w w6 650pW50pW6.在 CSS3 中可以使用 transitaion 屬性和其他 CSS 屬性顏色、寬高、變形、位置等配合實現(xiàn)動畫效果.三、簡做題寫出標準的

6、html5 頁面結構.無標題文檔網(wǎng)頁內容分別寫出 HTML5W 增的語義標簽及作用答：元素名作用section表示貝囿中的一個內容區(qū)塊,比方章節(jié)、頁眉、貞腳或貝囿中的其他局部.它口以與 h1、h2、素結合起來使用標記文檔結構.article表小貝面中的一塊與上卜文不相關的獨立內容,例如廛客中的一描文草.aside表示 article 兀素內谷之外的,與 article 兀素內谷相關的輔助信息.header表示貝囿中一個內容區(qū)塊或整個貝囿的標題.hgroup附于整個貝回或貝囿中一個內容區(qū)塊的標題進行組合.footer表示整個頁面或頁面中一個內容區(qū)塊的腳注.一般來說,它會包含創(chuàng)作者的姓名,創(chuàng)立日期

7、及nav表小貝囿中導航鏈接的局部figure表示一段獨立的流內容,示文檔主體流內容中的一個獨立單元,使用 figcaption 元素題.標記定義音頻內容標記定義圖片標記定義一個命令按鈕標記定義一個下拉列表標記定義一個元素的詳細內容1.2.標記定義一個對話框會話框標記定義外部的可交互的內容或插件標記定義表單里一個生成的鍵值標記定義有標記的文本標 t 己定義 measurementwithinapredefinedrange標記定義一些輸出類型標記定義任務的過程標記是用在 Rubyannotations 告訴那些不支持 Ruby 元素的瀏覽器如何去顯示標記定義對 rubyannotations 的

8、解釋標記定義 rubyannotations.標記定義一個區(qū)域標記定義媒體資源標記定義一個日期/時間標記定義一個視頻3 .簡述標記中 method 和 action 屬性的作用.答：method 屬性作用是將表單數(shù)據(jù)從客戶端傳送到效勞器的方法,分別為 post 和 get 方法,post 方法比擬平安和常用；action 屬性作用是指定處理表單的效勞端程序,可以是程序或腳本的一個完整 URL4 .HTML 井新增了類型的新表單元素？作用分別是什么？答：類型：作用text：設置單行文本框元素email：表示當前 input 標簽接受一個郵箱的輸入tel:接受輸入url:只接受輸入網(wǎng)址nunber

9、：表示當前標簽只接受數(shù)字類型輸入rang:設置滑塊控件元素clolr:顏色選擇date:日期選擇器類型password:設置密碼元素file:設置文件元素hidden:設置隱藏元素,不會被瀏覽者看到,用于在不同頁面中傳遞域中所設定的值radio:設置單項選擇框元素checkbox:設置復選框元素button:設置普通按鈕元素submit:設置提交按鈕元素reset:設置重置按鈕元素Image：設置圖像域圖像按鈕元素5 .寫出 HTML 減單中新增的屬性及其作用.答：【屬性：作用】min 和 max:HTML 麻增加的屬性,表示當前輸入框輸入的最小和最大值step:HTML5 新增加的屬性,是步

10、長的意思,也就是在點擊增大或者減小的時候的增加或減少的步長placeholder,提示信息autocomplete:form 或 input 域是否擁有自動完成功能值為 on 和 off.適用于以下類型的標簽：text,search,url,telephone,email,password,datepickers,range 以及 color.autofocus:頁面加載時,域自動地獲得焦點.適用所有標簽的類型.maxmin、step:適用以下類型的標簽：datepickers、number 以及 range.placeholder:提示信息屬性.multiple:輸入域中可選擇多個值,用于文

11、件上傳控件,設置此屬性后,允許上傳多個文件.適用于以下類型的標簽：email 和 file.required:當前文本框在提交前必須有數(shù)據(jù)輸入.適用于以下類型的標簽：text,search,url,telephone,email,password,datepickers,number,checkbox,radio 以及 file.pattern:規(guī)定用于驗證輸入字段的模式.pattern 屬性適用于以下類型的標簽：text,search,url,telephone,email 以及 password.6 .Canvas 中畫圓形、畫矩形邊框、畫位圖分別用什么方法答：arc、stokeRect、

12、drawlmage.7 .什么是拖放？答：拖放可以分為兩個動作,即拖拽drag和放開drop.拖拽drag:移動鼠標到指定對象,按下左鍵,然后拖動.放開drop:放開鼠標左鍵,放下對象.8 .行內樣式表、內部樣式表和外部樣式表分別在 HTMLX 面的什么位置引用？如何引用?答：在 HTM 戊檔中應用 CSS 有三種樣式表,分別是：行內樣式表、內部樣式表和外部樣式表.其中最常用的是內部樣式表和外部樣式表.1內部樣式表：在網(wǎng)頁中可以使用 style 元素定義一個內部樣式表,指定該網(wǎng)頁內元素的CSS 樣式,內部樣式一般添加到頭部.在 style 元素中通常可以使用 type 屬性定義內容的類型一般取

13、值text/css.格式如下：2外部樣式表：1含義：在 HTM 戊檔中可以使用元素引用外部樣式表.元素的屬性有:href指定被鏈接文檔【樣式表文件】的位置、hreflang指定在被鏈接文檔中的文本的語言、rel指定當前文檔與被鏈接文檔之間的關系.stylesheet,指向要導入的樣式表的 URL、media指定被鏈接文檔將被顯示在什么設備上.all,默認值,適用于所有設備；、type指定被鏈接文檔的 MIME 類型外部樣式表種類：一種是 layout.css 文件專門是布局用的樣式,另一種是添加外部內容的樣式一般命名為 style.css2添加外部樣式表有多種方法：本實驗介紹用到的其中一種方法

14、,第一步：選擇菜單欄中的文件功能-選擇新建 CSS-命名 layout.css;第二步：選擇菜單欄中的格式功能-css 樣式-添加附加 css 樣式表-在彈出的鏈接外部樣式表窗口中添加外部樣式文件 URLM徑：layout.css-點擊確定.在本次實驗的注冊頁面就是采用外部樣式表進行 CSS 樣式設計,格式如下：添加外部內容的樣式一般命名為 style.css,操作方法同上,格式如下：3行內樣式表：在 HTME 素中使用 style 屬性可以指定該元素的 CSS 樣式,這種應用稱為行內樣式表.直接在 body 標簽中添加,如：網(wǎng)頁的背景為藍色9 .CSS 中的 padding、margin 和

15、 float 各表示什么屬性中英文背答：分別表示：內填充、外邊距、浮動.10 .簡單描述一下什么是 css 盒子模型答：CSS 合 HTML素都賦予了內容(content)、內填充(padding)、邊框(border)和外邊距(margin)屬性,這些屬性形成 CSS 盒模型.整個盒模型在頁面中所占的寬度是由左邊界+左邊框+左填充+內容+右填充+右邊框+右邊界組成.11 .簡述 CSS 珀哪些新特性？-HSL 顏色表現(xiàn)方法.1)八大屬性：圓角效果(border-radius)多彩邊框陰影(box-shadow)背景圖片尺寸(background-size)多歹 U(column-count)

16、嵌入字體(font-face)透明度(opacity)HSL 和 HSLAa 色表現(xiàn)方法2)四大類(關系選擇器、偽類選擇器、屬性選擇器、偽元素選擇器)關系選擇器選擇符名稱版本簡介EF包含選擇符CSS1選擇所有被 E 元素包含的 F 元素.就可以把這幾個相同設定的選擇器合并在一起,中間用逗號隔E,F分組選擇器CSS1開EF子選擇符CSS2選擇所有作為 E 元素的子元素 F.E+F相鄰選擇符CSS2選擇緊貼在 E 元素之后 F 元素.EF兄弟選擇符CSS3選擇 E 元素所有兄弟元素 F.偽類選擇器a.結構性偽類選擇器符版本簡介E E：rootrootCSSSIffiETLIffiETL素在戲的根兀

17、素.E:first-childCSS2CSS2四配父元素的第*元素E.E.E:last-childE:last-childCSSSCSSSE615E615沅釉m m子蒜E.E.E E：on1-childon1-childcsss喳痂t t怖的 Y 子謹E E.E E：DthhLld(a)DthnCSS3簡介設置對象內的第 T 字符的樣式.設置對象內的擔一右的樣式設置在刈空前依據(jù)對象樹的邏情結構發(fā)生的內容.用來JUJU屬性一起使用設置在對象后依據(jù)對象樹的邏輯結構發(fā)生的內容.用來和3 3屬性一使用設置對象疫選時的顏色taansition、animation)transform 字面上就是變形,改變

18、的意思.在包括以下幾種：旋轉 rotate、扭曲 skew、縮放 scale 和移動 translate 以及矩陣變形 matrix.Animation 只應用在頁面上已存在的 DO 雨素上,我們使用 CSS3的 Animation 制作動畫我們可以省去復雜的 js,jquery 代碼.12.CSS3.0 選擇器都有哪些類型,并且分別說明其作用及舉例語法格式在 HTML 標簽中使用的方法.1元素選擇器選擇符類型版本簡介*通配符選擇器 CSS2 所有元素對象.E 標簽HTML選擇器 CSS1 以 HTML 標簽作為選擇符.E#myidid 選擇器 CSS1 以唯一標識符 id 屬性等于 myid

19、 的 E 對象作為選擇符.E.myclassclass 選擇器 CSS1 以 class 屬性包含 myclass 的 E 對象作為選擇符.2關系選擇器選擇符類型版本簡介E,F 分組選擇器 CSS1 就可以把這幾個相同設定的選擇器合并在一起,3偽類選擇器偽類用于向某些選擇器添加特殊的效果.偽類對元素進行分類是基于特征而不是它們的名字、屬性或者內容.選擇符類型簡介a:link 鏈接偽類選擇器設置超鏈接 a 在未被訪問前的樣式a:visited 鏈接偽類選擇器設置超鏈接 a 在其鏈接地址已被訪問過時的樣式E:hover 用戶操作偽類選擇器設置元素在其鼠標懸停時的樣式E:active 用戶操作偽類選

20、擇器設置元素在被用戶激活在鼠標點擊與釋放之間發(fā)生的CSS3 中 transform 主要中間用逗號隔開EF 包含后代選擇器CSS1 選擇所有被 E 元素包含的 F 元素EF 子選擇器CSS2 選擇所有作為 E 元素的子元素 FE+F相鄰選擇器CSS2選擇緊貼在 E 元素之后 F 元素兄弟選擇符CSS3選擇 E 元素所有兄弟元素 F事件)時的樣式E:focus 用戶操作偽類選擇器設置元素在成為輸入焦點(該元素的 onfocus 事件發(fā)生)時的樣式E:lang():lang()偽類選擇器匹配使用特殊語言的 E 元素 a.結構性偽類選擇器選擇符版本簡介E:first-childCSS2 匹配父元素的

21、第一個子元素 E.CSS3 匹配同類型中的唯一的一個同級兄弟元素 E.E:nth-of-type(n)CSS3 匹配同類型中的第 n 個同級兄弟元素 E.E:nth-last-of-type(n)CSS3 匹配同類型中的倒數(shù)第 n 個同級兄弟元素 E.E:emptyCSS3 匹配沒有任何子元素(包括 text 節(jié)點)的元素 E.b.UI 元素狀態(tài)偽類選擇器選擇符版本簡介E:checkedCSS3匹配用戶界面上處于選中狀態(tài)的元素與checkbox時)E:enabledCSS3 匹配用戶界面上處于可用狀態(tài)的元素 E.E:disabledCSS3 匹配用戶界面上處于禁用狀態(tài)的元素 E.3)屬性選擇器

22、選擇符版本簡介E:rootCSS3匹配 E 元素在文檔的根元素.E:last-childCSS3 匹配父元素的最后一個子元素 E.E:only-childCSS3E:nth-child(n)CSS3匹配父元素僅有的一個子元素 E匹配父元素的第 n 個子元素 E.E:nth-last-child(n)CSS3匹配父元素的倒數(shù)第 n 個子元素 EE:first-of-typeCSS3匹配同類型中的第一個同級兄弟元素 E.E:last-of-typeCSS3 匹配同類型中的最后一個同級兄弟元素 EE:only-of-typeE.(用于 inputtype 為 radioE:read-onlyCSS3

23、匹配用戶界面上處于只讀狀態(tài)的元素 EE:read-writeCSS3 匹配用戶界面上處于讀寫狀態(tài)的元素 EE:checkedCSS3 匹配用戶界面上處于選中狀態(tài)的元素 E.用于 inputtype 為 radio 與 checkbox 時E:enabledCSS3 匹配用戶界面上處于可用狀態(tài)的元素 E.E:disabledCSS3 匹配用戶界面上處于禁用狀態(tài)的元素 E.E:read-onlyCSS3 匹配用戶界面上處于只讀狀態(tài)的元素 EE:read-writeCSS3 匹配用戶界面上處于讀寫狀態(tài)的元素 E4偽元素選擇器選擇符版本簡介E:checkedCSS3 匹配用戶界面上處于選中狀態(tài)的元素

24、E.用于 inputtype 為 radio與 checkbox 時E:enabledCSS3 匹配用戶界面上處于可用狀態(tài)的元素 E.E:disabledCSS3 匹配用戶界面上處于禁用狀態(tài)的元素 E.E:read-onlyCSS3 匹配用戶界面上處于只讀狀態(tài)的元素 EE:read-writeCSS3 匹配用戶界面上處于讀寫狀態(tài)的元素 E13.HTML5I 什么標記播放音頻？主要支持的音頻格式有哪些？答：標記：;格式：mov、mp4、wav.14.HTML5I 什么標記播放視頻？主要支持的視頻格式有哪些？答：標記：;格式 ogg、MPEG4WebM注意：Hv 不支持.15.簡述什么是 HTML

25、5 勺 WebStorage 功能？包括哪些技術？它們的區(qū)別是什么？答：HTML 新增一種非常重要的功能是可以在客戶端本地存數(shù)據(jù)的 WebStorage 功能.其中 localStorage 持久化本地存儲,類似于 Cookie,但沒有有效期,除非主動刪除數(shù)據(jù).另一種sessionStorage用于本地存儲一個會話中的數(shù)據(jù),這些數(shù)據(jù)只在同一個會話中的頁面才能訪問并且當會話結束后數(shù)據(jù)也隨之銷毀,類似于 session.四.編程題1.編寫一個 form 表單,實現(xiàn)一個學生信息輸入.包含學號、姓名、性別、愛好、出生年月等.注意首行縮進答:autocomplete學號：名字：密碼：性另1J：男女：郵箱：生日：興趣愛好：inputtype=checkboxname=interser 口 value=inputtype=checkboxname=interservalue