HTML，hyper text markup language，功能是給網頁劃分結構。網頁一共有幾大塊，這一塊裡面包著哪幾小塊，小塊裡又包著什麼元素...並且為重點結構命名（class=xxx, id=xxx），方便調整重點結構的外觀樣式，增加重點結構的邏輯。
CSS，casecade sheet style，功能是調整網頁結構的外觀，布局。通過標簽名、class名、id名和HTML中的結構對應起來。
JavaScript，功能是捕捉用戶在網頁上的行為，實現自定義的邏輯，最終在網頁上產生變化。通過DOM中的getElementById、getElementByClassName等與HTML中的結構對應起來，通過setAttribute為結構增加新的class，這個class在CSS中早已定義好。一旦attribute增加，CSS樣式被使用，網頁樣式隨之變化。
css中的定位：浮動定位，（凝膠布局），絕對定位，表格布局。常用雙欄甚至多欄布局例子來討論具體效果。
浮動定位：一定要指定結構的寬度，然後浮動到可布局空間的最左側或者最右側。接下來的結構補上空位，形成環繞效果。腳欄的上方可以用clear來避免浮動欄帶來的遮蔽影響。
（凝膠布局：為了讓重要內容保持HTML中的優先性（在手機小屏幕中會按照HTML順序顯示，先顯示那麼長的邊欄不合適），當重要內容居於雙欄的左側時，選擇左浮動重要內容，而不是簡單的右浮動邊欄。這種左浮操作使得邊欄有可能擴得極大，這時加一個指定寬度的大div，固定住左右欄的寬度，讓這個大div左右margin都保持auto就行了。這個時候甚至可以不用左浮動。確定就是沒有充分使用窗口空間）。
絕對定位：以窗口為邊界，指定結構離當前邊界的距離，不管窗口縮放，都保持這個距離。這時可以指定右邊欄的絕對位置（同時保證了重要內容的左欄在HTML上的優先性）。左側重要內容欄只需指定到邊界的距離（留給右邊欄）。但是沒有辦法克服右邊欄放縮對腳欄的遮蔽影響。
表格布局：能保證重要內容的左欄在HTML上的優先性，能充分使用窗口空間，能克服右邊欄放縮對腳欄的遮蔽影響。
後台代碼與js功能上有什麼區別？
python後台處理通過request拿到用戶提交的表單值，然後實現了一系列邏輯，把結果通過render_template傳回網頁。那麼javescript在什麼時候發揮作用呢？不涉及表單數據後台邏輯部分（表單數據本地邏輯，點擊行為），可以直接用js直接處理掉（頁面樣式，展示值等等），js用getElementById等待方式拿到表單值，涉及表單數據後台邏輯部分，則需要使用後台。
編程中遇到的一些易錯細節：
1，JavaScript中，定義變量前一定要加var，不像python不定義即可使用。
2，聲明類、變量後要加分號；
3，聲明類中成員後要加逗號，
4，定義完函數後不用加標點符號
5，html中標簽裡的屬性用空格分隔，不使用逗號分隔，比如
<link rel="stylesheet" href="battleship.css">
