簡介

衍伸更進一步進階級動態網頁的設計,透過CSS3的認識,編修進階語法,側重於對網頁編輯語言 html及 css的基礎學習,製作出符合現今流行的RWD網站,充實學生之基本網頁應用技術的能力,可製作出專題性網站。

HTML筆記

  1. HTML (HyperText Markup Language) 超文本標記語言:是一種用於建立網頁的標準標記語言。HTML是一種基礎技術,常與CSS、JavaScript一起被眾多網站用於設計賞心悅目的網頁。
  2. HTML 在 1989 年時由 Tim Berners-Lee 所發展出來的,在 1990 年被 WWW 開始採用,並於 1991 年提出 HTML 語法的基本草稿。由於全世界的人都在使用 HTML 來設計網頁 (WebPage) 構建網站,所以 HTML 的語法必須統一。全球資訊網協會 W3C (The World Wide Web Consortium) 在 1993 年推出 HTML1.0 版,到了 1995 年 2 月推出 HTML2.0 版。

常見HTML標籤整理

標籤 用法
< html >< /html > 此標籤是置於整個文件的開始和結束之處,以供瀏覽器識別此文件為合法的文件。
< head >< /head > 此標籤是用以表示標頭資訊的開始與結束,在< head >與< /head >之間可加入其它標籤< title >< /title >或< meta >等。

CSS筆記

CSS的中文稱為「串接樣式表」,CSS的特色:

  • 它能讓我們更精確的控制網頁版面的文字、背景、字型等網頁外觀及美化。
  • 它能只修正一個 CSS 文件,便可同時更新眾多的網頁版面外觀及格式。
  • 它可以使 html 的文件內碼更精簡,縮小檔案下載的速度。
  • 適用於各種作業平台。

常見CSS選取器(Selector)種類簡介

Class selectors
(Class選擇器,Dreamweaver稱為類別選擇器)
「.」開頭,名稱可自訂,一頁網頁可有多個class屬性值,且同一class屬性值可同時套用多處。
ID selectors(ID選擇器) 「#」開頭,名稱可自訂,一頁網頁同一個ID屬性值只能套用一個地方,屬於獨一無二的屬性值。
Type selectors(型態選擇器,Dreamweaver稱為標籤選擇器,因為套用於HTML標籤 設定於HTML的標籤上,網頁上所有的標籤都會套用。

RWD介紹

響應式網頁設計(Responsive Web Design)簡稱RWD,這是一項開始於2011年由Ethan Marcotte 發明的術語 Responsive Web Design (RWD)。2012年後被公認為是日後網頁設計開發技術的趨勢,網站使用CSS3,以百分比的方式以及彈性的畫面設計,在不同解析度下改變網頁頁面的佈局排版,讓不同的設備都可以正常瀏覽同一網站