-
彙整
- 2021 年 12 月
- 2021 年 11 月
- 2021 年 10 月
- 2021 年 9 月
- 2021 年 5 月
- 2021 年 4 月
- 2020 年 9 月
- 2019 年 12 月
- 2019 年 11 月
- 2019 年 10 月
- 2019 年 9 月
- 2019 年 8 月
- 2019 年 7 月
- 2018 年 1 月
- 2017 年 11 月
- 2017 年 10 月
- 2017 年 9 月
- 2017 年 8 月
- 2017 年 7 月
- 2017 年 6 月
- 2017 年 5 月
- 2017 年 4 月
- 2017 年 3 月
- 2017 年 2 月
- 2016 年 5 月
- 2016 年 4 月
- 2016 年 3 月
- 2016 年 2 月
- 2015 年 6 月
- 2015 年 4 月
- 2015 年 1 月
- 2014 年 12 月
- 2014 年 11 月
- 2014 年 10 月
- 2014 年 9 月
- 2014 年 6 月
- 2014 年 3 月
- 2014 年 2 月
- 2014 年 1 月
- 2013 年 9 月
- 2012 年 12 月
- 2012 年 10 月
- 2012 年 9 月
- 2012 年 8 月
- 2012 年 7 月
- 2012 年 5 月
- 2012 年 4 月
- 2012 年 3 月
- 2011 年 6 月
- 2011 年 3 月
- 2011 年 2 月
-
其他操作
分類彙整: CSS 教學 – 網頁排版
CSS 教學:CSS 選擇器(選取器) -群組化
![CSS選取器 - css 群組化](https://i1.wp.com/www.flycan.com/article/wp-content/uploads/2018/01/css.png?fit=200%2C150)
當我們的 CSS 選擇器中有好幾個地方使用相同的設定時,可以把這幾個 CSS 選擇器合併,原本可能寫了 7~8 行相同的語法,合在一起後只剩短短的一小行,優化 CSS 並加快網頁速度。 閱讀全文
CSS教學 – 重複背景圖之語法練習
![步驟一:HTML架構](https://i1.wp.com/www.flycan.com/article/wp-content/uploads/2017/07/p1.jpg?fit=200%2C134)
今天要來分享的 CSS 語法練習,其實是之前有一篇「固定背景圖教學文」的延伸版,要教大家利用上一篇的網頁版型,來做重複背景圖片的語法練習。
如果是第一次加入的新朋友,要請您先參考上一篇之後,再來 follow 本篇教學才會比較銜接得上喔!請大家先準備好兩張素材圖片,我們就要進入正式的練習囉!
Ready~~~ Go!… 閱讀全文
【好站分享】「Flexbox Froggy」學習 Flexbox 的遊戲網站
![首頁為第一關畫面](https://i2.wp.com/www.flycan.com/article/wp-content/uploads/2017/11/01-1.jpg?fit=187%2C150)
最近小編發現了一個不錯的遊戲網站 – 「 Flexbox Froggy 」,所以來跟大家分享一下~
遊戲的主旨很簡單,就是利用輸入正確 Flexbox 語法指令, 來幫助畫面中的青蛙們回到荷葉上;很重要的一點:有繁體中文版耶~!
當然,語法指令還是需要用英文輸入的啦… 閱讀全文
W3C 規定~ 全部 HTML 標籤的 CSS 屬性預設值
![](https://i1.wp.com/www.flycan.com/article/wp-content/uploads/2011/02/fly015.jpg?fit=185%2C150)
每個 HTML 標籤在 CSS 中都有不同的預設值,例如預設的文字大小、預設的間距、預設的框格模型….等。例如 <h1> 的文字大小 預設值是 2em ,<h2> 的文字大小 預設值是 1.5em,<body> 的外間距是 8px… 閱讀全文
【設計資源】 – Google Fonts 免費雲端字庫-導覽篇
![google fonts index](https://i1.wp.com/www.flycan.com/article/wp-content/uploads/2017/05/001.jpg?fit=200%2C108)
在之前的設計資源分享文,我們跟大家介紹了新開放下載使用的思源宋體,以及「Google Noto Fonts」這個可免費下載字體的網站。
今天要跟大家進一步介紹的網站,是不僅可以下載字體到自己電腦裏頭使用,另外,還可以透過 CSS 語法功能,立即套用到網頁上的雲端字體庫 – 「Google Fonts」… 閱讀全文
CSS 教學 – margin-top 失效!外間距會直接影響到上一層
![](https://i2.wp.com/www.flycan.com/article/wp-content/uploads/2011/02/flycan151.jpg?fit=200%2C150)
調整內容的上間距 調整文字元素或圖片元素的上間距,理所當然是要使用 margin-top 語法,然而,當我們高高興興完成網頁排版,心想趕快收拾包包下班走人時,慘劇往往就發生在各個瀏覽器的不一致問題之中… 閱讀全文