欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

html5中有哪些頁面交互元素

這篇文章主要介紹html5中有哪些頁面交互元素，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

10年積累的成都網(wǎng)站制作、做網(wǎng)站經(jīng)驗，可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認識你，你也不認識我。但先網(wǎng)站策劃后付款的網(wǎng)站建設(shè)流程，更有望江免費網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。

html5頁面交互元素有：1、details，用來表示一段具體內(nèi)容；2、summary；3、datagrid，用來控制客戶端數(shù)據(jù)與顯示；4、menu，用于交互菜單；5、command，用來處理命令按鈕；6、progress；7、meter。

本教程操作環(huán)境：windows7系統(tǒng)、HTML5版、Dell G3電腦。

HTML5交互性元素：功能性的內(nèi)容表達，會有一定的內(nèi)容和數(shù)據(jù)的關(guān)聯(lián)，是各種事件的基礎(chǔ)。

  • details：用來表示一段具體的內(nèi)容，但是內(nèi)容默認可能不顯示，通過某種手段(如單擊)與legend交互才會顯示出來。

  • summary：標簽包含 details 元素的標題，"details" 元素用于描述有關(guān)文檔或文檔片段的詳細信息。

  • datagrid：用來控制客戶端數(shù)據(jù)與顯示，可以由動態(tài)腳本及時更新。

  • menu：主要用于交互菜單(曾被廢棄又被重新啟用的元素)。

  • command：用來處理命令按鈕。

  • progress：用于表示一個任務(wù)的完成進度。這個進度可以是不確定的，只是表示進度正在進行，但是不清楚還有多少工作量沒有完成。也可以用0到某個最大數(shù)字（如100）之間的數(shù)字來表示準確的進度完成情況（如進度百分比） 屬性值有兩個： value：已經(jīng)完成的工作量。 max：總共有多少工作量。 注意的是value和max屬性的值必須大于0，且value的值要小于或等于max屬性的值。

  • meter：標簽定義已知范圍或分數(shù)值內(nèi)的標量測量。也被稱為 gauge（尺度）。

示例：

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5中常用的交互元素</title>
<script type="text/javascript">
	function command_click(){
	document.getElementById("show").innerHTML=
				"點擊了打開command·";
	}
	
    var intVal = 0;
	var intTimer;
	var objpro = document.getElementById('objpro');
	var title = document.getElementById('mytitle');
	function interval_handler(){
		intVal++;
		objpro.value = intVal;
		if(intVal >= objpro.max){
			clearInterval(intTimer);
			title.innerHTML = "下載完成";
		}else{
			title.innerHTML = "正在下載"+intVal+"%";
		}}
	function btn_click(){
		intTimer = setInterval(interval_handler,100);
	}
  </script>
 
------------------------------------------------------------------
<menu>
	<command onclick="command_click();">
		打開	
	</command>
  </menu>
  <div id="show"></div>
 
</head>
 
<body>
<form>
      <input id="myCar" list="cars" >
	    <datalist id="cars">
		  <option value="BMW">
		  <option value="Ford">
		  <option value="Volvo">
	    </datalist>
      </input>
      <hr><hr>
      
      <span>顯示內(nèi)容</span>
      <details id="detail" open="open">
	       我被顯示出來了
      </details>
      <hr><hr>
      
      <details>
	    <summary>HTML 5</summary>
	      歡迎使用 summary 標簽
	  </details>
      <hr><hr>
  
    </form>
    
     <menu>
        <li>
            <img src="Chrome.png">
            <span>Chrome瀏覽器</span>
        </li>
        <li>
            <img src="360.png">
            <span>360瀏覽器</span>
        </li>
        <li>
            <img src="IE.png">
            <span>IE瀏覽器</span>
        </li>
      </menu>
      <hr><hr>
      
      <menu>
	    <command 
		onclick="alert('command click');">
	    Click Me!
	    </command>
      </menu>
      <hr><hr>
 
	  <p id="mytitle">開始下載</p>
  	  <progress value="0" max="100" id="objpro">
      </progress>
      <input type="button" value="下載" onclick="btn_click();">
      <hr><hr>
      
      <p>120人參與投票，明細如下：</p>
      <p>張三:
      <meter value="0.3" optimum="1" high="0.9" low="1" max="1" min="0"></meter>
      <span>30%</span>
      </p>
      <p>李四:
      <meter value="70" optimum="100" high="90" low="10" 	max="100" min="0"></meter>
      <span>70%</span>
      </p>
	  <hr><hr>
      
      
 
      
</body>
</html>

html5中有哪些頁面交互元素

以上是“html5中有哪些頁面交互元素”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

當前文章：html5中有哪些頁面交互元素
瀏覽地址：http://chinadenli.net/article12/gieigc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供ChatGPT、網(wǎng)站設(shè)計公司、、網(wǎng)站導航、品牌網(wǎng)站設(shè)計、關(guān)鍵詞優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站制作