資訊專欄INFORMATION COLUMN
摘要：所謂超文本，因為它可以加入圖片聲音動畫多媒體等內容，不僅如此，它還可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接。意思是超文本引用用于指定鏈接頁面的打開方式，其取值有和兩種，其中為默認值，為在新窗口中打開方式。
了解常用瀏覽器
掌握WEB標準
理解標簽語義化
掌握常用的排版標簽
掌握常用的文本格式化圖像鏈接等標簽
掌握三種列表標簽
掌握表格標簽
掌握表格標簽
掌握表單標簽
能夠寫出基本的頁面（里面包含圖片、各種標簽和鏈接）開發工具
我們主要用的開發工具有chrome、hbuilder、Photoshop
瀏覽器顯示瀏覽器是網頁顯示、運行的平臺，常用的瀏覽器有IE、火狐（Firefox）、谷歌（Chrome）、Safari和Opera等。我們平時稱為五大瀏覽器。
瀏覽器內核（理解）瀏覽器內核又可以分成兩部分：渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎。
渲染引擎 ：它負責取得網頁的內容（HTML、XML、圖像等等）、整理訊息（例如加入 CSS 等），以及計算網頁的顯示方式，然后會輸出至顯示器或打印機。瀏覽器的內核的不同對于網頁的語法解釋會有不同，所以渲染的效果也不相同。
JS 引擎 則是解析 Javascript 語言，執行 javascript語言來實現網頁的動態效果。
最開始渲染引擎和 JS 引擎并沒有區分的很明確，后來 JS 引擎越來越獨立，內核就傾向于只指渲染引擎。有一個網頁標準計劃小組制作了一個 ACID 來測試引擎的兼容性和性能。內核的種類很多，如加上沒什么人使用的非商業的免費內核，可能會有10多種，但是常見的瀏覽器內核可以分這四種：Trident、Gecko、Blink、Webkit。
了解一點：移動端的瀏覽器內核主要說的是系統內置瀏覽器的內核。
Android手機而言，使用率最高的就是Webkit內核，大部分國產瀏覽器宣稱的自己的內核，基本上也是屬于webkit二次開發。
iOS以及WP7平臺上，由于系統原因，系統大部分自帶瀏覽器內核，一般是Safari或者IE內核Trident的
web標準的好處
1、讓Web的發展前景更廣闊
2、內容能被更廣泛的設備訪問
3、更容易被搜尋引擎搜索
4、降低網站流量費用
5、使網站更易于維護
6、提高頁面瀏覽速度
結構標準：結構用于對網頁元素進行整理和分類，咱們主要學的是HTML。 最重要
表現標準：表現用于設置網頁元素的版式、顏色、大小等外觀樣式，主要指的是CSS。
行為標準：行為是指網頁模型的定義及交互的編寫，咱們主要學的是 Javascript
HTML（英文Hyper Text Markup Language的縮寫）中文譯為“超文本標簽語言”。是用來描述網頁的一種語言。
所謂超文本，因為它可以加入圖片、聲音、動畫、多媒體等內容，不僅如此，它還可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接。
我是一個大標題
注意： 體會 文本 標簽 語言 幾個詞語
HTML 指的是超文本標記語言 (Hyper Text Markup Language)
HTML 不是一種編程語言，而是一種標記語言 (markup language)
標記語言是一套標記標簽 (markup tag)
總結： HTML 作用就是用標記標簽來描述網頁，把網頁內容在瀏覽器中展示出來。
骨架結構解析
1 HTML標簽：
作用所有HTML中標簽的一個根節點。 最大的標簽 根標簽
2 head標簽： 文檔的頭部
文檔的頭部描述了文檔的各種屬性和信息，包括文檔的標題、在 Web 中的位置以及和其他文檔的關系等。絕大多數文檔頭部包含的數據都不會真正作為內容顯示給讀者。
注意在head標簽中我們必須要設置的標簽是title
3.title標簽： 文檔的標題
作用：讓頁面擁有一個屬于自己的標題。
4.body標簽：文檔的主體 以后我們的頁面內容 基本都是放到body里面的
body 元素包含文檔的所有內容（比如文本、超鏈接、圖像、表格和列表等等。）
在HTML頁面中，帶有“< >”符號的元素被稱為HTML標簽，如上面提到的 HTML、head、body都是HTML骨架結構標簽。所謂標簽就是放在“< >” 標簽符中表示某個功能的編碼命令，也稱為HTML標簽或 HTML元素
1.雙標簽
<標簽名> 內容
該語法中“<標簽名>”表示該標簽的作用開始，一般稱為“開始標簽（start tag）”，“” 表示該標簽的作用結束，一般稱為“結束標簽（end tag）”。和開始標簽相比，結束標簽只是在前面加了一個關閉符“/”。
比如 我是文字
2.單標簽
<標簽名 />
單標簽也稱空標簽，是指用一個標簽符號即可完整地描述某個功能的標簽。
比如
標簽的相互關系就分為兩種：
1.嵌套關系
2.并列關系
首先 HTML和CSS是兩種完全不同的語言，我們學的是結構，就只寫HTML標簽，認識標簽就可以了。 不會再給結構標簽指定樣式了。
HTML標簽有很多，這里我們學習最為常用的，后面有些較少用的，我們可以查下手冊就可以了。
排版標簽
標題標簽（熟記）單詞縮寫： head 頭部. 標題 title 文檔標題
為了使網頁更具有語義化，我們經常會在頁面中用到標題標簽，HTML提供了6個等級的標題，即
標題文本
文本內容
是單標簽
div span 是沒有語義的 是我們網頁布局主要的2個盒子 css+div
div 就是 division 的縮寫 分割， 分區的意思 其實有很多div 來組合網頁。
span, 跨度，跨距；范圍
語法格式：
這是頭部今日價格
在網頁中，有時需要為文字設置粗體、斜體或下劃線效果，這時就需要用到HTML中的文本格式化標簽，使文字以特殊的方式顯示。
b i s u 只有使用 沒有 強調的意思 strong em del ins 語義更強烈
使用HTML制作網頁時，如果想讓HTML標簽提供更多的信息，可以使用HTML標簽的屬性加以設置。其基本語法格式如下：
<標簽名 屬性1="屬性值1" 屬性2="屬性值2" …> 內容
在上面的語法中，
1.標簽可以擁有多個屬性，必須寫在開始標簽中，位于標簽名后面。
2.屬性之間不分先后順序，標簽名與屬性、屬性與屬性之間均以空格分開。
3.任何標簽的屬性都有默認值，省略該屬性則取默認值。
采取 鍵值對 的格式 key="value" 的格式
比如:
屬性 是 寬度
值 是 400
單詞縮寫： image 圖像
HTML網頁中任何元素的實現都要依靠HTML標簽，要想在網頁中顯示圖像就需要使用圖像標簽，接下來將詳細介紹圖像標簽以及和他相關的屬性。其基本語法格式如下：
該語法中src屬性用于指定圖像文件的路徑和文件名，他是img標簽的必需屬性。
單詞縮寫： anchor 的縮寫 [???k?(r)] 。基本解釋 錨, 鐵錨 的
在HTML中創建超鏈接非常簡單，只需用標簽環繞需要被鏈接的對象即可，其基本語法格式如下：
文本或圖像
href：用于指定鏈接目標的url地址，當為標簽應用href屬性時，它就具有了超鏈接的功能。 Hypertext Reference的縮寫。意思是超文本引用
target：用于指定鏈接頁面的打開方式，其取值有self和blank兩種，其中self為默認值，blank為在新窗口中打開方式。
注意：
1.外部鏈接 需要添加 http:// www.baidu.com
2.內部鏈接 直接鏈接內部頁面名稱即可 比如 < a href="index.html"> 首頁
3.如果當時沒有確定鏈接目標時，通常將鏈接標簽的href屬性值定義為“#”(即href="#")，表示該鏈接暫時為一個空鏈接。
4.不僅可以創建文本超鏈接，在網頁中各種網頁元素，如圖像、表格、音頻、視頻等都可以添加超鏈接。
通過創建錨點鏈接，用戶能夠快速定位到目標內容。
創建錨點鏈接分為兩步：
1.使用“a href=”#id名>“鏈接文本"創建鏈接文本（被點擊的） 2.使用相應的id名標注跳轉目標的位置。第2集
base 可以設置整體鏈接的打開狀態
base 寫到
之間把所有的連接 都默認添加 target="_blank"
在HTML中還有一種特殊的標簽——注釋標簽。如果需要在HTML文檔中添加一些便于閱讀和理解但又不需要顯示在頁面中的注釋文字，就需要使用注釋標簽。其基本語法格式如下：
ctrl + / 或者 ctrl +shift + /
注釋內容不會顯示在瀏覽器窗口中，但是作為HTML文檔內容的一部分，也會被下載到用戶的計算機上，查看源代碼時就可以看到。
實際工作中，通常新建一個文件夾專門用于存放圖像文件，這時再插入圖像，就需要采用“路徑”的方式來指定圖像文件的位置。
根目錄 當前目錄
路徑可以分為： 相對路徑和絕對路徑
以引用文件之網頁所在位置為參考基礎，而建立出的目錄路徑。因此，當保存于不同目錄的網頁引用同一個文件時，所使用的路徑將不相同，故稱之為相對路徑。
圖像文件和HTML文件位于同一文件夾：只需輸入圖像文件的名稱即可，如img src="logo.gif" /。
圖像文件位于HTML文件的下一級文件夾：輸入文件夾名和文件名，之間用“/”隔開，如img src="img/img01/logo.gif" /。
圖像文件位于HTML文件的上一級文件夾：在文件名之前加入“../” ，如果是上兩級，則需要使用 “../ ../”，以此類推，如img src="../logo.gif" /。
絕對路徑以Web站點根目錄為參考基礎的目錄路徑。之所以稱為絕對，意指當所有網頁引用同一個文件時，所使用的路徑都是一樣的
“D:webimglogo.gif”，或完整的網絡地址，例如“http://www.itcast.cn/images/l...”。
無序列表的各個列表項之間沒有順序級別之分，是并列的。其基本語法格式如下：
注意：
無序列表會帶有自己樣式屬性，放下那個樣式，一會讓CSS來！
有序列表即為有排列順序的列表，其各個列表項按照一定的順序排列定義，有序列表的基本語法格式如下：
- 列表項1
- 列表項2
- 列表項3
......
所有特性基本與ul 一致。
但是實際工作中， 較少用 ol img src="media/1.jpg" />
定義列表常用于對術語或名詞進行解釋和描述，定義列表的列表項前沒有任何項目符號。其基本語法如下：
在HTML網頁中，要想創建表格，就需要使用表格相關的標簽。創建表格的基本語法格式如下：
| 單元格內的文字 | ...
在上面的語法中包含三對HTML標簽，分別為 table1.table用于定義一個表格。
2.tr 用于定義表格中的一行，必須嵌套在 table標簽中，在 table中包含幾對 tr，就有幾行表格。
3.td /td：用于定義表格中的單元格，必須嵌套在
注意：
1.中只能嵌套 2. 標簽，他就像一個容器，可以容納所有的元素
表頭一般位于表格的第一行或第一列，其文本加粗居中，如下圖所示，即為設置了表頭的表格。設置表頭非常簡單，只需用表頭標簽th
在使用表格進行布局時，可以將表格劃分為頭部、主體和頁腳（頁腳因為有兼容性問題，我們不在贅述），具體 如下所示：
：用于定義表格的頭部。
必須位于
位于
表格的標題： caption
定義和用法
caption 元素定義表格標題。
caption 標簽必須緊隨 table 標簽之后。您只能對每個表格定義一個標題。通常這個標題會被居中于表格之上。
跨行合并：rowspan 跨列合并：colspan
合并單元格的思想：
將多個內容合并的時候，就會有多余的東西，把它刪除。 例如 把 3個 td 合并成一個， 那就多余了2個，需要刪除。 公式： 刪除的個數 = 合并的個數 - 1
合并的順序 先上 先左
表格提供了HTML 中定義表格式數據的方法。
表格中由行中的單元格組成。
表格中沒有列元素，列的個數取決于行的單元格個數。
表格不要糾結于外觀，那是CSS 的作用。
表格的學習要求： 能手寫表格結構，并且能合并單元格。
表單控件：
包含了具體的表單功能項，如單行文本輸入框、密碼輸入框、復選框、提交按鈕、重置按鈕等。
提示信息：
一個表單中通常還需要包含一些說明性的文字，提示用戶進行填寫和操作。
表單域：
他相當于一個容器，用來容納所有的表單控件和提示信息，可以通過他定義處理表單數據所用程序的url地址，以及數據提交到服務器的方法。如果不定義表單域，表單中的數據就無法傳送到后臺服務器。
在上面的語法中，input /標簽為單標簽，type屬性為其最基本的屬性，其取值有多種，用于指定不同的控件類型。除了type屬性之外，input /標簽還可以定義很多其他的屬性，其常用屬性如下表所示。
label 標簽為 input 元素定義標注（標簽）。
作用： 用于綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點
如何綁定元素呢？
for 屬性規定 label 與哪個表單元素綁定。
如果需要輸入大量的信息，就需要用到textarea/textarea標簽。通過textarea控件可以輕松地創建多行文本輸入框，其基本語法格式如下：
使用select控件定義下拉菜單的基本語法格式如下
注意：
select
在option 中定義selected =" selected "時，當前項即為默認選中項。
在HTML中，form標簽被用于定義表單域，即創建一個表單，以實現用戶信息的收集和傳遞，form中的所有內容都會被提交給服務器。創建表單的基本語法格式如下：
常用屬性：
Action
在表單收集到信息后，需要將信息傳遞給服務器進行處理，action屬性用于指定接收并處理表單數據的服務器程序的url地址。
method
用于設置表單數據的提交方式，其取值為get或post。
name
用于指定表單的名稱，以區分同一個頁面中的多個表單。
注意： 每個表單都應該有自己表單域。
經常查閱文檔是一個非常好的學習習慣。
W3C : http://www.w3school.com.cn/
MDN: https://developer.mozilla.org...
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/53596.html
摘要：特意對前端學習資源做一個匯總，方便自己學習查閱參考，和好友們共同進步。 特意對前端學習資源做一個匯總，方便自己學習查閱參考，和好友們共同進步。 本以為自己收藏的站點多，可以很快搞定，沒想到一入匯總深似海。還有很多不足&遺漏的地方，歡迎補充。有錯誤的地方，還請斧正... 托管: welcome to git，歡迎交流，感謝star 有好友反應和斧正，會及時更新，平時業務工作時也會不定期更...
摘要：基礎基礎是一種標記語言，不是編程語言，需要明確這點。元素標簽內容基礎基礎負責文本樣式的呈現，既然將和分離開，各自只負責各自的職責，那么肯定需要某種方式將兩者連接在一起。 本篇文章已授權微信公眾號 dasu_Android（大蘇）獨家發布 聲明 本系列文章內容全部梳理自以下四個來源： 《HTML5權威指南》 《JavaScript權威指南》 MDN web docs Github:smyh...
摘要：一些知識點有哪些方法方法前端從入門菜鳥到實踐老司機所需要的資料與指南合集前端掘金前端從入門菜鳥到實踐老司機所需要的資料與指南合集歸屬于筆者的前端入門與最佳實踐。 工欲善其事必先利其器-前端實習簡歷篇 - 掘金 有幸認識很多在大廠工作的學長，在春招正式開始前為我提供很多內部推薦的機會，非常感謝他們對我的幫助。現在就要去北京了，對第一份正式的實習工作也充滿期待，也希望把自己遇到的一些問題和...
摘要：個人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現在已經一年的時間了，由于工作比較忙，更新緩慢，后面還是會繼更新，現將已經寫好的文章整理一個目錄，方便更多的小伙伴去學習。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個人前端文章整理 從最開始萌生寫文章的想法，到著手...
閱讀 1478·2021-10-14 09:43
閱讀 1442·2021-10-09 09:58
閱讀 1937·2021-09-28 09:42
閱讀 3727·2021-09-26 09:55
閱讀 1752·2021-08-27 16:23
閱讀 2755·2021-08-23 09:46
閱讀 906·2019-08-30 15:55
閱讀 1405·2019-08-30 15:54
