Fedora的網頁設計自學網
姓名 : Fedora
學號 : 9033xx
回首頁
HTML 標記學習
第一堂課
第二堂課
HTML 作業回顧
第一堂課
第二堂課
CSS 學習
第三堂課
第四堂課
第五堂課
第六堂課
第七堂課
第八堂課
CSS 作業回顧
第三堂課
第四堂課
第五堂課
第六堂課
第七堂課
第八堂課
網站地圖
關於我
鳥哥自學網
>
首頁
第六堂課
6.1.A : 使用漸層的背景
6.1.B : 圓形外框大頭照加上厚重彩虹圓形
6.2.A : 多張底圖的處理方式
6.2.B : 背景放大到邊框的型態 cover/contain
6.2.C : 影像透明度的使用 opacity 的處理
6.3.A : 方塊內圖片上面疊上文字說明的統一格式處理
6.4.A : 多重圖示的轉動技巧加上萬用字元的呼叫使用
6.4.B : 圖示的重疊畫面展示 (五個圖示重覆)
6.5.A : 以漸變方式取代直接變化的 transition 功能
6.6.A : 以動畫方式讓滑鼠特效變成一直變動的畫面
6.6.B : 以動畫方式讓企鵝一直轉圈圈
6.6.C : 讓底圖的蜜蜂飛
6.6.D : 讓動畫持續輪轉
第五堂課
5.1.A : 使用方塊的留白與相關框線利用
5.1.B : 區塊標記的左右對齊方式 : margin-right: auto
5.1.C : 方塊加上圓角及陰影的方式
5.1.A : 使用自製框線 : border-image-source 的使用
5.2.A : 利用 display: inline-block 讓區塊標記在水平線上面對齊
5.2.B : 在小方塊外面加上一個大方塊來進行版面配置
5.2.C : 利用 vertical-align 讓元素對齊水平線上面
5.2.D : 利用 float 讓子元素漂浮在父元素上方
5.2.E : 父元素加上 overflow 來解決子元素 float 後的排版問題
5.3.A : 利用 margin 來𧭫方塊重疊的方式
5.3.B : 透過 z-index 指定圖層的上下順序
5.3.C : 透過 vertical-align 以及外層排版,定義三欄排版版型
5.3.D : 使用 position 為 relative 修改子元素的相對位置
5.3.E : 使用 position 為 absolute 修改子元素的絕對位置
5.3.F : 使用 position 為 fixed 增加固定在瀏覽器上面的元件
5.4.A : 進一步了解 overflow 的屬性值意義
5.4.B : 圓形大頭照的處理方式
5.4.C : 透過 visibility 隱藏答案
第四堂課
4.1.A : 使用 CSS 修改字體相關的功能顯示
4.1.B : 在字框與字體之間透過 padding 保留空白留白感
4.1.D : Google 與 Adobe 提供的字型顯示中文
4.2.A : 超連結的 :hover,:active, :focus 特效
4.2.B : 讓超連結變成區塊顯示(display: block)
4.3.A : :hover 用在其他任意的地方 !
4.4.A : 清單與 :hover 的同時應用
4.4.B : 清單特效 : 使用圖檔來取代前導符號
4.5.A : 空氣品質 (AQI) 的相關說明用 CSS 美化圖表
4.5.B : 空氣品質 (AQI) 的相關說明用 CSS 美化圖表 : collapsw 的框線重疊
4.6.A : 以清單來說明使用 ul li 會產生的後代繼承影響問題
4.6.B : 承上,使用 ul > li 討論後代就不會繼承的效應
4.6.C : 使用 display 搭配 :hover 討論隱蕆資料的特效
第三堂課
3.1.B :使用 CSS 的 style 取代 font,strong 等標記
3.2.A :使用 CSS 的 「數值單位」修改某些特性的大小
3.2.B :搭配 Body 的 CSS整體網頁風格的效果
3.3.A :直接在 head 內增加 style 設定 CSS 風格
3.3.B :在表格上面套用底圖的設計方式
3.4.A :使用 CSS 套用表格二個不同橫列的設計
3.4.B :統一表格的單一 class 設計方式
3.5.A :使用 id 取代 class 的功能
3.6.A :呼叫外部 CSS 風格設定檔
html 的相關資料