Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 欧美成人免费在线视频,亚洲视频中文字幕在线观看,欧美精品自拍 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務(wù)商
          
				
          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
          
			
          
			
          				
				
          免費(fèi)咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          「前端」HTML之結(jié)構(gòu)
          
        
           
          
	
	
          
		
                        
          天繼續(xù)為大家分享前端的知識，如果對前端比較感興趣的小伙伴，可以關(guān)注我，我會更大家繼續(xù)分享更多與前端相關(guān)的內(nèi)容，當(dāng)然如果內(nèi)容中又不當(dāng)?shù)幕蛘呶淖皱e誤的，歡迎大家在評論區(qū)留言，我會及時修改糾正。
          1.初識HTML
          • HTML指的是超文本標(biāo)記語言（Hyper Text Markup Language），是用來描述網(wǎng)頁的一種語言。
          • HTML不是一種編程語言，而是一種標(biāo)記語言（markup language），標(biāo)記語言是一套標(biāo)記標(biāo)簽（markup tag）。
          • HTML標(biāo)簽描述網(wǎng)頁元素，比如圖片標(biāo)簽、文字標(biāo)簽、鏈接標(biāo)簽等。
          • HTML標(biāo)簽有自己的語法規(guī)范，并且所有的HTML標(biāo)簽都是用尖括號（<>）包起來。
          2.HTML骨架結(jié)構(gòu)
          HTML基本骨架語法如下所示：
          HTML基本骨架結(jié)構(gòu)
          HTML骨架標(biāo)簽說明：
          HTML骨架標(biāo)簽說明
          下面通過對HTML骨架的基本認(rèn)識，你也可以小試牛刀，打開記事本，新建一個帶有HTML骨架標(biāo)簽的.txt文件。
          在.txt中寫入HTML骨架標(biāo)簽，保存，并將.txt的后綴名修改為.html，右鍵單擊你寫好的文件，然后選擇你要顯示的瀏覽器，本人習(xí)慣用谷歌的瀏覽器，這個根據(jù)個人的習(xí)慣來選擇就好了。
          示例代碼如下：
          我的第一個HTML頁面
          注意：HTML標(biāo)簽名、標(biāo)簽的屬性名以及大部分屬性值都統(tǒng)一用小寫，不要問我為什么，這是人家W3C的規(guī)范，咱們按規(guī)范行事就好啦。
          正確示范：
          書寫規(guī)范
          錯誤示范：
          錯誤的規(guī)范
          3.HTML標(biāo)簽的分類
          HTML標(biāo)簽：在HTML頁面中，帶有“<>”尖括號符號的元素被稱為HTML標(biāo)簽元素，如上面的<html>、<head>、<body>，它們都是用尖括號包起來，而且這幾個標(biāo)簽還是HTML的骨架結(jié)構(gòu)標(biāo)簽，就好比人之所以能站立，就是因為有骨架支撐。
          通常我們將其分為常規(guī)元素和空元素，以下是對兩種類型的介紹。
          常規(guī)元素（雙標(biāo)簽）
          語法：<標(biāo)簽名>內(nèi)容</標(biāo)簽名>，如<body>我的網(wǎng)頁內(nèi)容</body>。
          說明：
          • 該語法中"<標(biāo)簽名>"表示該標(biāo)簽的作用開始，一般稱為"開始標(biāo)簽（start tag）"，"</標(biāo)簽名>"表示該標(biāo)簽的作用結(jié)束，一般稱為"結(jié)束標(biāo)簽（end tag）"。
          • 和開始標(biāo)簽相比，結(jié)束標(biāo)簽只是在前面加了一個封閉符"/"。
          • 提示：HTML多數(shù)都是雙標(biāo)簽。
          空元素（單標(biāo)簽或自封閉標(biāo)簽）
          語法：<標(biāo)簽名 /> ，比如 <br />
          說明：
          • 空元素用單標(biāo)簽來表示。簡單說，就是里邊不需要包含內(nèi)容，屬于自封閉標(biāo)簽。
          • 提示：此類標(biāo)簽較少，只需要用到的時候記住就行，在開發(fā)過程中自己不斷的積累。
          4.HTML標(biāo)簽的關(guān)系
          標(biāo)簽之間的關(guān)系主要是針對雙標(biāo)簽，雙標(biāo)簽之間的關(guān)系分為如下幾種。
          嵌套關(guān)系：
          嵌套關(guān)系
          并列關(guān)系：
          并列關(guān)系
          提示：在開發(fā)的過程中，如果標(biāo)簽之間是嵌套關(guān)系，那么子元素可以通過tab鍵進(jìn)行縮進(jìn)，讓其結(jié)構(gòu)和格式更加的清晰。
          5.前端開發(fā)工具
          之前我們是通過記事本來寫html骨架結(jié)構(gòu)，會發(fā)現(xiàn)這種情況針對幾行代碼，還是能消化的，但是碰上幾千甚至幾萬以及更多，此時應(yīng)該怎么辦呢？這個時候就得用到我們的前端開發(fā)工具，通過前端開發(fā)工具，可以更快更高效的提高我們的開發(fā)效率，那我們常見的前端開發(fā)工具有如下幾種：
          常見的前端開發(fā)工具
          說明：
          • Dreamweaver：學(xué)校用得多。
          • Sublime：推薦使用，輕量級，效率高，打開速度快，優(yōu)點(diǎn)多，但是使用插件的時候，需要下載哦。
          • WebStorm：這個我沒用過，但是有的人很喜歡，屬于付費(fèi)的。
          • Hbuilder：推薦使用，輕量級，免費(fèi)，效率高，打開速度快，現(xiàn)在都是使用HbuilderX版本，這個是可以去官網(wǎng)下載到的，重點(diǎn)它免費(fèi)、免費(fèi)、免費(fèi)，重要的事情說三遍！！！。
          • VS Code：這個是微軟的，也屬于開源免費(fèi)的，功能很強(qiáng)大的，尤其是在JavaScript開發(fā)方面，也是本人推薦使用的。
          提示：Hbuilder和VS Code誰更好？我只能說各有千秋，根據(jù)個人的習(xí)慣，我個人就比較喜歡Hbuilder，偶爾會用VS Code，如果你習(xí)慣用VS Code，繼續(xù)用就行了。
          以上開發(fā)工具的安裝使用，在網(wǎng)絡(luò)上都會有很多資料，可以動動小手指就能查到哦。
          今天就分享到這兒吧，如果喜歡的記得點(diǎn)關(guān)注哦，也歡迎在留言區(qū)留言。
          前端項目開發(fā)的時候，系統(tǒng)支持文件下載是前端開發(fā)中常用到的功能之一，當(dāng)用戶訪問我們的網(wǎng)站時發(fā)現(xiàn)有自己需要的資源時可以將資源下載下來。文件下載主要有兩種形式，一種是通過文件地址下載，該文件可以存放在前端或者后端。另一種則是通過文件流下載，前端通過發(fā)送請求給后端并獲取后端文件流進(jìn)行下載。
          a標(biāo)簽下載
          download屬性：是HTML5中的a標(biāo)簽的新特性，用來規(guī)定被下載的超鏈接目標(biāo)。在a標(biāo)簽中如果沒有申明download屬性的時a標(biāo)簽的默會鏈接跳轉(zhuǎn)進(jìn)行預(yù)覽（如txt , jpg , pdf ），當(dāng)前瀏覽器不支持預(yù)覽的文件時則出現(xiàn)下載。當(dāng)申明了download屬性之后瀏覽器會對href屬性鏈接的文件進(jìn)行下載。download屬性與不支持H5的低版本瀏覽器不兼容且僅限于同源文件，如果是非同源download屬性會失效。比如引用第三方的網(wǎng)站內(nèi)容、引用前后端分離的服務(wù)器內(nèi)容、甚至本地測試引用的本地文件，download都會不起作用。如果你想測試該功能可以在本地開一個服務(wù)，將文件放同一服務(wù)中測試就可以了。
          直接使用a標(biāo)簽時只要在a標(biāo)簽中添加download屬性，如果是非a標(biāo)簽的話可以在出發(fā)事件的時候通過JavaScript來創(chuàng)建一個隱藏a標(biāo)簽下載，當(dāng)我們點(diǎn)擊時觸發(fā)隱藏的a標(biāo)簽下載事件。這里使用appendChild和removeChild的處理是為了兼容Firefox瀏覽器。
          XMLHttpRequest下載
          需要了解XMLHttpRequest可以參考文章：JavaScript實戰(zhàn)001：XMLHttpRequest使用入門，這里我利用XMLHttpRequest對象來發(fā)送請求，用blob類型來接受后臺發(fā)過來的二進(jìn)制類型文件。然后模擬a標(biāo)簽創(chuàng)建隱藏的下載鏈接，通過URL.createObjectURL()方法創(chuàng)建一個指向blob對象的URL地址。
          iframe下載
          iframe是HTML標(biāo)簽元素，可以用來創(chuàng)建內(nèi)聯(lián)框架。iframe提供了src屬性用來規(guī)定在 iframe 中顯示的文檔的 URL，我們可以直接將文件地址拋給iframe，也可以賦值文件流地址給iframe。功能實現(xiàn)跟a標(biāo)簽有點(diǎn)相似，創(chuàng)建一個隱藏的iframe標(biāo)簽來實現(xiàn)文件的下載功能。使用文件地址下載需要注意的是瀏覽器支持預(yù)覽的文件類型無法下載（比如圖片、PDF文檔、text文本等會直接打開文件預(yù)覽），文件流下載只需將請求接口賦給src屬性，iframe會自動去請求該文件實現(xiàn)下載。
          window.open下載
          window.open()方法用于打開一個新的瀏覽器窗口或查找一個已命名的窗口，也可以用它來實現(xiàn)文件下載功能。而且這個比iframe更簡單，直接將文件地址或者請求接口賦給window.open(url)方法即可實現(xiàn)文件下載功能。但是有個缺點(diǎn)就是每次下載都會打開一個新的窗口來實現(xiàn)下載（想不跳轉(zhuǎn)可以嘗試window.location.assign()方法，用于加載一個新的文檔），而且如果使用文件地址下載的是瀏覽器支持預(yù)覽的文件類型無法下載（比如圖片、PDF文檔、text文本等會直接打開文件預(yù)覽）。
          form表單提交下載
          form表單是個比較常用的html表簽，用戶提交用戶信息，比如常見的登錄、注冊界面大部分都是通過form表單進(jìn)行數(shù)據(jù)提交的。form表單所有要提交的數(shù)據(jù)都必須放在form標(biāo)簽中，method屬性定義提交的方法（有g(shù)et和post兩種提交方法），action屬性定義請求的地址。form標(biāo)簽中支持input、menus、textarea、fieldset、legend 和 label 等元素，通過submit向服務(wù)器提交數(shù)據(jù)。這里我創(chuàng)建了form表單和input框，input用于輸入請求的參數(shù)，form用于提交數(shù)據(jù)請求。
          Django后臺接口
          這里提供下Django的后臺文件請求接口，以上文件請求都是基于該接口實現(xiàn)的。接收請求方法為GET，請求參數(shù)為id（數(shù)據(jù)庫存儲的文件id），采用FileResponse方式返回的文件流信息（具體實現(xiàn)功能可以參考文章：Django實戰(zhàn)013：各種文件下載功能實現(xiàn)詳解）。
          總結(jié)：
          下載的方式方法有很多，以上只是JavaScript中常見的幾種下載方式。其實用ajax或者axios也可以實現(xiàn)下載，但是萬變不離其中，會JavaScript下載害怕不會別的么。以上下載方式個人覺得還是iframe比較簡單方便，請求最好還是通過文件流來實現(xiàn)，相對文件地址下載會更安全些。
          更多前端技巧可以參考專欄：Vue實戰(zhàn)技巧
          TML是什么
          HTML的全稱是超文本標(biāo)記語言，英文全稱是HyperText Markup Language。如果您是零基礎(chǔ)的話，看到這個名字，即使是漢語的，估計也會不知所云。
          超文本指的是用超鏈接的方法，將各種不同空間的文字信息組織在一起的網(wǎng)狀文本。通俗來說就是多個文本之間通過超鏈接相互連接在一起，這些相互連接的文本集合稱為"超文本"。超文本是網(wǎng)頁制作一個非常重要的概念，可以說網(wǎng)絡(luò)的精髓就在于"互聯(lián)"。
          這些相互關(guān)聯(lián)的信息媒體可能在同一文本中，也可能是其他文件，或是地理位置相距遙遠(yuǎn)的某臺計算機(jī)上的文件。這種組織信息方式將分布在不同位置的信息資源用隨機(jī)方式進(jìn)行連接，為人們查找，檢索信息提供方便。（孫素華編著．Dreamweaver CS5 Flash CS5 Photoshop CS5網(wǎng)頁設(shè)計從入門到精通：中國青年出版社，2014.10：第16頁）
          標(biāo)記語言的概念比較復(fù)雜，簡單來說，HTML并不是程序語言（不同于C或Python），只是一種在網(wǎng)頁中顯示資料排版位置的標(biāo)記結(jié)構(gòu)語言。這句話提煉一下就是"標(biāo)記信息在頁面中排版結(jié)構(gòu)的語言"。
          如果讀的不太明白，在下一節(jié)"HTML基本框架"中會對HTML的排版結(jié)構(gòu)規(guī)則進(jìn)行直觀展示，如果您讀不懂可以盡情的跳過，畢竟我們的重點(diǎn)是怎么用。
          HTML基本框架
          HTML框架簡單說就是任何HTML網(wǎng)頁文件中都會包含的基本代碼內(nèi)容。如果我們打算寫一個頁面，就一定要把框架代碼寫入后才能正式開始添加內(nèi)容。框架代碼如下：
          <!DOCTYPE HTML><html> <head> </head> <body> </body> </html>
          第一行 <!DOCTYPE HTML>
          第二行 <html>
          第三行 <head>
          第四行 </head>
          第五行 <body>
          第六行 </body>
          第七行 </html>
          這七行代碼是所有HTML頁面所共有的，也就是HTML的框架了。不信我們來驗證一下。
          例子一，頭條的文章頁面（電腦版）網(wǎng)址：https://www.toutiao.com/i6785149184245760516/
          筆者使用Firefox（火狐）瀏覽器，輸入網(wǎng)址后點(diǎn)擊鍵盤上的F12,，如圖所示
          我們可以看到頁面下半部分出現(xiàn)了一個調(diào)控臺。
          點(diǎn)擊查看器即可看頁面代碼。代碼如下：
          放大一些，大家看看，<!DOCTYPE HTML> <html> <head> </head> <body> </body> </html>這些標(biāo)簽是不是一個不少，只是中間多了很多內(nèi)容而已。
          一個例子不具有普適性，下面我們再看一個例子，我隨便找了個新聞頁面，網(wǎng)址：https://mil.eastday.com/a/200125113254400.html
          使用同樣的方法打開查看器看代碼，如圖：
          是不是框架中的代碼一個也不少吧。
          所以，大家請在自己的電腦中新建一個txt文件，將HTML框架粘貼到txt文件中，并命名為"HTML框架"。以后我們寫的每一個頁面都會從這個框架開始。
          通過對框架中的代碼進(jìn)行觀察，細(xì)心的讀者可能已經(jīng)發(fā)現(xiàn)了HTML這種標(biāo)記語言的書寫規(guī)律。
          規(guī)律1：每一個語句都是包含在<>尖括號內(nèi)的。這是HTML標(biāo)記語言的基本特點(diǎn)之一，大家一定記牢。
          規(guī)律2：除了<!DOCTYPE HTML>這個標(biāo)簽外，其他標(biāo)簽都是成對出現(xiàn)！例如<html>與</html>，<head>與</head>，<body>與</body>。
          規(guī)律3：這個規(guī)律通過觀察代碼也不難發(fā)現(xiàn)，即<html></html>兩個標(biāo)簽中間夾著<head></head>和<body></body>，我們把<head></head>標(biāo)簽稱為<html></html>標(biāo)簽的子標(biāo)簽，反過來<html></html>標(biāo)簽是<head></head>標(biāo)簽的父標(biāo)簽，<head></head>和<body></body>稱為并列關(guān)系或者兄弟關(guān)系。而<!DOCTYPE HTML>是一個聲明語句，屬于六親不認(rèn)的。
          各種關(guān)系如下圖所示：
          這樣就回到了之前我們解釋"標(biāo)記語言"的問題上。我們說"標(biāo)記語言"是"標(biāo)記信息在頁面中排版結(jié)構(gòu)的語言"，這種父子關(guān)系、兄弟關(guān)系就可以理解為一個頁面的"結(jié)構(gòu)"，這種結(jié)構(gòu)又與頁面的排版有關(guān)。
          在下一期中，我們會通過練習(xí)來解釋"結(jié)構(gòu)"與排版的關(guān)系。
          喜歡的小伙伴請加關(guān)注，有任何問題可以留言給我，歡迎指正批評，感激不盡！
          HTML完整學(xué)習(xí)目錄
          HTML序章（學(xué)習(xí)目的、對象、基本概念）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          第一個HTML頁面如何寫？——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML頁面中head標(biāo)簽有啥用？——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          初識meta標(biāo)簽與SEO——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML中的元素使用方法1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML中的元素使用方法2——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML元素中的屬性1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML元素中的屬性2（路徑詳解）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          使用HTML添加表格1（基本元素）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          使用HTML添加表格2（表格頭部與腳部）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          使用HTML添加表格3（間距與顏色）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          使用HTML添加表格4（行顏色與表格嵌套）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          16進(jìn)制顏色表示與RGB色彩模型——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML中的塊級元素與內(nèi)聯(lián)元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          初識HTML中的<div>塊元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          在HTML頁面中嵌入其他頁面的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          封閉在家學(xué)網(wǎng)頁制作！為頁面嵌入PDF文件——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML表單元素初識1——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML表單元素初識2——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML表單3（下拉列表、多行文字輸入）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML表單4（form的action、method屬性）——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML列表制作講解——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          為HTML頁面添加視頻、音頻的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          音視頻格式轉(zhuǎn)換神器與html視頻元素加字幕——零基礎(chǔ)自學(xué)網(wǎng)頁制作
          HTML中使用<a>標(biāo)簽實現(xiàn)文本內(nèi)鏈接——零基礎(chǔ)自學(xué)網(wǎng)頁制作
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
一区二区三区免费在线视频|
亚洲av无码一区二区三区天堂古代|
日本免费一区二区在线观看|
天天看高清无码一区二区三区|
色一情一乱一伦一区二区三欧美|
国精产品一区一区三区|
日韩在线视频一区二区三区|
日韩人妻一区二区三区免费|
国模大尺度视频一区二区|
日韩A无码AV一区二区三区
|
麻豆AV一区二区三区久久|
国产精品福利区一区二区三区四区|
国模精品一区二区三区视频|
韩国理伦片一区二区三区在线播放
|
精品视频在线观看你懂的一区|
日韩AV无码一区二区三区不卡|
亚洲日韩AV无码一区二区三区人|
无码国产精品一区二区免费式芒果|
欧洲精品无码一区二区三区在线播放|
麻豆视传媒一区二区三区|
国产女人乱人伦精品一区二区
|
日本道免费精品一区二区|
国产乱码伦精品一区二区三区麻豆|
国产乱子伦一区二区三区|
天天爽夜夜爽人人爽一区二区|
日本中文字幕一区二区有码在线|
无码人妻aⅴ一区二区三区|
亚洲国产精品一区第二页|
人妻aⅴ无码一区二区三区|
韩国一区二区视频|
国产亚洲一区二区三区在线不卡
|
手机福利视频一区二区|
亚洲国产老鸭窝一区二区三区|
北岛玲在线一区二区|
亚洲一区二区三区乱码在线欧洲|
精品国产福利第一区二区三区|
国产在线精品一区二区在线观看
|
亚洲第一区二区快射影院|
国产精品制服丝袜一区|
在线欧美精品一区二区三区|
在线观看精品视频一区二区三区|