Bootstrap零基礎學習第一課之模板

2022-09-28 17:45:12 字數 1078 閱讀 5272

最近需要做乙個簡單的web頁面。

考慮到前端經驗不足,為了快速產出,同時專案www.cppcns.com只是乙個工具,對專案沒有什麼要求,所以我選擇了bootstrap這個框架作為web框架。

寫從零開始學bootstrap的初衷:

看了半天的bootstrap的文件,包括官方的(和非官方的(以及他人寫的簡單入門部落格(和知乎上關於bootstrap上的評論(深深的感覺到,bootstrap應該是乙個很好用的框架,學習起來也不難,是個高速產出的工具,但是靈活性不足以讓開發者隨心所欲的把玩。而且前端的東西太多太雜,如果沒有乙個清晰的學習目標和路線,很容易陷入無盡的細節中,沒有相應的產出,會有挫敗感。因此我決定記錄下自己的學習路徑,方便自己複習,以及廣大的初學者入門。

讓我們先從bootstrap的最簡單的模板開始: 

bootstrap 101 template

讓我們一行行的來看(我用#代表解釋):

#代表這是html5頁面

#lang是「language」的意思,是html標籤的乙個屬性,這個屬性是告訴搜尋引擎,我這個頁面是中文頁面,是方便搜尋引擎收錄的,對頁面顯示並沒有影響。"zh—cn"是iso標準的一種寫法,表示中文。"zh"是"zhongwen"的前兩個字母(如果要告訴瀏覽器是英文介面,則lang="en","en"就對應了「english」的前兩個字母),"cn"是國家**。(

#meta標籤是方便瀏覽器解析html檔案的標籤,charset屬性告訴瀏覽器,本html檔案的編碼方式是utf-8.

#http-equiv屬性告訴瀏覽器,本html規定的相容性等細節是怎樣的。(值是ie8及以後版本的ie(ie9,ie10,11,...)中才生效的標記,用來指定瀏覽器去模擬某個特定版本的ie瀏覽器的渲染方式。(網上有的文章居然說 x-ua-compatible是ie8的專用標記,簡直太誤導人了!)

#為什麼要這麼做?因為微軟之前的ie(ie6,ie7)是不符合w3c標準的,因此有些**的**使用的是老ie的標準,而不是w3c的標準。而從ie8開始,微軟採用了w3c標準。

#所以可以通過這個屬性值,來強制規定瀏覽器的渲染方式,當設定content="ie6"的時候,這樣使用者以ie8及以上的瀏覽器也能正常顯示ie6標準下的html網頁。

零基礎學習 nginx tomcat

我們平時對j2ee開發的時候使用的是tomcat伺服器,tomcat伺服器是用來解析servlet動態網頁的,比如jsp。而apache web伺服器只能處理靜態頁面,如html,css等。其實tomcat也可以解析靜態頁面,但是效率很差,我們在開發的時候因為注重開發,並不用考慮效能問題,所以並不需...

零基礎深度學習

本內容比較適合零基礎但對人工智慧技術與人工智慧程式開發感興趣,想從事人工智慧相關工作或需要在本職工作中加入人工智慧技術的在職人員或在校學生。以python為主要開發語言,深入淺出快速上手最先進的深度學習技術。收穫 能夠使用程式開發技能完成諸如計算機視覺 自然語言處理等人工智慧任務,例如影象識別 智慧...

零基礎學習前端

最近也是找了個學校學習前端,將這幾天學到的東西做個小結 下面就是html的基礎筆記了!1.html 全名叫 超文字標記語言 hyper text markup languge html標籤的基本結構 雙標籤 有開始和結束的標籤叫雙標籤,例如 單標籤 只有開始沒有結束的標籤叫單標籤 根節點頭部標籤 標...