HTML
- html超文本標記語言
- 前端三層
- HTML結構層
- css樣式層
- JavaScript行為層
- 其他多媒體內容(圖片,音頻等等)
-
互聯網運行程序
客 --http請求--> 服 戶 http協議 務 端 <--http回應-- 器
- 互聯網原理
- 服務器server,一種特殊的計算器,包括處理器、硬碟、記憶體、系統總線等,但是由于需要提供更可靠的服務,因此在處理能力、穩定性、可靠性、安全性等方面要求較高,
- 作用:對于WEB來講,用于存盤開發人員上傳的網頁資料,且需要回應服務請求,并進行處理,
- 要求:對于網站服務器來說,為了讓用戶隨時進行訪問,必須24小時不間斷作業
- 云服務器
- 簡單高效、安全可靠、處理能力可彈性伸縮的計算服務,其管理方式比物理服務器更簡單高效,不用提前購買,即可徐速創建或釋放任意多臺云服務器,
- 客戶端Client
- 用戶端,普通用戶使用的終端,客戶端有多種形式,比如最常用的是瀏覽器、app等,而web開發最主要的客戶端形式還是瀏覽器,
- 瀏覽器
- 用于發送HTTP請求到服務器,接收服務器發回的HTTP回應,渲染HTML網頁
主流瀏覽器: 內核(渲染引擎): 說明:
微軟的IE和Microsoft Edge ---Trident IE內核
Mozilla的Firefox ---Gecko Firefox內核
蘋果的Safari ---Webkit
Google的chrome ---Webkit-->Blink 統稱為chrome內核
Opera的Opera ---Presto-->Webkit-->Blink
- 瀏覽器功能:
- 發送http請求
- 接受服務器發回的http回應
- 將接收的html進行決議并顯示
- HTTP協議
是客戶端瀏覽器或其他程式與web服務器之間的應用層通信協議
- http請求
- request,瀏覽器根據網址向對應的服務器發送請求
- 發起請求的方法:在瀏覽器地址欄中輸入網址,或者點擊網址鏈接
- html頁面決議程序中,會發出多個http請求,包含網頁的圖片、視頻、音頻等檔案請求,
- http回應
- response,服務器根據請求回應一個HTML檔案,將HTML傳輸給客戶端,在瀏覽器中進行HTML網頁的渲染,
HTML
- 超文本標記語言,用來制作網頁的一種標記語言;是一種純文本格式的檔案,但在網頁中可以呈現包含文字以外的內容效果,
- 功能:利用標記給普通的文本添加語意、描述超文本內容,搭建網頁的基本結構,
- html的語意化
- 語意化網頁的優勢
- 方便代碼的閱讀和后期的維護
- 便于瀏覽器或是網路爬蟲更好的決議網站內容
- 使用語意化標簽有利于SEO搜索引擎優化,提高網站的搜索排名
HTML基本語法
HTML規范版本:HTML1.0---html5
- HTML標簽語法
- 標簽必須寫在一堆尖括號<>內部
- 標簽分為單標簽和雙標簽,雙標簽必須成對出現
- 雙標簽包含開始標簽和及結束標簽,結束標簽必須書寫關閉符合/,單標簽也需要進行自封閉書寫,
HTML元素
- html元素指的是從開始標簽到結束標簽的所有內容,包含開始標簽、元素內容、結束標簽
元素內容
- 元素內容可以是純文本,也可以是其他的html元素,當這種元素內容包含其他html元素的情況,稱之為嵌套
- 嵌套關系可以有多層
- 單標簽是不能添加元素內容的,稱之為空元素
標簽級別
根據標簽內部可以存放的元素不同,可以將雙標簽劃分為:
容器級:標簽內部可以存放任意內容,包含容器級標簽;
文本級:標簽內部只能存放文字或類似文字的內容,如:圖片,表單元素,
HTML元素的特性
- 瀏覽器識別的是元素的開始和結束以及互相之間的嵌套關系
- 空白折疊現象:當元素內容是文本,所有的文字(類似文字內容)之間有空格、換行、縮進等空白字符,在瀏覽器加載時,連接在一起的空白會折疊程一個空格顯示
HTML屬性規范
- 書寫位置:必須寫在開始標簽或者單標簽之內,與標簽名之間用空格進行分隔
- 屬性包含:屬性名(key)、屬性值(value);屬性名和屬性值之間的寫法通常稱為鍵值對寫法,
一個標簽內可以設定多個不同的屬性,屬性與屬性之間使用空格分隔
部分標簽屬性k值可以設定多個屬性值v,但是要寫在同一對雙引號內,值之間用空格分隔
HTML基本結構--基本骨架
<html>標簽
- 定義HTML檔案的根元素,表示整個的HTML檔案,所有的標簽要書寫在
<html>標簽的內部
<head>標簽
- 用于存放
<title>、<meta>、<base>、<style>、<script>、<link>,內部用于對網頁的設定 - 除了
<title>內部的文字,其他標簽都不顯示在瀏覽器上,
<title>標簽 - 作用:頁面顯示的標題,也作為搜索引擎抓取時的關鍵字,提高SEO搜索引擎優化
<body>標簽
- 作用:定義網頁的主體部分,用于存放所有的HTML顯示內容的標簽,其內部的元素會顯示在瀏覽器的視窗中
HTML基本結構--DTD
DTD
- 完整的HTML檔案的第一行內容叫做檔案定義型別DocType Definition,簡稱DTD,也稱檔案宣告型別
- DocType Declaration,
- 作用:告知瀏覽器該網頁使用的是哪個版本的HTML規范,讓瀏覽器按照對應版本的HTML語法進行決議頁面
HTML基本結構--命名空間
命名空間xmlns
- xml:可擴展標記語言,使用在傳輸程序中的規范,被設計用來傳輸和存盤資料,是html的補充,
- xmlns:全稱叫做XML NameSpace,NameSpace叫做命名空間,瀏覽器會將此命名空間用于該屬性所在元素內的所有內容
<html>元素的命名空間規定了在不同用戶的瀏覽器中標簽語意遵循的統一標準,避免出現標簽名沖突,- 這個標準使用的是一個固定網址https://www.w3.org/1999/xhtml中的規范
語言- xml:lang="en"和lang="en" 表示所有的標簽元素內容的語言都是英語,對搜索引擎和瀏覽器都是有幫助的
- lang="zh-cn" 表示中文(中國)
HTML基本結構--字符集
<head>標簽內部的<meta>標簽通過http-equiv屬性定義了當前網頁所使用的字符編碼- char:character,字符,set:集合
- XHTML1.0版本
<meta http-equiv=“Content-Type” content=“text/html;charset=UTF-8”>- 字符集常見問題:
若沒有網頁加載速度要求,或者制作的是外文網站,建議使用utf-8(包含世界所有國家需要的字符)
若有使用大量中文漢字,且要求網頁加載速度快的,建議使用gbk(國標碼)
注意!meta標簽宣告的字庫,必須和編輯器軟體默認編譯字庫相同,否則會出現兩個字庫不匹配,瀏覽器加載時出現亂碼
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/186565.html
標籤:其他
下一篇:jquery事件系結
