WEB前端學習筆記 一

最近時間比較充裕,整理了一下學習過的筆記,此篇筆記包含了:Html、Css、JavaScript、Jquery。以及使用帝國CMS或是織夢CMS建立自己的網站,也許也會整理一下PHP的筆記,如果時間允許會整理完全。

雖然筆記是從最基礎的開始,但是,並不包含電腦的基礎知識,所以你必須已經掌握了一些電腦的基本操作,比如開關機,你的電腦用的是什麼操作系統,至少也要會用word和wps吧。瀏覽器是做什麼的,什麼拷貝、複製、粘貼、知道最基本的文件類型,如,文本文件,視頻文件,圖片文件,什麼是可執行文件,分得清楚文件名和擴展名(用來識別文件類型)的,然後再來學習!

WEB前端學習筆記大致內容:

一切從實用的角度出發,HTML標籤及標籤的屬性,標籤屬性不是重點,簡單瞭解,在學習html標籤的同時結合css的來實現樣式,然後就是案例,就用網知博學的頁面作爲案例來寫完整站頁面。

寫完靜態的整站頁面後,就是JavaScript的基礎,然後就是Jquery的案例,最後使用jquery來實現網知博學靜態頁面案例中的動態效果。如果時間允許可能還會整理一下購物網站的案例。

HTML CSS篇——HTML

在學習之前需要先了解一下,初級前端學習內容:Html、Css、JavaScript、Jquery

1.   HTML和CSS是什麼?

2.   JavaScript和Jquery能做什麼?

3.   W3C是什麼鬼?

4.   在學習HTML、CSS、JavaScript和Jquery之前,我還需要知道些什麼?

5.   自學了HTML、CSS、JavaScript和Jquery,爲什麼寫不出一個完整的網站。甚至是連一個頁面都完成不了!

1.1 正式開始前需先知道什麼是文本和超文本

在閱讀以下內容之前,需要先了解什麼是文本,什麼是超文本,文本的概念應該是任何寫下來的文字,都可以稱之爲文本,對於計算機來說,就是一種文檔的類型,不管你的電腦用的是何種操作系統(win7、win8、win10),都有一個記事本的程序,可以在記事本里記錄一些文字,雖然能做一些簡單的排版但不能插入圖片,視頻,聲音,也不能設置文字鏈結到其他位置或其他文本,記事本程序保存後的文件擴展名爲txt,我們把擴展名爲txt的文件稱爲文本文件。

超文本:簡單來說,除了普通的文字,還可以包含圖片,視頻,聲音,最主要的一點就是其中的文字或圖片可以鏈結到其他位置或者其他文檔。儘量用比較通俗的語言介紹了一下文本和超文本,如想更深入的瞭解,可以自行百度搜索!既然知道了什麼是文本和超文本,那麼下面就來介紹下HTML吧!

1.2  什麼是Html

HTML 全稱爲HyperText Markup Language,譯爲超文本標記語言,是最基礎的網頁語言,是通過標籤來定義的語言,代碼都是由標籤所組成,並不是編程語言。可以理解爲標記語言就是一套標記標籤,HTML 使用標記標籤來描述網頁中的內容,比如標記某段文本爲標題、標記某段文本爲段落,以及標記網頁結構,都是使用相對應的標籤來標記的。HTML文檔也可以稱爲網頁,Html文檔的擴展名爲.Html,也可以稱作靜態網頁。

比如我們都知道在word中有標題、段落、還可以插入圖片,那麼在Html中就分別定義了不同的標籤來描述,標題定義了h1標籤;段落定義了p標籤;圖片定義了img標籤;也就是說一段文字加上了h1標籤,就說明這段文字是標題,如果加上p標籤,就說明了這段文字是段落,如果是一張圖片呢?那麼就要加上img的標籤,爲什麼要定義這些標籤?所定義的這些標籤是給瀏覽器解析的,瀏覽器並不知道你所寫的東西哪裏是標題,哪裏是段落,也不認識圖片,瀏覽器只認識這些標籤,最終我們用瀏覽器打開網頁,瀏覽器將內容按照標籤所標記的結構和樣式展現給我們!不同的標籤還具有不同的屬性,通過對屬性值的更改,可用來改變字體大小,字體顏色,圖片的高度、寬度等樣式。

給小白同學再解釋下什麼是屬性,大家應該都玩過遊戲,遊戲中人物屬性,常見的有***,防禦,生命值,魔法值等;

遊戲中物品屬性,大都是用來增加人物屬性值的。比如遊戲中的人物帶上某個物品後就能增加***力,或是增加防禦力,增加生命值,增加魔法值等。同樣,html中這些標籤也具有屬性,通過更改標籤的屬性值來給標記的內容增加更多的效果!

雖然可以通過設定標籤的屬性值來給標籤中的內容設定樣式,但這樣寫出來的網頁,不便於維護,後期更改,一些複雜絢麗的效果實現不了,所以現在不再通過標籤的屬性來設定樣式了!標籤的屬性只作爲了解即可,不用花費很長時間去把每個標籤的屬性都記住。

1.3  什麼是CSS

既然不再使用標籤屬性來設置樣式了,那麼該用什麼呢,對,就是CSS(Cascading Style Sheets)中文名稱:層疊樣式表,是用來定義網頁的顯示效果。有了CSSHtml就只負責網頁結構和標記內容,如哪裏是標題,哪裏是段落等等,而所有的樣式(字體大小,顏色等等)都由Css來實現,也就是說:CSS將網頁內容和顯示樣式進行分離,可以解決html代碼對樣式定義的重複,提高了後期樣式代碼的可維護性,並增強了網頁的顯示效果功能。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章