close

前端工程師難嗎?其實學會一點就能上手!!

前端工程師難嗎?其實學會一點就能上手!!

前端工程師入門課程偷偷地先透露一點給你知道!!

CSS不難,需要用點心學習;您就能躍身為前端工程師的一份子了!!

這篇中提到:Class 及 ID 都是使用者設定的選擇器 (selector)。Class 選擇器的說明如這篇,ID 選擇器的說明如下

ID 選擇器

Class 的宣告法,是先放一個井字號 (#),之後再列出選擇器名稱。格式如下:

ID 名稱{ 
屬性:設定值;
...
}

譬如說,如我們要定義導覽列的顏色為代號「#0000FF」的顏色時,宣告的 CSS 如下:

#navbar {
color:#0000FF;
}

要將以上的樣式套用在 HTML 內,我們用以下的 HTML 碼:

<p class="navbar">這是用 id 選擇器定義 navbar 文字顏色為「#0000FF」純藍色的例子。</p>

以上宣告顯示如下:

   ▶ 參考資料:HTML和CSS的網頁顏色代碼對照表

Class 跟 ID 的不同之處

這兩者最大的不同,在於 ID 選擇器在一個 HTML 文件中只可以被使用一次,而 Class 選擇器在一個 HTML 文件中可以被使用多次。

另外,是 ID 選擇器可以被 Javascript 中的 GetElementByID 函數所運用,而 Class 選擇器無法被 Javascript 運用到。

至於何時要用 ID 、何時要用 Class,並沒有一定的規則。但是大多的時候,Class 選擇器的使用頻率較高,因為 Class 選擇器在一個 HTML 文件中,可以被使用多次。但是當你要用 Javascript 的 GetElementByID 函數時,你就應該要用 ID 選擇器。

Class 名稱及 ID 名稱,大寫與小寫是不同的,不能互用。例如:.navbar 及 .NavBar,是代表兩個不同的 Class 選擇器。

所以基礎的CSS課程,透過這些步驟前端工程師的日子指日可待!!

 

推薦閱讀:

不用怕HTML5教學太難~我們從簡單的學起

文字在HTML5教學裡的奧秘都在這了!

HTML5教學讓你的網頁更容易被搜尋引擎"了解"

厭世代正風行?來上Java課程可以幫你扭轉困境!

高薪像做夢?!Java課程讓你夢想成真!

Java課程助你擠進IT專業職場大門

中國IT教育領導品牌 達內教育集團第一家海外授權中心

arrow
arrow
    創作者介紹
    創作者 uidesignxiaoshow 的頭像
    uidesignxiaoshow

    生活必備咖啡因程式碼-店長Yui大小事

    uidesignxiaoshow 發表在 痞客邦 留言(0) 人氣()